PIcking Your Javascript Mobile Framework: Part 11 - Backbone
The odd thing about our Backbone/Marionette/Require implementation is the sheer number of Javascript files that litter its directory structure. There are 6 view files alone – one for the ActiveCount, one for the CompletedCount, one for the Header and one for the Footer, and one each for the the TodoItem and one for the list. There are four templates, a router, a controller, a file for the collections, and one for the mode, plus an app and a main Javascript files, and one that defines the templates used.
It’s a mess. The HTML is kept generic, with the main app area simply marked as header section, main section, and footer section.
The main.js file, then, starts with a list of requires that scared the heck out of me the first time I saw it: it includes underscore, backbone (duh!), marionette, jquery, and from backbone the localStorage package.
And you know what, we could all laugh it off, if it weren’t for the fact that this crazy combination loads lightning fast. As mentioned, nobody knows (well, I don’t) how the combo would work in actual deployment, but at least on this computer, at least this app, at least on startup is faster than anything else we have in the comparison.
Looking at a bunch of different projects that use Backbone, I get the impression that they all have that in common: they require a series of different frameworks for even the simplest task. All these frameworks, though, are very specialized. The result is that the complexity in the “architecture” is not paralleled by a slowdown. Five tiny frameworks weigh less than a single big one.
In this particular example, Backbone pairs up with Marionette (which depends on it), jQuery (for DOM manipulation), Require (for imports and dependency management), Underscore (for utility). You could remove some of the dependencies, or add different ones for the same purpose, or add even more in. It’s up to you.
The modular approach, as evidenced by the performance, pays off. Especially considering that Backbone didn’t do as well without Require. On the other hand, the hands off and minimalist approach has its downsides, too. Aside from the sheer number of files required to make everything work, there is an inherent lack of automation, and the combination ended up towards the far side of the amount of code spectrum.
I have a sense that it’s worth looking at something different. The combination may be the fastest thing in the known universe, but I find it nearly impossible to imagine following the ideological imperatives of five different libraries, no matter how specialized they are and how much you can mix and match features.