Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Writing Modular JavaScript

Dave King
January 29, 2013

Writing Modular JavaScript

a talk given at IT Services Tech Talks.

Dave King

January 29, 2013
Tweet

More Decks by Dave King

Other Decks in Programming

Transcript

  1. 1. Not a JavaScript expert 2. Not a fan of

    JavaScript language design 3. Not sure any of this applies to you a. This stuff isn't "one size fits all" b. Use at your own risk Disclaimer
  2. The Zen of Python, by Tim Peters Beautiful is better

    than ugly. Explicit is better than implicit. Simple is better than complex. Complex is better than complicated. Flat is better than nested. Sparse is better than dense. Readability counts. Special cases aren't special enough to break the rules. Although practicality beats purity. Errors should never pass silently. Unless explicitly silenced. In the face of ambiguity, refuse the temptation to guess. There should be one-- and preferably only one --obvious way to do it.
  3. JavaScript • Global namespace • DOM - 'document', 'window'... •

    jQuery - that's all there is to JavaScript right? • Does it need modules?
  4. Why write modular JavaScript? • JavaScript Applications ◦ New Mobile

    Oxford, 28 .js files, ~2k lines of JS. ◦ Work in progress • JavaScript running outside the browser ◦ on your Server ◦ in your database...! • Maintainable • Reusable
  5. How? • Harmony - ECMAScript 6 ◦ Next version of

    JavaScript ◦ Pending browser support ◦ Very flexible ◦ ... long way off? • AMD & require.js ◦ Full browser support now ▪ even IE6 ◦ Simple (if slightly less flexible) syntax
  6. Asynchronous Module Definition Example app/foo.js: define(['lib/jquery'], function($) { ... return

    {myValue: 5}; }); Example bar.js: define(['app/foo'], function(foo) { if (foo.myValue == 5) { ... });
  7. Require.js Optimiser - r.js • Minify, optimise your AMD modules

    • Ship a single .js file if you want ◦ e.g. for phone manifest files, building phonegap applications like new m.ox • Allows for benefits of AMD at development time, no drawbacks when in production.
  8. Q&A