1. choosing the right
JavaScript Library/Framework/Toolkit
for your project

2. Presentation goals
• Give directions
• Compare few major libraries, frameworks &
toolkits
• Statistics

3. Who am I?

4. Who am I?

5. Your project?
•
•
•
•
Type
How big is it
Features
Future expectations

6. Definitions
• What is library?
• What is framework?
• What is toolkit?

7. Library
Bits of functionality that you can call.
• jQuery

8. Framework
Universal, reusable software platform, foundation
of applications, products and solutions.
• MooTools
• AngularJS
• BackboneJS

9. Toolkit
A set of independent libraries, designed to work
well together, that you can pick and choose from.
• Dojo
• YUI

10. Features Comparison Table
• all available over CDN*
• all cross-browser**

11. Selector Engine performance
• all available over CDN*
• all cross-browser**

12. Size
• Content
• Size does not matter much
if the resources are
distributed over CDN
• cdnjs.com

13. Modularity
• MooTools provide configurable download
• Async Module Definition - YUI, Dojo

14. Code structure - jQuery's bad practices
The never-ending callback nesting

15. Code structure
• Classes for reusable components
• Constructor options
• Use synchronization API instead of nested
callbacks

16. Code structure
The MooTools way

17. Code structure
The MooTools way

18. Utilities
• A utility should first try to delegate to native
and in case it fails - use it’s own implementation
• The more utilities, the better

19. Commonly needed utilities
• String
trim() hyphenate() camelCase()
escapeRegExp() toInt() toFloat()
substitute()
• Object & Array
each() some() every()
map() empty() append()
filter()
contains()

20. Commonly needed utilities
• Object
values() keys()
toQueryString()
clone()
merge()
• Array
associate()
clean()
unique()
flatten()

21. User Interface
• Should be easy to style
(jQueryUI provides a great theme development tool)

22. User Interface
• API should provide full control
o destroy()
o DatePicker should be able to have its value set from
outside
o Tabs should provide API for selecting tab dynamically

23. MV*, or not MV*?
that is the question

24. When to use MV*
• AJAX-heavy web apps
• JSON data structure
• Need to render data in different ways on the same
page
• A lot of user interaction that triggers updates

25. When NOT to use MV*
•
•
•
•
Your server cannot handle all the requests
Your app has little interactions on the page
Data changes rarely
MV* may be overkill for small projects
o Heavy to implement - if you could have gotten away
with 1 class, you now have 3

26. You can always combine MV*
with some other framework
Ем виси, ем не виси :)

27. Releases
•
•
•
•
When was the latest version released?
How often do they release new version?
Are there currently any betas?
Is there huge incompatibility between versions?

28. Support
• How many opened issues are there?
• Is the documentation rich & easy to use?
• How steeper is the learning curve?

29. Community
• Which big projects use the framework?
• How big & active the community is?

30. Usage Statistics
• Content
• Statistics from
goo.gl/lJrPpl

31. Tips
• Spend some time browsing the source code
• Read other people’s opinion, but don’t count on
them!

32. Tips
• Write a module/component for your App in plain
JavaScript or pseudo code; then migrate to the
selected library/framework and see how it feels
• TodoMVC has implementations in several MV*
frameworks - check it out at todomvc.com

33. Are there any Questions?
****
, ask me :)

34. Thanks for listening!
github.com/ickata
wpbgug.org
blog.ickata.net
sitekreator.com

35. And thanks to our Sponsors:
Diamond Sponsor:
Gold Sponsors:
Silver Sponsors:
Technological Partners:
Bronze Partners:
Swag Sponsors:
Media Partners: