Click here to load reader

– How to Stay Sane in an Insane Ecosystem

  • View

  • Download

Embed Size (px)

Text of – How to Stay Sane in an Insane Ecosystem

  • DownTheRabbitHole.jsHow to Stay Sane in an Insane Ecosystem

  • Space Forensics Government contract For an educational Lucas Arts style game For NASA!

  • I feel like Im taking crazy pills.

  • First, a bit of history.

  • In the beginning 1995 - Over 10 days Brendan Eich of Netscape made Mocha

    Renamed to LiveScript

    And then JavaScript (licensing a ride on Javas coattails)

    1997 - ECMAScript v1 (ECMA-262) standard defined

    1998 - ECMAScript v2 - now an ISO standard (ISO/IEC 16262)

    1999 - ECMAScript v3 - first modern javascript

  • Power Struggle Plugins for non-trivial interactivity Big fights over ECMAScript v4 End result was v3.1 v5 in


  • In the meantime

    2005 - AJAX white paper

    2006 - jQuery, Mootools, Prototype, & Dojo

    Make working with the DOM easier

    Smooth over cross-platform issues

    Bring common patterns to JS (observables, promises, etc)

  • node.js & npm 2009 - node.js released

    Powered by Googles v8 JS engine for Webkit

    Async I/O

    JS on the server anywhere!

    2011 - npm released

    Package manager for JS

    Which results in

  • The Cambrian Javascript Explosion

  • JavaScript Modules

    Easy to publish to npm

    Zero gatekeeping

    Massive overlap

    Quality varies wildly

    Lots, and lots of dodos

    329,149modules on npm as of 9/22/2016

  • Wait modules?

    No language support for modules!

    Work arounds it is!

    CommonJS (server)

    AMD (browser)

    Incompatible! Solution?


  • JavaScript Tooling Scaffold

    Yeoman, Slush, etc.


    Coffeescript, TypeScript, Dart, Babel, Clojurescript, Elm, etc.


    Grunt, Gulp, Webpack, Brunch, etc.

  • On the horizon asm.js

    Strict subset of JavaScript that acts as a compiler target

    Compile C, C++, Lua, Ruby, Python, etc. to JS

    ECMAScript v6 (ES6) - Modules! Tons of new syntax!

    WebComponents - emerging standard (Polymer polyfill)

    HTTP/2 - everything you know about HTTP is wrong

  • Rein in the madness

  • One size does not fit all

    What are you building?

    How big will the codebase be?

    Who is your audience?

    What does your team know?

    When is the project due?

    How long will your code last?

  • Not just a technical problem!

    Affects hiring

    Affects employee moral

    Affects internal training

  • Transpiled Languages

    Need to know JS too

    Matters less than discipline

    More complex tooling

    Longer ramp-up

    Just the good parts

    Strong typing

    Improved syntax

    Domain specificity


  • ES6 via BabelOur choice:

  • Invest in great tooling The best setups have the tightest feedback loops

    One-click is great, no clicks is better

    Automate all the things!


    Building (including sourcemaps!)



    Document your tools like crazy

  • Our choice:

    webpack (right now) brunch (future projects)

  • Philosophy

    Whats the core idea?

    Can they explain it?

    What is their inspiration?

    Are they solving your problems?

    Does it play well with others?

  • Small vs. Big

    Monolithic = consistency

    Centralized documentation

    Reduced flexibility

    Larger mental load

  • Documentation

    Bad docs = bad software

    Unit tests

    Code coverage

    Read the docs! (Yes, all of them!)

    Read the code! (Yes, all of it!)

  • Functional Programming

    Lisp in Cs Clothing

    Prefer functions


    One-way data binding



  • Our choice (SPAs):

    lodash + react + redux

  • Options from the Big Boys

    vue.js - view layer

    zepto - jQuery

    riot - react

    meteor - full stack!

  • Other great libraries

    d3 - data visualization

    rxjs - reactive programming

    jest - testing made easy

    moment - dates & times

    superagent - ajax

  • You cannot stop swimming

    Picking a winner is a bad idea

    Find what works for you

    But never stop searching for better

  • Thank

    @automatastudios @waxpraxis

Search related