Scripting tech is hotter than ever these days. Thanks to innovative projects like Jquery, there sure seem to be a wast array of tools, libraries and frameworks flying around the front and back end develeopment spaces. Here are five projects that have made some noise in recent years that you might have missed in the blur of innovation, but should definitely give notice to.
- CoffeeScript
CoffeeScript was created and released to Github.com in 2010 by Jeremy Ashkenas. While still a relatively young entrant into the world of web scripting languages, CoffeeScript has gained a considerable amount of support, especially within the Ruby community and is now one of the most watched projects on Github.CoffeeScript aims to implement a more expression based and naturally typed language for developing front end code than regular JavaScript. It hopes to add the same type of syntax brevity that has helped languages like Python, Ruby and Haskell enjoy popular success.
One of the biggest perceived benefits of CoffeeScript is that its expression based syntax allows you to write significantly less code than traditional JavaScript applications and absolve the coder of the perceived unnecessary inclusion of brackets and syntax bloat.
As just one example, the keyword function has been replaced in CoffeeScript by the -> symbol, achieving a 75% savings on characters alone.
An example (from http://ryanflorence.com)
JavaScript using Jquery:
var widget = { attach: function () { this.el.bind('click', $.proxy(function (event) { doStuffWithThis(); }, this)); } };Same code written as CofeeScript:
widget = attach: -> el.bind 'click', (event) => doStuffWithThis()The tradeoff for this code savings and freedom from the perceived complexities of JavaScript itself is that you have to pre-compile your CoffeeScript to JavaScript before running it in a browser. To do so requires a server with Ruby and the CoffeeScript compiler installed.
Because of this, CoffeeScript can be harder to debug since the errors you will be looking through in Firebug or Chrome won’t be a one to one match with your original source code after it is compiled. With a little time and practice though, this process likely becomes much smoother and more intuitive.
Should you try or ignore CoffeeScript? That’s up to you. It’s never a bad idea to keep abreast of things to stay at the top of the ever changing world of web tech.
- Dart
First came the landmark Google Search. Then Chrome and Chromium OS. Then Android. Now Google even has created a new client side web scripting language called Dart. While CoffeeScript aims to simplify the syntax and natural language for developers, Dart aims to change the game of client side scripting entirely. It is written the way Google believes a language to support coding for web browsers and the DOM should work.
So why rewrite JavaScript? Well there have been a few good reasons put forth:
JavaScript was first written in 1995 as a competitive tool to battle Microsoft and their scripting language, VBScript.
There have been dramatic changes to the way scripting in the browser has occurred since its inception and JavaScript the language has not really kept up with the times.
Syntactically, JavaScript mimics Java, but with a large number of important differencesGoogles aim is to fix all these inherent issues with Dart. And as evidence by the release of Dartium, an experimental release of Chrome with Dart support built in, they aim for it to be more than merely something that gets converted down to JavaScript (which is how the current implementation works when not using Dartium).
So there are pluses, but minuses as well.
Many in the web community feel Dart to be an unnecessary rewrite of JavaScript. And with Microsoft already having launched and standing behind its own object-oriented extension to JavaScript called TypeScript, it feels like a rehash of two giant tech companies trying to promote their own customized, fragmented, non-standardized technologies. Bring back any flashbacks of the browser wars of the 90’s?
Example (Source: Wikipedia)
import 'dart:math' as math; class Point { final num x, y; Point(this.x, this.y); Point.origin() : x = 0, y = 0; num distanceTo(Point other) { var dx = x - other.x; var dy = y - other.y; return math.sqrt(dx * dx + dy * dy); } } // All Dart programs start with main(). main() { // Instantiate point objects. var p1 = new Point(10, 10); var p2 = new Point.origin(); var distance = p1.distanceTo(p2); print(distance); } - Node.JS
Server-Side JavaScript has been around since the birth of the JavaScript language way back in 1995. But it wasn’t until node.js arrived that it started to become a must have option for scripting actions on the web server.Node.js is designed to be a faster and lighter weight replacement for apache and web server software altogether. It includes not only the Google V8 interpretation engine, but a library of helper modules and built in functionality as well. To use Node, you set up scripts that listen to ports on your server. These virtual Daemons respond to and handle the requests and respond just as one would expect.
One of the biggest points of confusion surrounding node always seems to be how someone goes about getting it running and using it (kind of a big relevant point I would say). Like many new up and coming technologies, there isn’t a wide variety of documentation around node. The most hardcore of developers who know node seem to swear by it, but for the vast majority of professional developers, it’s still comparable to the attractive girl at the bar. It looks like something you want to use, you just never know where to start. Or is that just my problem?
var ?http ?=? require("http") var? server? =? http.createServer(function(request,?response) ?{ ??response.writeHead(200,?{ ????"Content-Type":?"plain/text" ??}) ?? response.write("Hello?Worldn") ?? response.end() }) server.listen(8080) console.log(">?SERVER?STARTED") - Haxe
HaXe is another relative newcomer to the web scripting language game, though it has never seemed to have gotten the type of mainstream attention of other JavaScript tools or libraries.Haxe (supposed to be pronounced “hecks”) dubs itself as a universal language that can be interpreted and recompiled into a variety of other formats like ActionScript, JavaScript, C++ and even ObjectiveC! Think of the motto “Code once, use everywhere!”
The main benefit of learning and using Haxe would be to code a client side web app using ActionScript/Flash conventions and then have the ability to output a version in JavaScript with little to no additional coding. You could also port your application to the server in PHP or to a standalone app via Java and C++.
One of the main augments against HaXe, like other technologies on this list, has been the learning curve associated with the language and the need to compile everything before testing and deploying it. Similar arguments arise in debugging as with CoffeeScript, the original Haxe code is not the same as the compiled output.
For large scale web applications with requirements for several different publishing platforms, Haxe might be worth the trouble though.
Native Haxe:
package utils; import haxe.Http; class URLParser { public var url : String; inline static private var _parts : Array= ["source","protocol","authority","userInfo","user","password","host","port","relative","path","directory","file","query","anchor"]; public function toString() : String { var s : String = "For Url -> " + url + "\n"; for (i in 0..._parts.length) { s += _parts[i] + ": " + Reflect.field(this, _parts[i]) + (i==_parts.length-1?"":"\n"); } return s; } public static function parse(url:String) : URLParser { return new URLParser(url); } } - Backbone.JS and Underscore.JS
Last and certainly not least is Backbone JS. In a world where PHP MVC frameworks are now a dime a dozen and Rails has become the de facto standard for MVC development in Ruby, Backbone is a lightweight MV* implementation of the popular design pattern written in JavaScript and created by Jeremy Ashkenas. If you said “Isn’t that the CoffeeScript guy?”, you get 2 points.I said MV* for this because Backbone is designed to be flexible enough to be considered an MVC or an MVVM framework.
Backbones design is such that it provides a base of functionality and structure that data heavy web applications will need, while also not getting too granular so as to handicap developers from making their own decisions. This is always a good thing as many times, frameworks can lock you into their particular way of building functionality around it which can many times make integrating it into exiting workflows difficult.
var Sidebar = Backbone.Model.extend({ promptColor: function() { var cssColor = prompt("Please enter a CSS color:"); this.set({color: cssColor}); } }); window.sidebar = new Sidebar; sidebar.on('change:color', function(model, color) { $('#sidebar').css({background: color}); }); sidebar.set({color: 'white'}); sidebar.promptColor();On top of all you get with Backbone itself, you also get the Underscore.JS library as well. Underscore provides a wide variety of helper functions to help streamline your daily development and solve some inherent JS functional deficiencies. One of the best and most powerful tools in the Underscore toolkit is the template function which lets you embed JavaScript micro-templates and dynamically populate them at run time with JSON or JavaScript data objects.
Another alternative is the Lo Dash version which adds even more capabilities and some pretty syntax and JS engine quirks support as well.
For more on Backbone, see Alex Bachuk’s presentation on Backbone from a recent Stamford I/O meetup.
