Using Node.js to improve               the performance of           Mobile apps and Mobile web                   Tom Hughe...
Watch the video with slide                         synchronization on InfoQ.com!                      http://www.infoq.com...
Presented at QCon San Francisco                          www.qconsf.comPurpose of QCon- to empower software development by...
Scalable Server-Side Code with JavaScript           Who is Tom?     •   Wrote W3C Standards     •     •         10+ years ...
This is a talk about why              cell phones suck.@sh1mmer
@sh1mmer
Radio waves suck           (at least compared to fibre or copper)@sh1mmer
http://developer.yahoo.com/blogs/ydn/posts/2009/10/a_engineers_gui/@sh1mmer
Radio vs. buildings@sh1mmer
@sh1mmer
@sh1mmer
@sh1mmer
@sh1mmer
@sh1mmer
Desktop                                     Mobile           http://www.webperformancetoday.com/2012/04/02/mobile-versus-d...
Ookla/speedtest.net           via http://www.slideshare.net/patrickmeenan/velocity-2012-taming-the-mobile-beast/22@sh1mmer
Effect of latency on servers@sh1mmer
Shielding Frontends@sh1mmer
nginx           haproxy               web services                     frontends             ATS                    / data...
var client = net.connect(80, domain, function() {             client.write("GET / HTTP/1.1rn");             t1 = (new Date...
Sample of Alexa 5000           macupdate.com       442.3           uzai.com            403.658           wired.jp         ...
Event-driven Frontends@sh1mmer
Client → Server   Server → DB                    Computation     Computation@sh1mmer
Not an event frontend@sh1mmer
@sh1mmer
Server@sh1mmer
Request@sh1mmer
@sh1mmer
Event-driven frontend@sh1mmer
Place-holder@sh1mmer
@sh1mmer
Shared    Work  Resources@sh1mmer
Memory operations@sh1mmer
var x = "I am a string"           ~1ns Running 1 instruction           2ns Data from l1 cpu cache           5ns Data from ...
@sh1mmer
Mobile latency@sh1mmer
@sh1mmer
100 Blue Whales                         Cat@sh1mmer
"They went from running 15 servers with 15           instances (virtual servers) on each physical machine,           to ju...
Not just simple applications@sh1mmer
@sh1mmer
@sh1mmer
First page load vs. Client MVC@sh1mmer
@sh1mmer
http://www.belshe.com/2010/05/24/more-bandwidth-doesnt-matter-much/@sh1mmer
Bandwidth           Latency               Device capability@sh1mmer
Barfing data at 3G@sh1mmer
                                                                                                           ...
@sh1mmer
Clientside templating@sh1mmer
@sh1mmer
Node.js allows you to tune           rendering between client and           server based on the network.@sh1mmer
HTML                                         JSON       More bandwidth                  Less bandwidth     Less client pro...
http://engineering.linkedin.com/frontend/leaving-jsps-dust-moving-linkedin-dustjs-client-side-templateshttp://engineering....
Challenges     •   JSON - fast object / slow render     •   HTML - fast render / slow objects     •   If we use HTML where...
Identifying use cases     •   "Client-side apps" - read/write data on client     •   "Render-only apps" - mostly read data...
Summary     •   Node.js allows you to:         •   Manage resources with unreliable mobile data connections         •   Ch...
Demo time.@sh1mmer
Questions  @sh1mmer
Using Node.js to Improve the Performance of Mobile Apps and Mobile Web
Upcoming SlideShare
Loading in …5
×

Using Node.js to Improve the Performance of Mobile Apps and Mobile Web

918 views

Published on

Video and slides synchronized, mp3 and slide download available at http://bit.ly/11aNbSq.

Tom Hughes-Croucher discusses increasing the performance of web applications and websites by using Node.js’ event-driven approach. Filmed at qconsf.com.

Tom Hughes-Croucher has worked in the Web industry for over a decade. He is the founder and principal at Jetpacks for Dinosaurs, a consultancy specializing in high-scale and high performance Internet applications for clients such as Walmart, Comcast and MySpace. Tom has co-authored W3C Standards and O'Reilly's "Up and Running with Node.js".

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
918
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Using Node.js to Improve the Performance of Mobile Apps and Mobile Web

  1. 1. Using Node.js to improve the performance of Mobile apps and Mobile web Tom Hughes-Croucher@sh1mmer
  2. 2. Watch the video with slide synchronization on InfoQ.com! http://www.infoq.com/presentations /Nodejs-Performance-Web InfoQ.com: News & Community Site• 750,000 unique visitors/month• Published in 4 languages (English, Chinese, Japanese and Brazilian Portuguese)• Post content from our QCon conferences• News 15-20 / week• Articles 3-4 / week• Presentations (videos) 12-15 / week• Interviews 2-3 / week• Books 1 / month
  3. 3. Presented at QCon San Francisco www.qconsf.comPurpose of QCon- to empower software development by facilitating the spread ofknowledge and innovationStrategy - practitioner-driven conference designed for YOU: influencers ofchange and innovation in your teams- speakers and topics driving the evolution and innovation- connecting and catalyzing the influencers and innovatorsHighlights- attended by more than 12,000 delegates since 2007- held in 9 cities worldwide
  4. 4. Scalable Server-Side Code with JavaScript Who is Tom? • Wrote W3C Standards • • 10+ years in the web industry Worked on projects for: Tesco, NASA, Walmart, MySpace, etc Node Up and Running • ~5 years at Yahoo! including .com Tom Hughes-Croucher • Node team at Joyent@sh1mmer
  5. 5. This is a talk about why cell phones suck.@sh1mmer
  6. 6. @sh1mmer
  7. 7. Radio waves suck (at least compared to fibre or copper)@sh1mmer
  8. 8. http://developer.yahoo.com/blogs/ydn/posts/2009/10/a_engineers_gui/@sh1mmer
  9. 9. Radio vs. buildings@sh1mmer
  10. 10. @sh1mmer
  11. 11. @sh1mmer
  12. 12. @sh1mmer
  13. 13. @sh1mmer
  14. 14. @sh1mmer
  15. 15. Desktop Mobile http://www.webperformancetoday.com/2012/04/02/mobile-versus-desktop-latency/@sh1mmer
  16. 16. Ookla/speedtest.net via http://www.slideshare.net/patrickmeenan/velocity-2012-taming-the-mobile-beast/22@sh1mmer
  17. 17. Effect of latency on servers@sh1mmer
  18. 18. Shielding Frontends@sh1mmer
  19. 19. nginx haproxy web services frontends ATS / data varnish@sh1mmer
  20. 20. var client = net.connect(80, domain, function() { client.write("GET / HTTP/1.1rn"); t1 = (new Date()).getTime(); }); client.on(end, function() { t2 = (new Date()).getTime(); output.write(domain + + ((t2-t1)/1000) + sn); });@sh1mmer
  21. 21. Sample of Alexa 5000 macupdate.com 442.3 uzai.com 403.658 wired.jp 238.848 facilisimo.com 205.159 mycokerewards.com 202.757 rbc.cn 192.354 moviesmobile.net 183.157 stop55.com 145.927 dir.bg 137.982 carrefour.fr 112.789 sifyitest.com 111.171@sh1mmer
  22. 22. Event-driven Frontends@sh1mmer
  23. 23. Client → Server Server → DB Computation Computation@sh1mmer
  24. 24. Not an event frontend@sh1mmer
  25. 25. @sh1mmer
  26. 26. Server@sh1mmer
  27. 27. Request@sh1mmer
  28. 28. @sh1mmer
  29. 29. Event-driven frontend@sh1mmer
  30. 30. Place-holder@sh1mmer
  31. 31. @sh1mmer
  32. 32. Shared Work Resources@sh1mmer
  33. 33. Memory operations@sh1mmer
  34. 34. var x = "I am a string" ~1ns Running 1 instruction 2ns Data from l1 cpu cache 5ns Data from l2 cpu cache 80ns Data from ram@sh1mmer
  35. 35. @sh1mmer
  36. 36. Mobile latency@sh1mmer
  37. 37. @sh1mmer
  38. 38. 100 Blue Whales Cat@sh1mmer
  39. 39. "They went from running 15 servers with 15 instances (virtual servers) on each physical machine, to just four instances that can handle double the traffic." http://venturebeat.com/2011/08/16/linkedin-node/@sh1mmer
  40. 40. Not just simple applications@sh1mmer
  41. 41. @sh1mmer
  42. 42. @sh1mmer
  43. 43. First page load vs. Client MVC@sh1mmer
  44. 44. @sh1mmer
  45. 45. http://www.belshe.com/2010/05/24/more-bandwidth-doesnt-matter-much/@sh1mmer
  46. 46. Bandwidth Latency Device capability@sh1mmer
  47. 47. Barfing data at 3G@sh1mmer
  48. 48.                                                                                                                                                                                 @sh1mmer
  49. 49. @sh1mmer
  50. 50. Clientside templating@sh1mmer
  51. 51. @sh1mmer
  52. 52. Node.js allows you to tune rendering between client and server based on the network.@sh1mmer
  53. 53. HTML JSON More bandwidth Less bandwidth Less client processing More client processing Battery friendly Cheaper for you bandwidth/server Cheaper for them bandwidth@sh1mmer
  54. 54. http://engineering.linkedin.com/frontend/leaving-jsps-dust-moving-linkedin-dustjs-client-side-templateshttp://engineering.linkedin.com/frontend/client-side-templating-throwdown-mustache-handlebars-dustjs-and-more
  55. 55. Challenges • JSON - fast object / slow render • HTML - fast render / slow objects • If we use HTML where do we manage our model? • If we use JSON does rendering matter?@sh1mmer
  56. 56. Identifying use cases • "Client-side apps" - read/write data on client • "Render-only apps" - mostly read data on client@sh1mmer
  57. 57. Summary • Node.js allows you to: • Manage resources with unreliable mobile data connections • Choose where to apply rendering • Pick the right rendering solution for the right scenario@sh1mmer
  58. 58. Demo time.@sh1mmer
  59. 59. Questions @sh1mmer

×