scala's evolving ecosystem- introduction to scala.js

Scala's evolving ecosystem

Scala.js

Ayush K. MishraSr. Software ConsultantKnoldus Software LLP

Agenda

Why JavaScript? I hate Javascript

Introduction to Scala

What is Scala.js and Why?

Let's code

Why JavaScript

Typical to do web development without JavaScript

Why javascript, why we are bothering to do javascript.
beacuse as you know its typical to do web development without javascript.
ITs the only language, that's basically supported web browser.
So at some point you need javascript code.
ITs scripting language, not designed to scale large rich web application

Easy to learn

Now Javascript is easy to pick up because of the very flexible nature of the language. Because Javascript is not a compiled language, things like memory management is not big concern.

Easy to Edit

Its is easy to get started with because you don't need much to do so. As we know, its a scripting language, so the code you write does not need to be compiled and as such does not require any compiler or any expensive software.Prototyping Language

its a prototyping language. In a prototyping language, every object is an instance of a class. What that means is that objects can be defined, and developed on the fly to suit a particular use, rather than having to build out specific classes to handle a specific needEasy to debugThere are many tools like firebug to debug javascript. to trace error

I hate JavaScript Why?

Why we need to do compiling in JavaScript?

gained many new apis, but language itself is mostly the same. Some developers really like javscript, but they feel that there should be other features included in javscript. many platforms that compiles high level language to javascript. It removes many of the hidden dangers that Javascript has like: * Missing critical semicolonsyou can write better javascript code in othe language.

Major Reason:- to consistently work with the same language both on the server and on the client. In this way one doesn't need to change gears all the time

Languages that compile to JS

Typescript compilers that compiles in javascript and add some new features such as type annotations, classes and interfaces.CoffeeScript, Dart

Coffee script is very popular and targets javascript. One of the main reason of its popularity to get rid of javascript c like syntax, because some people apparently dislike curly braces and semicolon very much. CoffeeScript is inspired by Ruby, Python and Haskell. Google created Dart as a replacement of Dart. They are hoping that one day they will replace javascript.

Parenscript, Emscripten, JSIL, GWT. Js.scala

What is Scala

Scalable Language

A careful integration of object-oriented and functional language.

Runs On JVM.

Scala- an acronym for Scalable Language. a careful integration of object-oriented and functional language concepts.Scala runs on the JVM..scala.js supports all of scala language so it can compile entire scala standard library.

Features of Scala Type System

Implicit conversions

User-defined dynamic types

In Scala, one can define implicit conversions as methods with theimplicit keyword
case class ID(val id: String)implicit def stringToID(s: String): ID = ID(s)

def lookup(id: ID): Book = { ... }val book = lookup("foo")val id: ID = "bar"is valid, because the type-checker will rewrite it asval book = lookup(stringToID("foo")

User-defined dynamic types :- Since version 2.10, scala has special feature scala.dynamic, which is used to define custom dynamic types. it allows to call method on objects, that don't exist. It doesn't have any member. It is marker interface.
import scala.language.dynamics

empl.lname = "Doe". empl.set("lname", "Doe")when you call empl.lname = "Doe", the compiler converts it to a call empl.updateDynamic("lname")("Doe").

Scala.js

Compiles Scala code to JavaScript

Introduced during the 4th Scala
Days in June 2013

No need to sacrifice
JavaScript interoperability

compiles Scala code to JavaScript,

allowing you to write your web application entirely in Scala!.

Scala.js compiles full-fledged Scala code down to JavaScript, which can be integrated in your Web application. It provides very good interoperability with JavaScript code, both from Scala.js to JavaScript and vice versa. E.g., use jQuery and HTML5 from your Scala.js code.

Since scala as a language and also its library rely on java standard library, so it is impossible to support all of scala without supporting some of java. hence scala.js includes partial part of java standard library , written in scala itself

If you are developing rich internet application in scala and you are using all goodness of scala but you are sacrificing javascript interoperability, then you can use scala.js , a scala to javascript compiler. So that you can build entire web application in scala. A javascript backend for scala

Js-Scala and Scala.js

js-scala is a library while scala.js is a compiler.

.scala.js.scala.js.classjavascalacscalac

scala.js compiles your scala code to javascript code. its just a usual scala compiler that takes scala code and produces javascript code instead of JVM byte code.

on the other hand, js-scala is a scala library providing composable javascript code generator. You can use them in your usual scala program to write javascript program generator. your scala program will be compile into JVM byte code using scala compiler and executing of this program generates javasript program.

The main difference is that js-scala is a library while scala.js is a compiler. Suppose that you want to write a JavaScript program solving a given problem. In js-scala you write aScala program generating a JavaScript program solving the given problem. In scala.js you write a Scala program solving the given problem.

Why Scala.js

Powerful framework for type-directed interoperability with dynamically typed languages.

Accommodates both the functional and object oriented features of scala.

Covers whole Scala language and good part of Scala/java library.

Now-a days interoperability between statically typed and dynamically typed is getting demanded day by day that's why many statically typed languages are targeting javascript.statically typed means, when a type of variable is known at compile time. In dynamically typed means, when a type of variable is interpreted at run time.

interoperability with object oriented and functional features of javascript is essential but existing language has poor support for this. But scala.js interoperatibility system is based on powerful for type-directed interoperability with dynamically typed languages. It accommodates both the functional and object oriented features of scala and provides very natural interoperability with both language.It is expressive enough to represnt Dom, jquery in its statically and dynamically typed language. Scala has a very powerful type system with unique combination of features:traits, genrics, implicit conversion, higher order function and user defined dynamic type. As a functional and object-orientedlanguage, its concepts are also very close to JavaScript, behind thetype system: no static methods

Features of Scala.js

Support all of Scala

Support all of Scala (including macros!) except few semantic difference

Because the target platform of Scala.js is quite different from that of Scala, a few language semantics differences exist.



Very good interoperability with JavaScript code



Very good interoperability with JavaScript code

Integrated with sbt

Scala.js comes with an sbt plugin that facilitates compiling, running and testing with Scala.js.


Can be used with your favorite IDE for Scala



Generates Source Maps for a smooth debugging experience

You could keep your client side code readable and dubuggable even after you've combined it. When you build for production, along with minifying and combining your JavaScript files, you generate a source map which holds information about your original files.



Generates Source Maps for a smooth debugging experience

Integrates Google Closure Compiler for producing minimal code for production

its a tool for making javascript download and run faster. its a true compiler for javascript. instead of compiling form source code to javascript, it compiles javascript to better javascript. it parses your javascript, anlyze it, optimize code , remove dead code. it also checks syntax, variable reference.

Semantics Differences

Numbers and characters

Floats may behave like Doubles

Integer division by 0 is undefined

isInstanceOf tests are based on value

toString for integral Floats and Doubles

Continued..

Number and characters have same semantices on JVM except 4 exception

Since JavaScript doesn't have a native float type, we sometimes represent Floats using doubles/numbers, rather than with lower-precision 32-bit floats

Unlike the JVM where dividing an integer type by 0 throws an exception, in Scala.js integer division by 0 is undefined.

Instance tests (and consequently pattern matching) on any of Byte, Short, Int, Float, Double are based on the value and not the type they were created with.
Calling toString on a Float or a Double that holds an integral value, will not append ".0" to that value. This is due to how numeric values are represented at runtime in Scala.js

Unit

Exceptions

Regular expressions

Semantics Differences

toString() on Unit will return undefined rather than ().

Implemented on the top of JavaScript regexes.

ArrayIndexOutOfBoundsException is never thrown.
NullPointerException is reported as TypeError.
StackOverFlowError is unsupported.

scala.Unit is represented using JavaScript's undefined. Therefore, calling toString() on Unit will returnundefined rather than ().

JavaScript regular expressions are slightly different from Java regular expressions. The support for regular expressions in Scala.js is implemented on top of JavaScript regexes.

JavaScript interoperability

Calling JavaScript from Scala.js

Export Scala.js APIs to JavaScript

Continued..

A key feature of Scala.js is its interoperability with JavaScript code, which far exceeds that of many other languages targeting JavaScript.Scala.js exhibits both means to call JavaScript APIs from Scala.js, and to be called from JavaScript code.


Primitive Scala.js types

Continued..

When writing an application with Scala.js, it is expected that the main application logic be written in Scala.js, and that existing JavaScript libraries are leveraged. Calling JavaScript from Scala.js is therefore the most important direction of interoperability.

Because JavaScript is dynamically typed, it is possible to call JS libraries in a dynamically typed way. However, it is also possible to interop with static types, for better leveraging of Scala.

The package scala.scalajs.js (code on GitHub) contains static type definitions for all the types,

hese types have all the fields and methods available in the JavaScript API.


Implicit Conversions

Continued..

There are implicit conversions from corresponding Scala types and back:


Literal object construction

Scala.js

JavaScript

Continued..

Scala.js provides two syntaxes for creating JavaScript objects in a literal way.


Defining JavaScript interfaces with traits

Continued..

Most JavaScript APIs work with interfaces that are defined structurally. In Scala.js, the corresponding concept are traits. To mark a trait as being a representative of a JavaScript API, it must inherit directly or indirectly from js.Object.


JavaScript field/method names and their Scala counterpart

Continued..

Sometimes, a JavaScript API defines fields and/or methods with names that do not feel right in Scala. For example, jQuery objects feature a method named val(), which, obviously, is a keyword in Scala.


Calling Javascript with dynamic types

Continued..

Export Scala.js APIs to JavaScript

By default, Scala.js classes, objects, methods and properties are not available to JavaScript. Entities that have to be accessed from JavaScript must be annotated explicitly as exported. The @JSExport annotation is the main way to do this.

Scala.js sbt Setup

sbt

an open source build tool for Scala and Java projects.

native support for compiling Scala code

build descriptions written in Scala using a DSL

sbt Is an open source build tool for Scala and Java projects,

similar to Java's Maven or Ant.

native support for compiling Scala code and integrating with many Scala test frameworks

build descriptions written in Scala using a DSL

dependency management using Ivy

support for mixed Java/Scala projects

sbt Setup

Compiling

This will generate .sjsir and .class files for each class of the project.

The .class files are used by the Scala.js compiler for symbol lookup during separate compilation.

The .sjsir files are a binary representation of (extended) JavaScript code which can be linked to actual JavaScript code.

To run the .sjsir files, we invoke the Rhino JavaScript interpreter

Optimization

Optimizing

Fast-Optimize Full-Optimize

Optimizing

Fast-Optimize

The resulting file in the target folder will have the suffix -fastopt.js.

You can disable the optimization.

This will perform fast Scala.js-specific optimizations and write the resulting code to a single JavaScript file. You can now use this JavaScript file in your HTML page or in whatever way you like. The resulting file in the target folder will have the suffix -fastopt.js.

This is for development purpose.

Optimizing

Full-Optimize

The resulting file in the target folder will have the suffix -opt.js.

To make the resulting JavaScript even smaller (and usually faster as well), the sbt plugin integrates the Google Closure Compiler under the so-called full-optimizations.
This will call the Google Closure Compiler on the result of the fast-optimizations stage. Note that this can take a while and is therefore not recommended in the development cycle. The resulting file in the target folder will have the suffix -opt.js.

This is for production

Optimizing

Fast-Optimize

The resulting file in the target folder will have the suffix -fastopt.js.

You can disable the optimization.

This will perform fast Scala.js-specific optimizations and write the resulting code to a single JavaScript file. You can now use this JavaScript file in your HTML page or in whatever way you like. The resulting file in the target folder will have the suffix -fastopt.js.

This is for development purpose.

Launcher

The resulting file in the target folder will have the suffix -launcher.js.

Used to run main class.

If you want the code which is used to run the main class to be written to a file, you can set ScalaJSKeys.persistLauncher := true. Note that this will require your main class to be either unique or explicitly set (mainClass := Some()). The resulting file in the target folder will have the suffix -launcher.js.

https://github.com/knoldus/ScalaJs_Weather_Report

References

http://www.scala-js.org/

https://groups.google.com/forum/?fromgroups#!forum/scala-js

http://stackoverflow.com/questions/tagged/scala.js

http://www.parleys.com/play/53a7d2cbe4b0543940d9e555
http://vimeo.com/87845442

http://www.parleys.com/play/51c380bfe4b0ed8770356866

Piyush Mishra

Thanks