5. Massive Code base of YUI
and other JS libraries
I heard some people use this thing called jQuery,
but I’m not convinced it’ll catch on
6. Laziness or “I’m sick
of writing stuff twice”
I could have said efficiency, but I think we all secretly long to
sit around in our y-fronts. Except Higgins, who already does.
24. JavaScript is
• Proprietary to Netscape (now Mozilla)
• “Ahead” of ECMAScript
• Only really deployed in Mozilla
projects
• Only useful on the server
25. ECMAScript is
• A standard
• Implemented in all browsers
• ECMAScript-262 3rd ed. ~
JavaScript 1.5
• ECMAScript-262 5th ed. has no
JavaScript equivalent
26. JavaScript 1.6+
• E4X (EcmaScript For XML)
• Let scope blocks
• Generators
• Generator expressions
43. Fab
• with ( fab = require( "../" ) ) module.exports = fab
( contentLength )
( stringify )
( //date/ )
( tmpl )
( "The date is <%= this.toDateString() %>." )
()
( //time/ )
( tmpl )
( "The time is <%= this.toTimeString() %>." )
()
( new Date );
71. ‘ello World Node Style
#!/usr/bin/env node
var YUI = require("../lib/node-yui3").YUI,
Y = YUI();
Y.log('ello World');
72. ‘ello World YUI Style
#!/usr/bin/env node
require("../lib/node-yui3").YUI().log('ello
World');
73. ‘ello World YUI Style
[~/examples (master)⚡] ➔ ./hello.js
[INFO]: ello World
74. Enabling YUI’s Loader
YUI.add(‘get’, function(Y) {
// reads from file system or creates a httpClient
// for remote data.
Y.Get.script = function(s, cb) {
var urls = Y.Array(s), url, i, l = urls.length;
for (i=0; i<l; i++) {
// doesn't need to be blocking, so don't block.
YUI.include(url, function(err) {
if (err) { Y.log(err, 'error', 'get'); }
pass(cb);
});
// replaced with process.compile so YUI doesn’t
// need to be global
// require.async(url, function (err, mod) {
}
};
});
75. Enabling YUI’s Loader
#!/usr/bin/env node
var YUI = require('../lib/node-yui3').YUI;
YUI({
filter: 'debug'
}).use('event-custom', function(Y) {
Y.on('pwnd', function() {
Y.log('Never gonna give you up, never
gonna let you down...');
});
Y.fire('pwnd');
});
77. Accessing Remote Data
Using the YQL module from YUI Gallery
#!/usr/bin/env node
var sys = require('sys'),
YUI = require('../lib/node-yui3').YUI;
YUI().use('json', 'gallery-yql', function(Y) {
var q = 'select * from github.user.info where
(id = "apm")',
o = new Y.yql(q);
o.on('query', function(r) {
//sys.inspects serializes objects to text
sys.puts(sys.inspect(r));
});
});
80. What about the DOM?
• YUI isn’t all about the DOM
• But YUI has many DOM-centric modules.
• Being able to use these components on
the server opens up some interesting
opportunities.
81. Rendering HTML -
nodejs-dom
• Dav pulled together two open source projects
to do it:
• jsdom - DOM level 1 support, written in
JavaScript
• node-htmlparser - HTML parser written in
JavaScript. Needed for innerHTML
• These are not nodeJS specific implementations
82. Rendering HTML -
nodejs-dom
• DOM element creation and manipulation
• Selector API
• YUI’s Node API
85. Progressive Enhancement
• YUI 2 calendar control is loaded via the YUI
2 in 3 project
• The calendar control is fully rendered on
the server.
• No script.
• Page and nav clicks are round trips.
• If script is enabled, we could enhance the
links to pull only the data for each page and
render on the client.
87. Multiple Response Types
• First response will render the entire page.
• A client without script can request the fully
rendered page.
• A script enabled client can request just the new
content.
• A script enabled client with the source that is
running on the server can request just the
JSON data structure that creates the content.
• It’s the same code.
88. Other Uses
• Fast utility layer testing with YUI Test.
• Smoke tests for DOM-centric code.
• Could emulate some browser quirks.
• Validation Code
90. Summary
• SSJS is awesome because
• We are JavaScript programmers
• Reuse (libraries/code)
• Progressive Enhancement
• Node.js + YUI3 rocks
• YUI 3’s was easy to get running on Node.js
• Server side DOM allows for a single code
base
91. Today presentation was
Brought to you by And the fonts:
the letters: Comic Sans
J and S monofur
Tom Hughes-Croucher Slides, etc --> http://
@sh1mmer speakerrate.com/sh1mmer
croucher@yahoo-inc.com Pls rate me. kthxbai.
