choosing the right javascript library/framework/toolkit for our project

43
choosing the right JavaScript Library/Framework/Toolkit for your project

Upload: hristo-chakarov

Post on 11-Apr-2017

2.633 views

Category:

Technology


1 download

TRANSCRIPT

choosing the right

JavaScript Library/Framework/Toolkitfor your project

Presentation goals

● Give directions

● Compare few major libraries, frameworks & toolkits

● Statistics

Who am I?

Your project?

● Type

● How big is it

● Features

● Future expectations

DefinitionsWhat is library?

What is framework?

What is toolkit?

Library

Bits of functionality that you can call.

● jQuery

Framework

Universal, reusable software platform,

foundation of applications, products and

solutions.

● MooTools

● AngularJS

● BackboneJS

Toolkit

A set of independent libraries, designed to work

well together, that you can pick and choose

from.

● Dojo

● YUI

Features

Comparison table

● all available over CDN*

● all cross-browser**

Performance, Size, Modularity

Selector Engine performance

Size

● Size does not matter if the resources are distributed over CDN

● cdnjs.com

Modularity

● MooTools provide configurable download

● Async Module Definition - YUI, Dojo

OOP, inheritance, code reuse

jQuery's bad practices

The never-ending callback nesting

Code structure

● Classes for reusable components

● Constructor options

● Use synchronization API instead of nested callbacks

Code structure

The MooTools way

Code structure

Utilities

● A utility should first try to delegate to native and if it fails, use it’s own implementation

● The more utilities, the better

Utilities

● String

trim() hyphenate() camelCase() escapeRegExp()

toInt() toFloat() substitute()

● Object & Array

each() some() every() filter() contains()

map() empty() append()

Commonly needed utilities

Commonly needed utilities

● Object

values() keys() clone() merge()

toQueryString()

● Array

associate() clean() unique() flatten()

User Interface

User Interface

● Should be easy to style(jQueryUI provides a great theme development tool)

User Interface

● API should provide full control○ destroy()

○ DatePicker should be able to have its value set from outside

○ Tabs should provide API for selecting tab

dynamically

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

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

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

○ Heavy to implement - if you could have gotten away with 1 class, you now have 3

You can always combine MV* with some other framework

Ем виси, ем не виси :)

Usage, Support, Community

● When was the latest version released?

● How often do they release new version?

● Are there currently any betas?

● Is there huge incompatibility between versions?

Releases

Support

● How many opened issues are there?

● Is the documentation rich & easy to use?

● How steeper is the learning curve?

Community

● Which big projects use the framework?

● How big & active the community is?

Usage Statistics

Statistics fromgoo.gl/lJrPpl

Tips

● Spend some time browsing the source code

● Read other people’s opinion, but don’t count on them!

Tips

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 todomvc.com

**** , ask me :)

Are there any Questions?

github.com/ickata

wpbgug.org

blog.ickata.net

sitekreator.com

Thanks for listening!