The document is a personal introduction by a senior UI engineer at Netflix, discussing their interests in JavaScript and Node.js. It touches on topics like the JavaScript ecosystem, middleware functions, and the importance of automation and reducing dependencies in web development. Additionally, the author invites others to discuss innovations at Netflix related to JavaScript.

1. Going
at

2. About Me
Senior UI Engineer At Netflix!
ranklam@netflix.com!
@bittersweetryan

6. The Rest!
44%
Facebook
BitTorrent
iTunes
YouTube!
13%
Netflix!
34%
Peak Downstream Traffic 1H 2014
https://www.sandvine.com/downloads/general/global-internet-phenomena/2014/1h-2014-global-internet-phenomena-report.pdf

7. "MS Freedom of the Seas in its maiden voyage" by Andres Manuel Rodriguez -
We have this
Stable

8. "MS Freedom of the Seas in its maiden voyage" by Andres Manuel Rodriguez -
We have this
Full Featured

9. "MS Freedom of the Seas in its maiden voyage" by Andres Manuel Rodriguez -
We have this
Needs a diverse crew

10. "MS Freedom of the Seas in its maiden voyage" by Andres Manuel Rodriguez -
We have this
Not very agile

11. "Lewis Hamilton 2014 China Race" by emperornie
We want this

12. …but not for the reason you think
Modular

13. …but not for the reason you think
Lightweight

14. …but not for the reason you think
Very Agile

15. Shakti

16. Why Node?

17. UI Engineers Write the JavaScript They Love

18. Node is the New UI Layer
Client
Node
Request Time
HTML
Post Request
HTML
Service Calls
Client JS
Services
Build Process

19. The event loop fits our needs well

20. The Node Event Loop
http://blog.carbonfive.com/2013/10/27/the-javascript-event-loop-explained/
function contextMiddleware( req, res, next ){
var movieId = req.params.movieId || 0;
movie.fetch( movieId, function( movieData ){
res.set( { movieData : movieData } )
next();
} );
}

21. The Node Event Loop
http://blog.carbonfive.com/2013/10/27/the-javascript-event-loop-explained/
function contextMiddleware( req, res, next ){
var movieId = req.params.movieId || 0;
movie.fetch( movieId, function( movieData ){
res.set( { movieData : movieData } )
next();
} );
}

22. The Node Event Loop
http://blog.carbonfive.com/2013/10/27/the-javascript-event-loop-explained/
function contextMiddleware( req, res, next ){
var movieId = req.params.movieId || 0;
movie.fetch( movieId, function( movieData ){
res.set( { movieData : movieData } )
next();
} );
}

23. The Node Event Loop
http://blog.carbonfive.com/2013/10/27/the-javascript-event-loop-explained/
function contextMiddleware( req, res, next ){
var movieId = req.params.movieId || 0;
movie.fetch( movieId, function( movieData ){
res.set( { movieData : movieData } )
next();
} );
}

24. Allowed us to remove many runtime dependencies

25. Shakti was built with a few core principals

26. Embrace the JavaScript Ecosystem.

27. Embrace the JavaScript Ecosystem.
express
web application
framework for
node

28. Embrace the JavaScript Ecosystem.

29. Embrace the JavaScript Ecosystem.
{dust}

30. Embrace the JavaScript Ecosystem.

31. Use Existing Infrastructure
Jasori Lewis

32. Simple API, Reduce Depencencies
http://www.launchphotography.com/Discovery_Flight_Deck.html

33. http://www.launchphotography.com/Discovery_Flight_Deck.html
Simplify By Removing Dependencies

34. We do have a few unique challenges
http://sjmagazine.net/wp-content/uploads/2014/07/NUP_163855_0336.jpg

35. Assets
http://www.wired.com/wp-content/uploads/blogs/wiredenterprise/wp-content/uploads/2012/10/ff_googleinfrastructure_large.jpg

36. Templating / i18n
http://2.bp.blogspot.com/-4KCTn2jSdU0/TlZFNNwofPI/AAAAAAAAFc0/K0ogqSByYlY/s1600/IMG_5947.JPG

37. Middle Tier Services

38. Build Process
http://3.bp.blogspot.com/-o-LcrSq_w1o/T1ywq9G57gI/AAAAAAAACQU/sRYxh6A6fBA/s1600/P1120378.jpg

39. Modules
http://www.launchphotography.com/Discovery_Flight_Deck.html
commonjs

40. Modules
http://www.launchphotography.com/Discovery_Flight_Deck.html
es6

41. Modules
http://www.launchphotography.com/Discovery_Flight_Deck.html
NPM

42. We Learned A Few Things On Our Journey
http://i.huffpost.com/gen/951056/thumbs/o-CANADA-LIGHT-BULB-BAN-facebook.jpg

43. Nothing Is Ever Done

44. Engineers are opinionated creative.

45. Automate as many things is you can

46. Allow for diverse inputs, always have predictable outputs

47. function getLocalizedStrings( arrayOrBundle, key, callback ){
if( arrayOrBundle.isArray() ){
return new Promise( function( resolve, reject ){
//return localized object
} );
}
else if( typeof arrayOrBundle === ‘string’ ){
return new Promise( function( resolve, reject ){
//return localized object
} );
}
}

48. Keep async API’s async

49. function getLocalizedString( package, key, callback ){
if( this.cache[ package ] && this.cache[ package ][ key ] ){
callback( this.cache[ package ][ key ] ); //not async
}
else{
this.getString( package, key, callback ); //async call
}
}

50. function getLocalizedString( package, key, callback ){
if( this.cache[ package ] && this.cache[ package ][ key ] ){
setTimeout( function( ){
callback( this.cache[ package ][ key ] );
}, 0 );
}
else{
this.getString( package, key, callback );
}
}

51. Questions
http://eugenebrandt.files.wordpress.com/2013/09/hands-voting.jpg

52. Thank You!
Please stop me in the halls and talk to me about all the cool things
Netflix is doing with JavaScript! I love to talk about this stuff!
ranklam@netflix.com