MV Frameworks

An overview of Model View JavaScript Frameworks.

Many high-quality MV Frameworks available today. The problem is not the availability but rather selecting the one that is the best for your project.



Overview


At this point you have a good understanding of the MVC, MVP, and MVVM design patterns and appreciate that they may offer a solid architectural foundation for your JavaScript projects.

To build your own MV framework can be a daunting task. Fortunately, there is no reason to do so. There are many open-source projects available that have been field-tested in high-performance deployments, so all the work is done for you.

Assuming you have decided that you need the additional structure that an MV framework can offer, the only thing left is to choose the right framework for your project. Unfortunately this is easier said than done because it takes time to do the research and determine which one is most appropriate for you.

When looking for a framework there are some criteria to keep in mind:

  • Which MV model -- that is, MVC, MVP, MVVM, or MVA -- best fits your project style?
  • Is the framework stable, mature, and has it plenty of successful real-world deployments.
  • Does the framework have good documentation with good example code
  • Is the framework actively maintained; are bugs resolved quickly and effectively?
  • Does it have an active community behind it that is willing to support each other?
  • Is the framework opiniated or not? Are you willing to totally commit yourself?

The last point about opiniated frameworks is important. Some frameworks stay out of the way and let you use it when you need it. In other words, you can use it as much or as little as you like in your pages. Others however, require that you follow their structure to the letter for the entire project or else things stop working. These are called opiniated frameworks, i.e. they have strong opinions on standards, layout, code organization, and other conventions.


Below we have listed the most high-profile frameworks in order of popularity. Mind you that things change very quickly in this space and what is fashionable today, may be out of favor tomorrow. So, take this ordering with a grain of salt.

  1. Backbone. Small framework, less than 1000 lines of code. MVC, with C standing for Collections. Includes rich Routing. Many successful deployments at high-profile sites. Mature.
  2. Ember. Large framework, both in size and functionality. Inspired by Rails and Cocoa. Well thought out but opiniated. Intended to control entire web page. New.
  3. Angular. Developed by Google. Includes templating and data binding. Designed with an eye towards the future: "this is where web development is going." MVVM like. Relatively new.
  4. Knockout. Pure MVVM. Includes templating, declarative data binding, and observable models. No built-in routing. Not very opiniated: allows limited usage. Mature.
  5. Spine. Very small framework. Derived from Backbone without Collections, but adds numerous small modifications. Uses Models and Controllers. Relatively new.
  6. Batman. Primarily for Rails and CoffeeScript developers. Rich models, views, and controllers. Highly opiniated: you must follow their conventions. New.

The least opiniated ones are Backbone, Knockout, and Spine. They are reasonably agnostic and can be used on an as-needed basis in most environments. It is interesting to note that the highly opiniated frameworks, Ember and Batman, have close ties to Ruby on Rails which itself is an opiniated development framework that has been built around the convention over configuration concept. Rails developers will most certainly lean towards these frameworks.

Furthermore, Knockout has evolved from the .NET MVVM arena, so developers that have experience with WPF or Silverlight in .NET will feel quickly at home with Knockout.

In our 'Patterns in Action' section we make use of Backbone.



  MVVM