SilverStripe

Announcing the release of Concrete, SilverStripe 2.4's jQuery webapp library

Posted by Hamish Friedlander on 20 October 2009

Update (3 December 2009): Concrete has now been renamed Entwine.

We'd like to announce the release of the Entwine and Selector libraries for jQuery.

Developed by Hamish Friedlander, and partially sponsored by SilverStripe, this library will provide the architectural underpinnings for JavaScript in SilverStripe v2.4.

Although initially developed for use with client sites, the library has proven so useful that it's been spun off into an independent project. It lets developers write frontend web-application code in a clean and extendable manner—which is important in SilverStripe to ensure that, when the system needs extending for a particular site, the architecture doesn't get in the way.

For the techies in the room:

Entwine provides a brand new model of JavaScript code organisation; a replacement for object oriented programming that is focused on adding functions to DOM elements based on their structure and content. It’s a merging of the model and view layer that initially seems weird, but can give very powerful results.

We’re taking ideas from Prototype’s Behavior and Low Pro libraries and jQuery’s Effen and Live Query libraries. However, we're extending the concepts of those libraries to provide a complete alternative to traditional OO design; self-aware methods, inheritance, polymorphism, constructors and destructors, namespacing, and getter/setter style properties, all without a single class definition.

Compared to jQuery.plugins and jQuery.UI widgets, Entwine provides:

• code clarity — the code structure leads to more readable code
• extensibility — specificity-based method selection allows the injection of logic almost anywhere without monkey patching
• greater organisational capabilities — syntax promotes modularity
• reduced name clashes — powerful refactoring-free namespacing eliminates name pollution

A key component of Entwine is Selector - a CSS selector engine developed in conjunction with Entwine to give it maximum performance. For the use patterns it is designed for, it can out-perform jQuery's native Sizzle selector engine by an order of magnitude.

A taste:

$('div').concrete({
    highlight: function(){ 
        this.effect('bounce');
    }
});
$('div.important').concrete({
    highlight: function(){
        this._super();
        this.animate({background: 'white'});
    }
});
$('#namediv').highlight();

As well as the source and a tutorial, there is an 18-minute screencast available to help introduce the new concepts:

8 Comments. Add Yours Tags: javascript, code