Tag Archives: activejs

Improvements to ActiveJS

The ability to create relations between the different objects of the application (a user has many articles, a section has one HTML content) was believed to be implemented in ActiveJS as it is implemented in Ruby on Rails.

An attempt to define the relations between articles and sections was implemented as follows:

[code lang="js"]
Section = ActiveRecord.create('sections', {});

Article = ActiveRecord.create('articles', {
created_at: '',
updated_at: ''
});

Section.belongsTo( Article );
[/code]

And when relations were to be set between instances of the User and Article class:

[code lang="js"]
article1 = Article.create({
created_at: now(),
updated_at: now()
});
section1 = Section.create({ });
section1.createArticle( article1 );
[/code]

It appeared however that those two assumptions were false. ActiveJS in its official implementation requires the following to be written:

[code lang="js"]
Section = ActiveRecord.create('sections', {
article_id: ''
});

Article = ActiveRecord.create('articles', {
created_at: '',
updated_at: ''
});
Section.belongsTo( Article );
[/code]

[code lang="js"]
section1 = Section.create({ });
section1.createArticle({
created_at: now(),
updated_at: now()
});
[/code]

The fact that it was not possible to use pre-existing objects when creating a relation between two objects penalising problem, as it was actually impossible in the application to create a presentation once all of its slides were created.

Instead of working around those two issues, it was decided to spend some time implementing the missing features. The first two snippets of code can now successfully be used with the improved version of ActiveJS and additional unit tests were added to the existing one to ensure that those change will still work with future versions of the framework.

Server-side JavaScript and working with ActiveJs

In my effort to make it easy to contribute to ToDoSo, I have chosen JavaScript as the server side technology for this project.

Although Ruby on Rails is the technology of choice for most Web applications that appeared lately on the Internet [1. twitter - most job offers require to be familiar with this framework -, github, uservoice, zendesk, lighthouseapp - all of them using the Ruby on Rails cloud engineyard - and getsatisfaction - created by rubyredlabs - to name a few], it requires to learn not only HTML, CSS and JavaScript for the client side development but an additional technology for the server side development (a new language and a complete Framework in the case of Ruby on Rails).

Some would argue that Ruby is a really simple and rather self explaining language, that Ruby on Rails is a mature framework and altogether they make Web development a breeze once you know how to use it. I agree, but I also know that JavaScript is a great language as well and that it would lower the technological barrier if it was possible to use it on the server side with a framework comparable to Ruby on Rails.

There are already a large number of server-side JavaScript interpreter listed on wikipedia and on the ServerJs project page of Mozilla. There is also Jaxer, developed recently by Aptana. I recommend to watch the introductory videos on aptana.tv to have a brief overview of what is possible with it, but in brief its main features are:

  • the possibility to access and modify the DOM on the server before it is sent to the client (you can even use the canvas API to dynamically create images)
  • the possibility to share code between the client and the server sides (you only have to write your form validation logic once)
  • the possibility to call server side function from the client side (using invisible ajax requests)

Most of those server-side interpreters are based on open-source JavaScript interpreters that are to be found in modern web browsers [2. SpiderMonkey and V8 mainly, I haven't heard about any based on SquirrelFish or TraceMonkey so far but it seems that Jaxer will switch to the latter] which means that they benefit from the same speed improvements that we saw recently in Web browsers.

There are also few JavaScript MVC frameworks similar (at least in the spirit) to Ruby on Rails built on top of this server technologies: the most advanced ones seem to be Helma NG and ActiveJS. Both projects however, still seem to be in an early stage of development. Once again it could take ages to make a deep comparison of those and it wouldn’t help to get ToDoSo real. Instead you’d rather choose one and stick with it for better or for worse.

I’ve chosen ActiveJS because it is built originally for Jaxer and thus doesn’t require any configuration to get started if you are developing with Aptana Studio. Moreover, the ORM layer of ActiveJS (ActiveRecordJS) offers an abstraction not only to MySQL and SQLite databases (on the server side) but also to client-side persistence such as Google Gears or the SQLite database that is to be found in Safari and the iPhone Web browsers. Its route component is similar to the Ruby on Rail’s one but also offers deep linking on the client side, in the Jaxer spirit.

Hacking into ActiveJS

Because ActiveJS is still young, it is really likely to miss some features that might be important for your project and the best solution will be to hack into it instead of waiting for someone else to do the job. So here is how to configure a development environment to be able to build ActiveJS from sources (as a reminder for myself):

  1. I assume you are developing with Aptana Studio and you have the Jaxer and Git plugins installed.
  2. Fork the ActiveJS repository on Github.
  3. Import it as a project in Aptana (File > Import > Git Repository, choose git+ssh as the protocol and don’t change the username)
  4. Ruby needs to be installed in its 1.8 version because the build script depends on ftools, which is deprecated in ruby1.9. With Ubuntu and probably other linux distribution, the ruby-dev package is required as well.
  5. The package rubygem is then required to install most dependencies of the build script: json, packr (beware, this might soon be replaced by YUI) and rdiscount. In any case look at the beginning of build.rb to find the dependencies of the script.
    [code lang="shell"]$ sudo gem install rdiscount [/code]
  6. Remember to configure your editor to use 4 spaces instead of tabs and try to respect the coding style.

Et voilà! You’re ready to change the files in the src folder, build active.js, test your modifications and send pull requests to the original branch.

[code lang="shell"]
$ ruby1.8 ./build.rb compress
[/code]

My first tasks will be to improve the relationship features because it doesn’t behave as a proper ORM layer currently and to add support of HTML5 elements to the view component.