&yet has released Ampersand.js, a "non-frameworky" framework for building JavaScript applications, heavily inspired by Backbone.js. Ampersand.js distinguishes itself from Backbone.js primarily by being more modular and adding some new (fully optional) features.
In the announcement on their blog, &yet talks about their deep investment in Backbone.js and why they eventually decided to divorce themselves from it, and build their own framework:
One of the problems we’ve had at &yet especially when working on large Backbone applications is a sane way to document the type of properties a model is supposed to contain.
Backbone models, by default, don’t enforce any structure. You don’t have to declare anywhere what properties you’re going to store. As a result, people inevitably start saving miscellaneous properties on models from within a view somewhere, and there’s no good way for a new dev starting in on the project to be able to read the models and see exactly what state is being tracked.
To solve this problem and to enforce additional structure, I wrote a replacement model called "HumanModel" that is consistent with the philosophy explored in depth in the book Human JavaScript. This model, which has now morphed into ampersand-model, forces you to declare the properties you’re going to store, and also allows you to declare derived properties, etc.
Originally we used our replacement models within Backbone Collections, but we started running into problems. Backbone generally assumes that you’re storing Backbone.Model models in collections. So when adding an instantiated model to a collection, Backbone would fail to realize that it’s already a model. My patch to Backbone was merged and fixed this, but there have been other areas where we’ve wanted more flexibility.
The key problem &yet found with Backbone is its bundeling of features: in &yet's applications, more flexibility was required to swap in and out features. Therefore, in Ampersand.js every piece of functionality is organized into its own CommonJS module. These modules are distributed and managed via npm, node.js' package manager. Browserify is used to "compile" these modules into a single (possibly minified) JavaScript file that runs in the browser. As a result, any application can pick and choose only the modules required, which can be easily combined with any other module from NPM.
Ampersand.js currently consists of about two dozen separate modules, hosted on separate Github repos, including a command-line tool to easily set up new Ampersand.js projects using &yet's recommended structure, and to generate additional scaffolding for forms, views, collections and models.
The most important (and best documented) modules in Ampersand.js are:
- ampersand-state: similar to Backbone.js' models, except they are not tied to RESTful services in any way. This functionality is added in ampersand-model. Properties in state classes can be typed and those types will be verified when assigned.
- ampersand-model: extends ampersand-state by adding methods that handle loading, saving and syncing of objects with a server.
- ampersand-collection: the equivalent of Backbone.js collections, but without methods to load or save collections.
- ampersand-rest-collection: extends ampersand-collection with methods to load and save a collection to a RESTful service.
- ampersand-view: similar to Backbone.js' views, a mechanism to bind models to the DOM.
- ampersand-form-view: a module to easily build solid forms with data binding.
- ampersand-router: a router that updates the URL in the browser without actually reloading the page. Much of the code in this module is copied from Backbone.js, with some extensions.
Ampersand.js should be easy to get started with for anybody who's familiar with Backbone.js. It is available from Github and NPM under an MIT license.
