At VI Company almost all of our projects use Backbone.js and while we regularly take a look at other, more popular frameworks, like AngularJS and React, Backbone.js is still our go to library. In this article I will explain why.
Not a framework
It’s a library, not a framework. This means it’s small, relatively easy to learn and doesn’t restrict or force you in a certain way of working. Just read the Getting Started about the underlying philosophy:
“In an ecosystem where overarching, decides-everything-for-you frameworks are commonplace, and many libraries require your site to be reorganized to suit their look, feel, and default behavior — Backbone should continue to be a tool that gives you the freedom to design the full experience of your web application.”
This also means there's “more than one way to do it” when working with Backbone.js. This can be a bit daunting for beginners, but for the more seasoned developers there isn’t much magic involved by using Backbone.js.
Less is more especially when you are talking about page weight and developing “Mobile first”. Backbone weighs a mere 7.3kb when minified and gzipped. It used to have a hard dependency on jQuery, but since version 1.2.0 it’s quite easy to get rid of that. The other dependency is Underscore.js (5.7kb, Minified and Gzipped), but we use that most of the time for it’s templating functionality and it also brings a lot other useful utilities.
Backbone.js has been created with extensibility in mind. Therefore a lot of small libraries are available that fulfill a certain need. Need more control over view rendering? Use LayoutManager. Need better Model-View binding, use Backbone.Stickit or Epoxy.js. Do you need more structure and some magic for your Single Page App? Use Marionette. And when you fancy some Virtual DOM, you could also use React as your view engine. Or you could just write your own base View/Model/Collection if you want to.
Documentation and API
One of the first things Backbone teaches you is to move away from the DOM and use a RESTful API to retrieve JSON and store that data in your Models. Connect your Views to those models and let them respond to changes in the associated model to render new HTML and update specific parts on the page.
We build a lot of public websites which need to be SEO friendly and accessible to users with older browsers. We use the Progressive enhancement principle when creating websites and Backbone.js nicely plays along in enhancing the page. And when using a template engine like Mustache or Handlebars, we can even share the templates between the Front- and Back-end, so we only have to write that code once.
I don’t like to reinvent the wheel and I dislike the magic, steep learning curve and the vendor lock-in that larger frameworks tend to bring to the table. And surely, when creating a private Single Page App we will reconsider Angular, React or something else, but when it involves a public and informational website, we will likely use Backbone.js again.