Segundo Acto

Mejores Prácticas

Dependency Management

 $ npm init
 $ npm install <package>
 $ npm search <package>
 $ npm list

 $ npm install -g bower

 $ bower init
 $ bower install <package>
 $ bower search <package>
 $ bower list [--paths]

Modules

Globals

// Definition
var MyModule = function() { .. };

// Require (Not needed, its global!)

// Use
MyModule();

AMD

Asynchronous Module Definition

// Definition
define(['my-dependency'], function(MyDependency) {
  return function() {};
};

// Require & Use
require(['my-dependency'], function(MyDependency) {
  MyDependency();
});

CommonJS

// Definition
module.exports = function() {};

// Require
var MyDependency = require('my-dependency');

// Use
MyDependency();

Universal Module Definition

(function (root, factory) {
  if (typeof exports === 'object') {
    // CommonJS
    module.exports = factory(require('b'));
  } else if (typeof define === 'function' && define.amd) {
    // AMD
    define(['b'], function (b) {
      return (root.returnExportsGlobal = factory(b));
    });
  } else {
    // Global Variables
    root.returnExportsGlobal = factory(root.b);
  }
}(this, function (b) {
  // Your actual module
  return {};
}));

WAT???

¿Cual utilizar?

RequireJS (AMD)

Browserify (CommonJS)

5 buenas prácticas de

Optimización

1. Reducción de Peticiones HTTP

2. Minificación de Archivos

3. Utilizar un CDN

(Content Delivery Network)

4. Cache

5. Gzip

Gulp.js

Title