Skip to content


Subversion checkout URL

You can clone with
Download ZIP


Size Goals #26

justinbmeyer opened this Issue · 16 comments

I'd like to keep JMVC as small as possible. Here are some size-ish goals:


currently: .985 KB
wanted: < .900 KB


currently: 1.74 KB
wanted : < 1.7 KB


currently: 2.82 KB > 2.74KB
wanted: 2.5 KB


currenty: 1.62 KB
wanted: 1.5 KB


current: 1.5 KB

I think this is ok :-)


current: .666 KB > .650 KB
wanted: .5 KB


Combined, this would bring JMVC to 8.6 KB (which is back to inline with my 7kb goal for everything w/o EJS).

Oh, also steal ...


current: 4.97 KB
wanted: 4 KB

join and such needs to be cleaned up for this


Not an urgent question at all, but how does JMVC compare size-wise to other MVC-like JS frameworks? I remember Brian LeRoux making a comparison chart against frameworks for TodoMVC but this wasn't really reflective of the framework components alone :)


IMO, this is not a good question. It's the one simple, tangible value that people can easily compare so its importance gets far overblown. Size is important, but only when standing along-side an understanding of features.

With that being said, I think BB is 5 KB with it's underscore dependency. I'm not sure about other frameworks.

But also with that being said .. BB has nothing like $.Class, $.Controller's templated event handlers and rebinding. Model getter/setters, deferred support, converters, etc, etc, etc. Though, it has underscore.

I think a size comparison should ONLY be coupled alongside an explanation of features, etc.

JMVC is smaller than Dojo, but it doesn't have widgets and a whole host of other things.


Oh, and the fact that you can just use $.Controller or $.Class ...


In a branch, I am able to get:

  • Class: .627
  • Controller: 1.3
  • Observe: 1.8

I did this by removing unessential features. For example, this._super, this.proxy, $.fn.controller, controller's plugin helper. And a very thin layer on $.Observe to do ajax requests the way model does (a model with no validations, getter / setters, defaults / serialization, etc)

This would make the total about: 5.5k. This would be the same size as backbone+underscore, but include things like automatic unbinding, $.View (which would be $.template), etc. You'd create controllers like:

new Tabs($('#foo'),{})

@justinbmeyer justinbmeyer was assigned

Another iteration:

Model 3.04KB (Δ +0.22 KB) 2.88KB (+0.04)

Break Down:

  • Model Core -> 1.12KB -> 1.09KB
  • Observe -> 1.92KB -> 1.74KB


  • Based on $.Observe
  • $.Observe.List


  • setters
  • serialize (attributes)
  • elements
  • basic validation (needs tests) (attributes)

Class 0.66KB ( Δ -0.32 KB )


  • proxy
  • _super

Controller 1.33KB ( Δ -0.4 KB )


  • jQuery helper, controller()


I cut about .7KB. But, I haven't spent time on $.Observe


So BB (4.6KB) and it's Underscore dependency (3.74KB) are 8.33KB.

Currently, the MVC parts are 6.92. This does not include route ( 1.16KB ) and hashchange ( .5kb ).

So, MVC + R+H = 8.58.

$.View and $.route will have to come up with the remaining 0.25.


I have the small mvc parts down to 5.79KB. Awesome.


So now, with hashchange, deparam, $.route, and controller/route, JMVC comes to:

7.33 KB!

controller/route lets you bind to specific routes like:

  "foo/:bar route" : function(data){
  "route" : function(){
   // fires when hash is empty

We could use an html5 converter ...


Great job, Justin! :)


Wow, that's tiny!


It's now 9.16KB with EJS (and EJS's new live-templating).

Without EJS, it's about 7.4k (excluding hashchange).

It will be about 1k bigger for Zepto because it brings deferred support.


Here's the breakdown ... You can see that EJS is now a fat ass ...

string - 580
construct - 676
observe 1.74
deparam 348
route 1.13
control 1.33
view 1.49
model 1.42
control/route 210
ejs 2.03


combined, EJS + View is 3.5k ... much too big.


Total is now 8.8k.

String  560
Construct   674
Control 1280
Observe 1690
Deparam 384
Route   1140
View    1150
EJS 2020
Model   1370

You an see that EJS+View has blown (3.3k) up b/c of live templating. However, this is largely equivalent to Knockout now.


@justinbmeyer really great work on this. Are there plans on making the improvements more visibly documented somewhere?


This has been accomplished via CanJS

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.