A Look at Some JavaScript Alternatives
While open web standards are about freedom and access, there is one freedom that open web developers are not afforded by the standards, and that is the choice of languages used for web development.
If you are a web developer, HTML, CSS and JavaScript are you bread and butter, which can be rather annoying if you prefer marmalade instead. While open standards are awesome the very fact that they are standard or in other words unchanging means that there will be those who love them and those that hate them.
Native developers are used to having a plethora of choices when it comes to development: Assembly, C, C , C#, VisualBasic, Objective-C, Ada, Java, Python, Ruby, Lisp, Perl or heck even JavaScript! Native developers are spoiled by choice, and all web developers have is JavaScript.
Or do they?
While browsers do not support running any JavaScript alternative scripting language other than JavaScript, web developers have found ways around this limitation to give them access to a growing number of languages. Recently Google announced a JavaScript alternative called Dart that they had been developing themselves. So this is perhaps the best time to take a look at some alternatives to JavaScript. In this article we take a look at five such languages.
But before we get into that, how would such languages even work if the browser doesn’t understand them? And the answer is, all these languages “compile” to JavaScript. What this means is that while you can code your application in any one of these languages, using a preprocessing tool, whatever code you write will be converted to the equivalent JavaScript. It is this “compiled” JavaScript that you will finally include in your web page so it can run in the browser. This is not a strange concept, as those familiar with the history of C will know that it was originally called “C with Classes”, and would first compile to C before being compiled to an executable by the C compiler.
It is important to understand that these languages don’t add any new “features” to JavaScript. What you can do is still limited by the limitation of the browser and JavaScript, but how you code it will differ.
CoffeeScript
This is one of the more popular and active JavaScript alternatives. It is a favoured scripting language of the Ruby on Rails web development framework.
The CoffeeScript compiler is written in CoffeeScript itself, and is available as a package for Node.js. In fact you don’t even need to compile CoffeeScript code to JavaScript before running it in the browser, you can just include the compiler along with the CoffeeScript code to have the compilation performed in the browser itself. This is great for testing, but is something that obviously doesn’t make sense in a production website.
CoffeeScript has been inspired by Ruby, Python and Haskell, so you will find borrowed features and syntax from those languages. The code sample is fairly reminiscent of the above languages for those familiar with them:
This code defines a function called square that returns an array containing the squares of the first ‘n’ numbers. After that we use that function to write the squares of the first 10 numbers to the page. Here is the equivalent JavaScript that it evaluates to:
As you can see the CoffeeScript code is much more compact and to the point. CoffeeScript has numerous syntax improvements for working with classes, objects, arrays, loops and so much more. It is well supported, and the JavaScript it produces has equivalent, or sometimes even better, performance as hand-written JavaScript.
ClojureScript
Clojure (with a ‘j’) is a language that compiles to run on the JVM, so it can be considered an alternative to Java. ClojureScript is a subset of the Clojure language that can be compiled to JavaScript and run in the browser.
Do not confuse Clo(j)ure with Clo(s)ure, which are a set of tools by Google for optimizing JavaScript. In fact, Google Closure tools are a big part of Clojure where they are used to optimize JavaScript produced by Clojure. Yes, it’s a little confusing, even more so when you consider that Clojure is pronounced as “closure”.
For those looking from a break from the usual curly braces and C-like syntax, ClojureScript will be a fresh breath of air. It is a dialect of List, and thus has a completely different syntax. Here, take a look at the same example, done in ClojureScript:
This too is defining a function called “square” that returns a list of all the squares of all numbers up to “n”. The “interpose bit adds a comma between each number, and the reduce bit combines them as strings. The “.write js/document” bit is calling the JavaScript “document.write” function.
The entire optimized code for this is around 2000 lines! So we can be excused for not providing it here. The reason for this is that ClojureScript defines provides an entire framework that is working behind the scenes to improve the way JavaScript works, and unfortunately that framework isn’t going to go away if you don’t use it. In short, ClojureScript is for creating full-fledged web applications -not for “Hello World” examples-and that is where it will shine.
Even so, here is the relevant portion resultant JavaScript from the above code:
haXe
This language is more than just a JavaScript alternative, rather JavaScript is one of the alternatives it provides for outputting code. Code written in haXe can be converted to source code (or bytecode) for Flash (for both AVM1, or Flash 6 to 8; and AVM2, Flash 9 onwards), Neko, PHP, ActionScript, JavaScript, C , Java, and C#. Java and C# are still in development.
This essentially means that you could write your entire web application in haXe! From the server-side code (running as PHP, on the Neko VM or even C ), the client side JavaScript, the client-side Flash content, and even the iPhone app (in C ) – why not!
With code shared between server and client one can pass data easily from client to server as the same classes can be used on both side. Code can be shifted between client and server with east before finding the perfect mix of client and server performance. Over and above the benefits of one language across platforms, haXe brings type checking to PHP and JavaScript, which lack this feature, a powerful package and class syntax and much more.
haXe will be familiar to those already know ActionScript / JavaScript as it is based on ECMAScript 4, at one time a successor for JavaScript, and the basis for ActionScript. So let’s take a look at a sample, the same example again:
The “main” function of the application class will be called automatically on launch. Here too the code is rather too long (over 300 lines) to include in the article, however the relevant bits follow:
Dart
Finally we come to Dart, the new JavaScript alternative introduced by Google. The fact that Google is behind it makes Dart quite important, not only because they created it, but because they want it to eventually become a language supported in all browsers – directly, without translation to JavaScript. It is a little ironic a Google employee proposed making the script tag’s type=”text/javascript” optional, because JavaScript was the only scripting language supported by browsers.
Dart adds a lot to JavaScript while keeping a similar syntax. A JavaScript developer will not find it difficult to understand Dart code or write it. The syntax and feature set of Dart seems to have been influenced by the need to make code easier to optimise. Dart makes it simpler to create web applications, rather than simple scripts.
Dart includes Classes and interfaces for more structures web applications, and an optional types that can help make the code easier to understand and optimise. Dart applications have a “main()” function that is executed to begin with. Dart also has a system of libraries that will allow easy reuse of code.
Currently the compiler for converting Dart code to JavaScript has to be built from source, as there is not prebuilt binary for any platform. However, a light IDE based Eclipse called “Dart Editor” is available that does the compilation for you.
Now let us take a look at the same code once again from a Dart perspective:
This could obviously have been done without a class, but this can serve as an example. Now, if you were shocked that haXe produces a 300-line JavaScript, and Clojure produced 2000 lines of JavaScript, we hope you’re sitting down now; because this above code translates to 167472 lines of JavaScript and weighs around 6MB! This code includes the JavaScript implementation of all of Dart’s features and libraries. Dart is still in development and this is clearly very un-optimized code even if it is for the entire framework. Of course when / if it is supported in the browser you will need to only include the above code. Printing even the relevant bits of JavaScript here will be a waste of space, but you are free to try the above sample in the IDE to see the code it produces.
GWT, RubyJS and Pyjamas
GWT or Google Web Toolkit is a framework for developing client-side web applications using Java. It should be listed above however it is more than just a Java to JavaScript compiler. It provides an entire framework and toolkit, which includes a declarative UI coding language, a UI designer, widgets, etc. that call all be used in Java, but compile to JavaScript. In the process GWT also optimizes and minimizes your code.
RubyJS and Pyjamas are ports of GWT that work with the Ruby and Python languages respectively. So if you are interested in coding in Java, Python, or Ruby you should check out GWT, Pyjamas and RubyJS respectively.
Opa
Opa isn’t just an alternative to JavaScript, but an alternative to the entire server and client stack of your web application. It is a language designed specifically for making web applications that will run on multiple clients, and servers. To that effect it includes a programming language, a server and even a database.
To create a web application, you write a code in Opa, which then compiles to an application. That application now handles bother the server side (handling requests, accessing the database etc.) and the client side (the user interface, sending requests to the server etc.).
Both the code that has to run on the server, and the code that has to run on the client will be written as part of the same application, and Opa will automatically create the HTML-based interface with jQuery for interactivity. What part of your code goes to the server and what to the client is managed automatically!
Emscripten
Emscripten is a tool that can compile LLVM bytecode to JavaScript, and thus opens up the web to a plethora of native languages. LLVM code can be generated from a large number of languages.
With Emscripten you can actually run C and C code on the web! Of course you will not get the same level of access of native features, nor the performance, however you will be able to convert C / C libraries to JavaScript for use in web apps.
For example, Ensripten has been used to compile OpenJPEG to JavaScript, thus allowing browsers to show JPEG 2000 images and Poppler a PDF library, can render PDFs without a plugin. Even Python, Ruby and Lua interpreters have been ported to the web via C.