Introduction and Comparison of polpular JS Frameworks Knockout, Ember, Angular and Backbone. The presentation descrobes How and when to select each framework.
2. JAVASCRIPT MV* FRAMEWORKS
Organise code using
variations of MVC
Pattern
Helps in
Tying together a DOM
manipulation library
Templating
Routing
4. Maintained by Google and
community
Initially Released on 2009
Current stable release
1.2.18 (June 13, 2014)
~37kb total (gzip / minified)
Miško Hevery and Adam Abrons
5. Developed and is maintained by
Steve Sanderson, a Microsoft
employee
It is a personal open-source project,
and not a Microsoft product.
Released on July 5, 2010
Current version 3.1.0 (March 18,
2014)
~17kb total (gzip / minified)
6. Created by Jeremy Ashkenas,
Initially Released on October
2010,
Current stable release 1.1.2
(February 20, 2014)
~6.5kb total (gzip / minified)
7. Created by Yehuda Katz, a
member of the jQuery, Ruby on
Rails and SproutCore core
teams.
Initially released as the
SproutCore 2.0 framework later
renamed as Ember.js
Initial release : 2011
Current stable release 1.5.1
(April 22, 2014)
~71 kb total (gzip / minified)
19. DATA BINDING
Process that establishes a connection between the
application UI (User Interface) and business logic
20. Data-binding is fully
supported
Data can be bind into
many attributes like
text,value, options,
enable etc
Provides Option for
Creating custom
bindings
21. Data-binding is fully supported
Models use standard JSON properties (e.g. car.color = "red";)
Provides Option for Creating custom bindings
22. Data-binding is not supported
by default.
There are plugins available to
support Data-binding
23. Data-binding is fully supported
Models use getters and setters but the binding is
automatically and better than Backbone.
24. Used for routing your applications URL's when using
hash tags(#)
Maps an url to a javascript function
ROUTERS
30. Simple and straight forward.
Easy for developer with JQuery and DOM skills
Simply extend Backbone.View, grab an element and put stuff in it
No Official Templating, but easy to add using
31. Uses HTML as templating language
Automatically pulls in HTML templates via AJAX when needed
32. Extensive view type support
Very easy to create re-usable components
Handlebars are used for templating
33. Uses HTML as templating language
Supports
Native templates
Using default control flow bindings
String based templates
Third-party template engine
35. No default test solution;
Test it your own
Can use following third party solutions
36. Fantastic test support.
Designed from the beginning to be easy to test.
Karma developed by Angular JS team is popular test runner
37. Poor testing initially
Pretty good testing support now
38. As of now, no default debugging tools
Functions like Console.log(), ko.toJSON() helps debugging process
Can use following third party solutions