What is annoying in JavaScript world, is that there is a new framework every day.
I have been playing around with MVC frameworks, trying to find the pros and cons of each.
I will try here to write some thoughts about my finding.
These are just thoughts and in no way they are detailed covering of the differences between them.

  1. Knockout
  2. The easiest to learn among all the above frameworks was with no doubt is Knockout.
    Specially if you are familiar with MVVM idea, then you will find yourself sprinting in Knockout with no struggle at all.
    Knockout helps you bind data to your html, with almost full MVVM capabilities, like binding event handling.
    • Pros of Knockout
    • It is simplicity for sure, specially for people who knows MVVM
    • Cons of Knockout
    • It defines its own classes, which means in order to use it then your model has to inherits from its classes, and this BTW is a common thing in many frameworks.
      The second cons about it, that it is built around MVVM, which is simple, but lack the power of a true MVC framework.
    • The future of Knockout
    • Honestly, all the features of Knockout exist in Angular, and Angular implemented them in a better way.
      Personally I don't think there is a great future for this framework after Angular came up
      But still for a beginner who want to learn something simple, I will recommend it (and maybe only for training purposes or small scale applications).

  3. Backbone
  4. Backbone is one of the oldest MVC frameworks for JavaScript.
    Backbone, has a controller that is in control of the application. It is listening to the events, and managing the views and the models.
    It uses template engine to render a data model into an HTML page.
    • Pros of Backbone
    • Backbone is a true MVC framework (not like Knockout) which gives you more freedom to create your html/views from scratch, or use a template engine to generate them similar to bind them to the model.
      Another Pros is that it is tight with jQuery. Actually I will say if you have already a legacy code base with heavy jQuery usage, and you want to do re-factoring the code, then Backbone is your library of choice. jQuery code tends to go spaghetti code with short time, and backbone is your best choice to manage and organize your jQuery code.
    • Cons of Backbone
    • The tight coupling between Backbone and jQuery was considered as a positive point, but at the same time, we can consider it as a negative point.
      You cannot use Backbone without jQuery, and Backbone by itself doesn't do so much, and doesn't provide so much functionality comparing to other MVC frameworks.
      Sometimes I was wondering why I am using Backbone, because it looks like backbone help you structure your code, more than provide you with helper libraries.
      But maybe this again is its strength, because it force you to organize and structure jQuery in a specific way, so it is easy to maintain, and doesn't grow organically to be spaghetti. Another Cons that it force you to inherits from its own classes like Knockout.
    • the future of Backbone
    • Backbone will exist to refactor and clean jQuery code, and that is the only reason for it.
      But the industry is coming up with better solution like Angular.
      But as long as you have a huge jQuery based code, then you probably better use Backbone to clean up your code.

  5. Dojo's MVC
  6. Dojo, is not necessarily an MVC framework, even it has a module for MVC.
    Dojo is a really a huge JavaScript framework that covers many things.
    It has DOM-handling like jQuery.
    It has UI like jQuery-UI
    It has MVC / Class inheritance framework.
    It has a lot of other things

    The folks at Dojo, implemented many cool ideas from CommonJS initiative.
    Honestly, I didn't find Dojo very helpful, with all what it is provide, and I will recommend not even to spend time learning its MVC because it is very primitive

  7. Angular
  8. With no doubt and hesitation, I will say that Angular is the best of the best, and it is the future of MVC frameworks.
    • First it doesn't have its own classes
    • When I first learned that I couldn't believe it, because in every other framework you have to inherits from that framework classes.
      So, you can use just vanilla javascript classes as your data model, and it will bind to the HTML page.
    • It is easy to learn and setup
    • You can setup a hello world with very few line of code.
    • Has tons of features
    • It has its own ajax framework, that is easier and more integrated with its MVC than jQuery.
      It has its own API to define new HTML templates called "Directive" It is build with modular design in mind, and it has its own modular API to structure the application around modules.
    • Cons of Angular
    • The only cons of Angular is it is not native to work with jQuery and jQuery plugins, but you can wrap any jQuery plugin with a simple Angular directive to use it.