Send the link below via email or IMCopy
Present to your audienceStart remote presentation
- Invited audience members will follow you as you navigate and present
- People invited to a presentation do not need a Prezi account
- This link expires 10 minutes after you close the presentation
- A maximum of 30 users can follow your presentation
- Learn more about this feature in our knowledge base article
Do you really want to delete this prezi?
Neither you, nor the coeditors you shared it with will be able to recover it again.
Make your likes visible on Facebook?
You can change this under Settings & Account at any time.
JS libraries and frameworks
Transcript of JS libraries and frameworks
Does it know its place?
Am I allowed to use it? What does a library do Generalist toolkits: Dojo, jQuery, YUI, Mootools thou shall not
reinvent the wheel! toolkits and frameworks Libraries that cover all the needs for the development of an application weight of the library
stylistic and semantic constraints
licensing issues ease and speed of development
stylistic and semantic consistency
community and/or commercial support Provides easy cross-browser
compatibility Provides a convenient
API for AJAX operations! Custom event patterns Dom manipulation! And much more!
Mimicking of classical inheritance
Methods for arrays / objects
GOTO... Your mileage may vary! Do I need / want..
Etc... How big is the library?
Can it be loaded in a modular fashion?
Does it extend the prototype of native and dom objects?
Does it pollute the global scope?
Does it leak memory? Is it licensed for
personal or commercial use?
Is it free? They all provide a standard sets of functionalities: dom manipulation, ajax request/response, feature sniffing, css selectors, cross-browser dom events and visual effects (animations). But there are differences! MVC Frameworks: Backbone, Ember, Knockout, Angular Fairly ubiquitous
Doesn't provide a templating engine, but can be integrated with one if needed
Great router capabilities: retains the navigation history, saves and restores the state of the page
Allows a great deal of flexibility in its use, there's very little prescriptive about it
Has jQuery and Underscore as dependencies
MVP pattern Two-way data-binding.
State management (is a user logged out or logged in), Auto-updating templates
Computed properties (firstName + lastName = fullName)
Templating through integrated Handlebars
Has jQuery as a dependency
MVC pattern Maintained by Google
Two-ways data binding (dom contains references to variables, and variables in the js contains references to the dom)
Uses custom attributes in the templates
Has jQuery as a dependency (included)
MVC pattern Declarative bindings
Automatic UI refresh (when the data model's state changes, the UI updates automatically)
MVVM pattern Specialized libraries: underscore, requirejs,
modernizr Ubiquitous file and module loader
Can be used to manage dependencies inside a web application Feature detection
Browser polyfill for CSS3 and HTML5 And you can always build your own! Extends the DOM
Simple to learn
Ultra lightweight Maintained by Yahoo!
Powerful custom events and inheritance
Consistent code style / quality
May be used as a complete MVC framework Easy to learn
Powerful tools for DOM manipulation
Ubiquitous -- it's a dependency for many MVC frameworks
Has zillions of plugins
No direct support for inheritance
No direct support for custom events
Plugins/Widgets can be poor quality License: MIT License: MIT License: MIT License: MIT License: MIT License: BSD License: MIT Modular loading
Can be used with Adobe Air
Can be run on nodejs
They always include some form of data binding, event bus, templating and browser history management.
Data binding can be one way (the data structure contains references to the dom, or the dom contains references to the data structure), or two-way (both bindings).
They can be used in conjunction with a generic toolkit. Some have a toolkit (usually jQuery) and a module loader (usually requirejs) as mandatory dependencies. These libraries fulfill one or more specific purposes: dependency management, templating, browser polyfill, etc... They aren't meant to support you building the core of your application, but to help with specific needs.
They can be used in conjunction with toolkits and/or MVC applications. pick one! It's a very bad idea to use more than one toolkit at a time. Some companies and individuals do - and often release them into the open source world (e.g. BBC Glow). The open source model ensures the survival of the fittest ideas / implementations, and the support of the community to detect and fix bugs and design flaws. @barbaracassani