MontageJS

MontageJS (or Montage) is an open-source JavaScript framework for building scalable single-page applications. It aims to simplify the development and maintainability of expressive HTML5 applications by employing native application frameworks. With Montage, developers can build and extend reusable user interface components and modules, bind properties among components and controllers, and synchronize DOM updates to ensure a smooth user experience, especially on resource-constrained devices.

Development History

Montage development started under Benoit Marchant and his team while at Motorola Mobility, from August 2010 to July 2012. The project was open-sourced on GitHub in July 2012 under a BSD license. Montage is currently maintained by a Silicon Valley startup whose employees include Marchant and core members of the original development team.

The ideas behind Montage date back to Marchant's tenure at Apple (1999−2010) where he worked on native (desktop-like) user interfaces written in JavaScript. Marchant's goal at the time was to create the equivalent of proven technologies such as Cocoa and WebObjects, but for the web and on the client side to facilitate building applications in HTML, CSS, and JavaScript. The result was Gianduia, a rich Internet application framework introduced by Apple at its 2009 World of WebObjects Developer Conference.

In 2010, when Marchant had the opportunity to join Motorola Mobility to work on a new framework for mobile, he took the lessons learned at Apple to build Montage from the ground up using the model–view–controller (MVC) design pattern to partition a Montage application into logically distinct units. Although it's evolving, Montage has been used to build production-ready applications.

Montage transposes the designs and patterns of native application frameworks onto the field of web-based application development. However, Montage differs from its counterparts because it doesn't introduce a new syntax for the web. Instead, it uses a Cocoa-like API to create a clean layer of abstraction on top of the web stack using modular, self-contained components, real objects and collections, and an API that allows you to observe changes on these objects and their properties or collections.

Features

Montage builds on ECMAScript 5, HTML5, and the CommonJS module system popularized by Node.js. It provides the functionality to build graphical user interfaces providing access to both a set of opinionated UI components as well as standard DOM interface components. However, instead of using a templating system like Mustache, for example, Montage lets developers craft user interface components as stand-alone web pages. An application is merely a component's template opened directly in a web browser. The template contains a DOM skeleton and may require some CSS, but it comes to life with the inclusion of a component object model, distinct but connected to the DOM.

Montage also provides string and value manipulation, serialization, and other functions that are not directly tied to the graphical user interface. It uses getters and setters to bind properties, so it maintains performance even as the number of bindings grows. It implements a managed draw cycle, a key part of the Montage architecture, that separates read and write operations at scheduled intervals, so it doesn't compromise performance. And it uses event delegation to manage event handling and dispatching to improve application performance.

Part of the MontageJS ecosystem are tools that provide a better developer-optimized experience. These include an initializer, Minit, which generates starter template applications and components, as well as a module system intended for front-end development of web applications using NPM-style packages called MR (Montage Require).

Montage also comes with a command line tool that translates a developer-optimized experience into a user-optimized experience called Mop (short for Montage optimizer). Mop outputs production-ready Montage applications by reducing the overall file size of the application and creating bundles that can be preloaded or distributed among multiple downloads, to reduce the number of requests and allow developers to release Montage applications with restrictive Content Security Policies.

Compatibility

Montage depends on standardized browser features and works best in modern browsers, including Google Chrome, Firefox, Safari 5+, Internet Explorer 10, Safari Mobile, and Android browser.

See also

* ReactJS

* AngularJS
* Backbone.js
* Cappuccino
* Ember.js

Releases

* July 10, 2012 - 0.11 - first public release
* November 12, 2012 - 0.12
* June 10, 2013 - 0.13
* December 9, 2013 - 0.13.9
* January 16, 2014 - 0.13.11
* February 25, 2014 - 0.14
* March 6, 2014 - 0.14.4
* March 12, 2014 - 0.14.5
* May 3, 2014 - 0.14.10

References

{{Reflist

JavaScript programming tools
JavaScript libraries