Jsconf.us.2013

#dadtDojo Already Did That@phiggins / JSconf.us 2013

Wednesday, May 29, 13

Me!* JSconf alumni* Former Dojo Project Lead* generic code monkey


PROFESSIONAL CAT HERDER(TRUE OF ANY OSS LEAD)


PRINCESS FLUFFYBUTT(I’VE BEEN PREOCCUPIED)


Welcome to JSCONF ...


JSCONF* Enjoy your lunch transition* Digest, contemplate.* Innovate.


History of the WorldPart III


CELEBRATING 20 YEARS OF INTERWEBSTUBES?


1993-1998: The dark ages


`93-`98* best when viewed in ...* still BBSing


1999-2000: y2kmang


`99-`NaN* Ajax* IE 5(ish)* Netscape 5(ish)* Opera 4(ish)* lynx* Konqueror


2001-2005: A renaissance of sorts.


`01-`05* Flash. * Everywhere.* Lots of learning, hacking.* Beginnings of js libs


2006-2009: Sweet spot.


`06-`09* Lots of fighting.* ... we’ll double back.* Dojo doing things


2010-Date.now() The modern era.


`11+

HTTPS://SPEAKERDECK.COM/ANGUSCROLL/THE-POLITICS-OF-JAVASCRIPTWednesday, May 29, 13

https://speakerdeck.com/anguscroll/the-politics-of-javascript

https://speakerdeck.com/anguscroll/the-politics-of-javascript

And Dojo Did?It.


<div dojoType="foo.bar.baz"></div> var cls = getObject(node.getAttribute("dojoType"));new cls({ props }, node);


<div data-dojo-type="foo.bar.baz"></div>

var cls = getObject(node.getAttribute("data-dojo-type"));new cls({ props }, node);

<div data-dojo-type="foo.bar.baz"></div>

var cls = getObject(node.getAttribute("data-dojo-type"));new cls({ props }, node);

// WAT? no dataset?

var hasDataset = (function(){ var n = document.createElement("div"); n.setAttribute("data-a-b", "c"); return !!(n.dataset && n.dataset.aB == "c");})();


var getdata, setdata;if(hasDataset){ getdata = function(n, prop){ return n.dataset[prop]; }; setdata = function(n, prop, data){ n.dataset[prop] = data; };}else{ function _hypen(m){ return "-" + m.toLowerCase(); } function toDataHyphen(str){ return "data-" + str.replace(/[A-Z]/g, _hypen); }

getdata = function(n, prop){ return n.getAttribute(toDataHyphen(prop)); };

setdata = function(n, prop, data){ n.setAttribute(toDataHyphen(prop), data); };}

var cls = getObject(getdata(node, "dojoType"));new cls({ props }, node);


<div dojoType="foo.bar.baz"></div><div data-dojo-type="foo.bar.baz"></div>

// Backboneishnew MyView({ $el: $(node)})

// bootstrappy<button data-reset-text="ha" data-foo-text="bar!" >ha</button>

$("button").button("foo");


Module Loading\o/


// fetch foo/bar/__package__.jsdojo.require("foo.bar.*");dojo.addOnLoad(function(){ console.warn(foo.bar.baz)});


// fetch foo/bar/baz.jsdojo.require("foo.bar.baz");dojo.addOnLoad(function(){ console.warn(foo.bar.baz)});


// fetch foo/bar/baz.jsdojo.require("foo.bar.baz");

SYNCHRONOUS XHR + EVAL

dojo.provide("foo.bar.baz");dojo.require("foo.bar.baz.bam");foo.bar.baz = { bam: true };

REPEAT.


SYNCHRONOUS XHR + EVAL

* ORIGIN LIMITATIONS

* **

** EVIL (?)


James burkeDojo / AMD / requirejs / et al


dojo._xdResourceLoaded(function(){ return { depends:[ ["provide","dojo.foo"], ], defineResource: function(dojo, dijit, dojox){ if(!dojo._hasResource["dojo.foo"]){ dojo._hasResource["dojo.foo"] = true; /* original code */ } } };});


AMD* asynchronous* anonymous* x-domain


define(["foo/bar/baz"], function(foobarbaz){ return { bam: true };});


node.js / ecma* Still being argued* UMD a mess


BACKEND JAVASCRIPTNODE, ET AL


Dojo Did* Rhino / multi-env support* Dojo Build tools* dojox.dtl


Dojo Did* Rhino / multi-env support* Dojo Build tools* dojox.dtl

ADDED NODE.JSUSING NODE.JSABANDONED :(


No end to Node potential.


UI LIBRARIESAND “PLUGINS”


Dijit... could do a whole talk here


Dijit* instance based control* externalized resources* a11y* l10n / i18n


Dijit* Backwards compatible* Unified “everything”


Dijit could:* better event registration* alternate templating


CORE JS... IT’S JUST JAVASCRIPT


Underscore* lots of handy stuff.


Underscore“The tie to go with jQuery’s tux”


UnderscoreShouldn’t have to fix * map() * or bind() * or `this`


Underscoreis not amd/umd ready ...*

* LODASH


Lots of stuffis not amd/umd ready ...


It’s Just JS* Don’t be limited by “best practice”* Understand the language* Enjoy the nuance


Questions?


PROJECT

DATE CLIENT29/5/2013 @PHIGGINS

FIN.GRACIAS.


Jsconf.us.2013

Documents

Transcript of Jsconf.us.2013