I have been working with the backbone.js and Angularjs for a while and even though I knew that both technologies have their own advantages and disadvantages, the more I worked on these technologies, the more I learned about these advantages and disadvantages in detail. From what I learned and garnered, if given an option, I will always pick Angularjs over backbone.js, now let’s see what convinced me to make this move.
Angular does not need any templating engine. In Angular, templates are written with the most famous templating engine in the world HTML that contains Angular-specific elements and attributes.
In backbone we have to choose a template engine. Backbone can be integrated with many third-party template engines, the default choice is Underscore templates. So one have to select from these third party templating engines like re Handlebars (60 unminified – This is the templating engine used by emberjs and sproutcore!) / Mustache( 15.6 unmini ) / Dustjs( 25.8 mini )
One should have knowledge in any of these templating engines . I found it pretty hard to make this choice.
Two Way Binding:
AngularJs supports two-way data binding. It is an automatic way of updating the view whenever the model changes, as well as updating the model whenever the view changes. This makes things easy by reducing the length of the code and the time.
But Backbonejs does not support Data binding. You have to link up your views and models with lengthy code or use one of the data-binding plugins for Backbone. Your options in plugins are ModelBinder (11.1kb )/ CollectionBinder (5.5kb )or Backbone.stickit( 3KB )( Note : this does not have a solution for collections ).
Angular includes a built-in validation and it has a few validations already implemented like email, max-length, min-length, required etc. If you want some other custom validations you can write your own.
Backbone.js lacks such a validation. It has a function in the model to do validations. But the validation logic has to be added by ourselves. Here also the binding issues still persists.
Application Architecture / Layout Structure / Memory management: :
Backbone does not provide structure. It rather provides some basic tools you can use to create structure, you have to put in the effort to create your own structure. On doing so, we have to take care of the layout management, application structure and global event bus.
In Angularjs, one would never have to worry about memory management, layout management or event bus. Angular is having its own structure and it will take care of memory management and layout management etc.
Angular have the large community compared to backbone. When weighed with the most popular communities like stack overflow, github, youtube tutorials etc, Backbone is far behind from Angularjs in popularity. Angularjs documentation is far better compared to Backbone.js.
Testing is one of the important factors in web development cycle. Both Angular and Backbone, support testing. Ability of dependency injection and modularity are the key parts to have a testable code. Angularjs is characterized by both of these features and hence we can say it was built keeping the testing facility in mind. So, to me, in testability, Angular has an edge over Backbone.
In addition to the above points, Angular is growing with new innovations and tools like Protractor.js, Batarang, ngmin and Zone.js. Angular also has support for module dependencies and injections which makes it easier to work with. It also has separation between logic and presentation which allows you to make UI presentation quickly.
Yes, Angular is also having some disadvantages like complexity of some of its features like services, factories etc. But compared to Backbone, Angular is feature rich and versatile. So, I’d prefer Angularjs over Backbone any day.