Small.JS


by Toby Ho
tobyho.com
@airportyh

Small.JS









Framework Heavy





What's the Problem?




Fragmentation




Analysis Paralysis




Switching is Expensive




Few Small Libraries




Duplication of Effort




Why?




The .js File




Depend On No One


jQuery Parts

  • Ajax
  • DOM
    • events
    • css selector engine
    • traversing
    • manipulation
    • dimensions
    • attributes
    • class manipulation
    • form serialization
    • css
  • Animation
    • show(), hide(), animate()
  • Misc
    • data(), parseJSON(), parseHTML()
  • Array/NodeList helpers (each(), filter(), etc)
  • Type checking (isArray(), isFunction(), etc)




To jQuery or not to jQuery?




There's a better way.




Dependency Management




npm

npm yay!


Install
npm install express

Use (server.js)
var express = require('express');
var app = express();

app.get('/', function(req, res){
  res.send('hello world');
});

app.listen(3000);

npm yay! >> express



node_modules/express/lib/express.js
var merge = require('merge-descriptors');
var connect = require('connect')
  , proto = require('./application')
  , Route = require('./router/route')
  , Router = require('./router')
  , req = require('./request')
  , res = require('./response')
  , utils = connect.utils; 

npm yay!

Rich Dependencies


npm yay!



Small is Beautiful




  1. Small (200 LOC or less)
  2. Single-Purpose
  3. Short Learning Curve
  4. Easy to Make
  5. Easy to Replace




Small vs Big?

Small Modules


  • pay-as-you-go
  • desirable for minimalists and control freaks
  • easy to replace individual parts
  • easy to re-architect
  • you are your own boss
  • will have to figure out things for yourself
    • directory structure
    • OO design
    • conventions
  • teams? document your decisions


Big Framework




  • convenience, ease, comfort, productivity
  • built-in global conventions
  • inflexibility - gets hard if you go off the "happy path"
  • the framework trap - hard to replace






Small vs Big?

Small <3 Big





  • inflexibility - gets hard if you go off the "happy path"
  • the framework trap - hard to replace



npm for frontend?

What we are trying



  1. npm + Browserify
  2. bower
  3. component




For more, follow my blog

tobyho.com

Small.JS

By airportyh

Small.JS

  • 1,436