The Pixar Way: 37 Quotes on Developing and Maintaining a Creative Company (fr...
Javascript MVC Framework Selection - AngularJS vs BackboneJS vs KnockoutJS vs EmberJS vs BatmanJS
1. Comparision of Javascript MVC Frameworks
AngularJS KnockoutJS Backbone.js ember.js Batman.js
Templating
Engine
HTML with
Directives or
Markup
DOM-based
templating
DOM-based
templating
or String-
based
templating(
Handlebars)
Rich DOM-
based
templating
(handlebars
templating
engine)
No templating
engine. Pure
HTML Views
Data Binding Excellent.
Uses
$scope.$appl
y();
Yes, Two way
Data binding.
No Two Way
Data Binding.
Uses
Handlebars
Powerful two
way data
binding system
jQuery
Compatibility
Excellent Yes Yes
Dependencies jQueryLite Needs
RequireJS
Underscore.
js and
RequireJS
and jQuery
jQuery for
DOM
Routing Excellent
with
$routeProvid
er service
Not included.
Need third-
party
libraries
Yes Yes Expressive
Routing. You
can declare
single routes
with @route or
declare
resource routes
with
@resources
DOM
Manipulation
Directives(Re
usable &
tested)
Custom
Bindings.
Libraries
needed
jQuery or
Zepto or
Ender or
jBone or
Backbone.V
iew
Requires
jQuery for
DOM
manipulation
Includes Helper
Methods for
DOM
Event Handling Unobtrusive
Provides
alternative
helper
functions –
ko.dataFor(el
ement) ,
ko.contextFo
r(element)
Using on
method to
register handler
functions and
called using fire
2. Ajax $http service
and
$resource
service
jQuery’s
helper
methods –
getJSON and
post
Needs
libraries like
Ender or
Zepto
Uses JQuery
AJAX
methods –
getJSON and
post
Inbuilt wrapper
- Request is
batman.js's
wrapper for
AJAX requests
Model
Persistence
Local
Storage.
Provides
event called
storage on
window
object
Exchange or
store data in
JSON Format
Uses JSON
objects
DS.Store to
create and
retrieve
records.
StorageAdapter
Dependency
Injection
(Inversion of
control)
Yes. No Tools
needed –
requirejs or
browserify.
Also by
calling
calling
require("mo
dule")
Yes Not sure
Unit Testing Yes. Great for
Testing
Not built for
testing.
Optional -
PhantomJS
for view
models
Yes. Using
Jasmin and
sinon.js
Yes. Ember-
Qunit
Inbuilt -
Batman.TestCas
e
Optional –
Jasmin and
Sinon.js
Contexts Creates
context
explicitly
Does not
allow to
create
context
explicitly
Browser
support
IE8+ IE6+ IE7+ IE9+ IE7+
Cookies Yes Uses
Require.js
to import
the jQuery
Cookie
plugin
Yes Yes using
Batman.LocalSt
orage and
Batman.Session
Storage
IDE Support &
Debugging
Extensions
-Plugin for
visual studio
-chrome
extensions
-Chrome
extension
- Sublime
Text
-WebStorm
-Chrome
Extensions
- Ember tab
in
ChromeDevT
ools
- Ember
Inspector
Inbuilt -
$context which
returns the
Batman.View
for a given
HTML node.
3. Author: Masoom Tulsiani is a Dev Engineer at ING Netherlands. He shares tips on web
development frameworks and startups on Twitter at @cloudjedi_
Some of his favourite frameworks include Symfony and AngularJS. For freelance projects,
write to masoom.tulsiani[at]gmail.com
Tags: PHP, AngularJS, Symfony, MVC, Single Page, Web Development, BackboneJS, EmberJS,
KnockoutJS , Javascript
Design MVC MVVM MVC MVC Singleton &
Stateful MVC .
Inspired from
Rails and
CoffeeScript
Work with
AMD(Async
Module
definition
Libraries)
Yes
Needs
RequireJS for
AMD
Needs
RequireJS
for AMD
No
No
Bower Packet
Manager
Yes Yes Yes Yes No
File size 30 kb
without
depencencies
14
kb(minified)
without
depencencies
42 kb with
depdencies
49 kb
without
depencencies
240 KB with
depencencies
Observable
properties
No, Uses
dirty
checking.
Yes Yes Yes. Using
Ember.Obser
vable Class
Rendering Asynchronou
s Rendering
Synchronous
Rendering
Asynchronou
s Rendering
UI Bindings Yes Yes No Yes Yes