A look under the hood:!Radically Faster Web Performance withWeb Application Streaming!!!Peter Blum!VP of PM, Instart Logic...
Who are we?!Formula for Instart Logic!Start with abunch of big dataengineers1!Add people whobuilt big sitesand apps3!Add p...
Outline!A different type of technology1Feature deep dive and demos2Example: Putting it together34 Case Study: Kongregate
From Downloading to Streaming!FROM DOWNLOADS…!…TO STREAMING!FROM DOWNLOADS…!…TO STREAMING!FROM DOWNLOADS…!…TO STREAMING!AD...
Instart Logic’s Unique Solution!•  Streams the web application to minimize time to experience!•  Automatically partition a...
Understanding Instart Logic’s Solution!Web Application!Browser API & Cache!Distributed !Cloud Service! Customer Web!Infras...
Web Application!NanoVisor™!Browser APIs & Cache!NanoVisor!How it works!Virtualizes resource calls on the client side!!•  B...
Feature Deep Dive !HTML Streaming1Flash Streaming2Image Streaming3
How Traditional Dynamic HTML Delivery Works!UK: CDN Server!US: CDN Server!Symmetric Network !Acceleration!US: Web Server!I...
How Dynamic HTML Streaming Works!Symmetric Network !Acceleration!US: Web Server!US Server!US Server!Image!Image!UK Server!...
What the waterfall looks like!Tradi1onal	  
How Traditional Flash App Delivery Works!Flash File!3 Mbps! 8,000 KB SWF!8,000 KB!20 Sec!Ready!
Flash File!8,000 KB SWF!Audio!ImageE!ImageA!ActionScript!ImageF!ImageB!ShapeD!ShapeG!ShapeC!8,000 KB SWF!How Flash App Str...
How Flash App Streaming Works!3 Mbps!8,000 KB SWF!ActionScript!NanoVisor!7,500 KB Assets!ActionScript!Audio!ImageE!ImageA!...
How Flash App Streaming Works!3 Mbps!2,000 KB!5 Sec!4,000 KB!10 Sec!Ready!ActionScript!Audio!ImageE!ImageA!ImageF!ImageB!S...
How Traditional Image Delivery Works!2 Mbps!1,500 KB!5.8 Sec!Ready!1,500 KB !of JPG/PNG!
How Instart Logic Image Streaming Works!2 Mbps!1,500 KB of JPG/PNG!Initial: 500 KB!Next: 1,000 KB!500 KB!1.9 Sec!1,000 KB!...
Demo – Bunch of Shoes!
NanoVisor™	  Image	  1	  (40%)	  Image	  2	  (40%)	  Image	  2	  (60%)	  HTML	  (90%)	  JavaScript	  Image	  3	  (60%)	  I...
CEO Kongregate
A division of GameStopJim Greer20 | Confidential and proprietary
GameStop	  Corp.	   •  Headquarters:	  Grapevine,	  TX	  •  Fortune	  300	  company	  (NYSE:	  GME).	  	  World’s	  larges...
Select Games
Why Performance matters at Kongregate
Trying out Instart Logic•  Engaged initially before beta in early 2012•  Validated the idea and started testing•  Started ...
Some example resultsCDN 9.6 MBInstart 1.2 MBObliterate Everything 287%LessCDN 5.2 MBInstart 2.9 MBMad Burger44%LessCDN 7.3...
Another example26 |CDN 19.2 MBInstart 9.6 MB50%Less
Demo
Going forward•  Bounce rate reduction after switch to Instart•  Initial engagement focused around performance•  New joint ...
Email:	  pblum@instartlogic.com	  Happy to talk more!
Upcoming SlideShare
Loading in …5
×

Radically Faster Web Performance with Web Application Streaming

2,575 views

Published on

Learn about a radical new cloud service that combines an active client-side JavaScript component with application intelligence to stream web sites and applications delivering radically faster web performance without compromising on quality. Take a deep dive into the architecture and technology, and hear from one of Instart Logic's customers Kongregate, a Fortune 500 company, about their experience with the technology in production delivering browser based games to over 15 million users.

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

No Downloads
Views
Total views
2,575
On SlideShare
0
From Embeds
0
Number of Embeds
66
Actions
Shares
0
Downloads
1
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Radically Faster Web Performance with Web Application Streaming

  1. 1. A look under the hood:!Radically Faster Web Performance withWeb Application Streaming!!!Peter Blum!VP of PM, Instart Logic!!Jim Greer!CEO, Kongregate!
  2. 2. Who are we?!Formula for Instart Logic!Start with abunch of big dataengineers1!Add people whobuilt big sitesand apps3!Add people whoknow virtualizationand browsers2!Add people whoknow webdelivery4!
  3. 3. Outline!A different type of technology1Feature deep dive and demos2Example: Putting it together34 Case Study: Kongregate
  4. 4. From Downloading to Streaming!FROM DOWNLOADS…!…TO STREAMING!FROM DOWNLOADS…!…TO STREAMING!FROM DOWNLOADS…!…TO STREAMING!ADN!CDN!Video!x86 Applications!Web Applications!
  5. 5. Instart Logic’s Unique Solution!•  Streams the web application to minimize time to experience!•  Automatically partition application into multiple fragments!•  Intelligently sequence the fragments to be delivered!•  Enable application to start with only a subset of fragments!•  Turn key for publishers and transparent to end users!•  Requires no code change or app/toolbar install!•  End-to-end solution, replacement for a CDN/ADN!
  6. 6. Understanding Instart Logic’s Solution!Web Application!Browser API & Cache!Distributed !Cloud Service! Customer Web!Infrastructure!Instart Logic Nanovisor™!Transparent !Client Side Intelligence!PersonalizedAppSequencer™!Deep Understanding!Of Applications!•  Built  in  JavaScript  and  Ac1onScript  •  Captures  load  and  execu1on  profiles  •  Ability  to  receive  applica1on  as  a  stream    •  Large-­‐scale  analysis  of  load  and  execu1on  pa?erns  •  Deep  understanding  of  web  app  components  •  Fragments,  orders  and  sends  apps  as  a  stream    
  7. 7. Web Application!NanoVisor™!Browser APIs & Cache!NanoVisor!How it works!Virtualizes resource calls on the client side!!•  Browser consumes HTML, JavaScript, CSS, Flash!•  Results in resource calls to fetch other elements!•  Goes to the cache and then the network!•  NanoVisor intercepts, tracks, and can adjust those calls!•  Handles static references (ex: <img src=“pic1.jpg”>)!•  Handles dynamic runtime references (ex: image1.src=“pic1.jpg”)!•  As sites and applications become complex and dynamic!•  Client side virtualization can handle runtime decisions!•  Static rewriting approaches (ex: FEO) don’t do well here!
  8. 8. Feature Deep Dive !HTML Streaming1Flash Streaming2Image Streaming3
  9. 9. How Traditional Dynamic HTML Delivery Works!UK: CDN Server!US: CDN Server!Symmetric Network !Acceleration!US: Web Server!Image!Image!CSS!JS!REQUESTDynamic HTML!REQUEST  REQUEST  REQUEST  REQUEST  
  10. 10. How Dynamic HTML Streaming Works!Symmetric Network !Acceleration!US: Web Server!US Server!US Server!Image!Image!UK Server!CSS!JS!Non-Unique HTML  REQUESTDynamic HTML!REQUEST  REQUEST  
  11. 11. What the waterfall looks like!Tradi1onal  
  12. 12. How Traditional Flash App Delivery Works!Flash File!3 Mbps! 8,000 KB SWF!8,000 KB!20 Sec!Ready!
  13. 13. Flash File!8,000 KB SWF!Audio!ImageE!ImageA!ActionScript!ImageF!ImageB!ShapeD!ShapeG!ShapeC!8,000 KB SWF!How Flash App Streaming Works!3 Mbps!
  14. 14. How Flash App Streaming Works!3 Mbps!8,000 KB SWF!ActionScript!NanoVisor!7,500 KB Assets!ActionScript!Audio!ImageE!ImageA!ImageF!ImageB!ShapeD!ShapeG!ShapeC!8,000 KB SWF!Audio!Image!E!Image!A!Image!F!Image!B!Shape!D!Shape!G!Shape!C!NanoVisor™!540 KB SWF!
  15. 15. How Flash App Streaming Works!3 Mbps!2,000 KB!5 Sec!4,000 KB!10 Sec!Ready!ActionScript!Audio!ImageE!ImageA!ImageF!ImageB!ShapeD!ShapeG!ShapeC!NanoVisor™!540 KB SWF!Audio!ImageE!ImageA!ImageF!ImageB!ShapeD!ShapeG!ShapeC!7,500 KB Assets!7,000 KB Assets!
  16. 16. How Traditional Image Delivery Works!2 Mbps!1,500 KB!5.8 Sec!Ready!1,500 KB !of JPG/PNG!
  17. 17. How Instart Logic Image Streaming Works!2 Mbps!1,500 KB of JPG/PNG!Initial: 500 KB!Next: 1,000 KB!500 KB!1.9 Sec!1,000 KB!3.6 Sec!Ready!
  18. 18. Demo – Bunch of Shoes!
  19. 19. NanoVisor™  Image  1  (40%)  Image  2  (40%)  Image  2  (60%)  HTML  (90%)  JavaScript  Image  3  (60%)  Image  4  (60%)  Image  1  (60%)  Image  3  (40%)  Image  4  (40%)  CSS  Applica1on  Ready  HTML  CSS  JavaScript  Image  1  Image  2  Image  3  Image  4  Applica1on  Ready  HTML  (10%)  HTTP  Request   HTTP  Request  Illustration: The Instart Logic Difference!
  20. 20. CEO Kongregate
A division of GameStopJim Greer20 | Confidential and proprietary
  21. 21. GameStop  Corp.   •  Headquarters:  Grapevine,  TX  •  Fortune  300  company  (NYSE:  GME).    World’s  largest  video  game  retailer  with  2011  revenues  of  about  $10  billion  •  Recognized  as  a  top  35  digital  media  company  and  17th  most  powerful  brand  in  the  U.S.    •  Mul1-­‐channel  strategy  to  address  exis1ng  and  new  forms  of  game    distribu1on  and  mone1za1on  •  Kongregate  has  15  million  monthly  users  GameStop Company Background
  22. 22. Select Games
  23. 23. Why Performance matters at Kongregate
  24. 24. Trying out Instart Logic•  Engaged initially before beta in early 2012•  Validated the idea and started testing•  Started with a proof of concept–  Started testing internally with a few games–  Allowed moderator community to try it in staging•  Production traffic migration over time–  Started with a few new games–  Grew usage to include all new games–  Switched all Flash traffic to Instart Logic
  25. 25. Some example resultsCDN 9.6 MBInstart 1.2 MBObliterate Everything 287%LessCDN 5.2 MBInstart 2.9 MBMad Burger44%LessCDN 7.3 MBInstart 4.9 MBCyclomaniacs Epic33%LessCDN 12.7 MBInstart 1.7 MBGhost Hacker 286%LessCDN 2.7 MBInstart 1.3 MBResort Empire51%LessEnigmata: Stellar WarCDN 4.9 MBInstart 1.9 MB61%Less
  26. 26. Another example26 |CDN 19.2 MBInstart 9.6 MB50%Less
  27. 27. Demo
  28. 28. Going forward•  Bounce rate reduction after switch to Instart•  Initial engagement focused around performance•  New joint collaboration on other areas of UX–  Leveraging NanoVisor virtualization capabilities–  Solving some tough issues around multi-device use•  Stay tuned for more soon…
  29. 29. Email:  pblum@instartlogic.com  Happy to talk more!

×