1 / 48

Enabling the Transition to the Mobile Web with WebSieve

Learn why load time matters for the mobile web and discover WebSieve, a tool that automates mobile-friendly optimization to reduce page complexity and improve load times.

gravelle
Download Presentation

Enabling the Transition to the Mobile Web with WebSieve

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Enabling the Transition to the Mobile Web with WebSieve Michael Butkiewicz, Zhe Wu, Shunan Li, Pavithra Murali, Vagelis Hristidis, HarshaV. Madhyastha (UC Riverside), Vyas Sekar (Stony Brook University)

  2. Why does load time matter? Source: gomez.com

  3. Why does load time matter? “Google incorporates site speed into search rankings” Source: gomez.com

  4. High Load Times are Common

  5. High Load Times are Common Median Site w/o mobile version 19 sec

  6. High Load Times are Common Median Mobile Site 13 sec Median Site w/o mobile version 19 sec

  7. Page Complexity  Load Time  Well Studied MobiSys 2010 Huang, et al. IMC 2011 Butkiewicz, et al. HotMobile 2011 Wang, et al. httparchive.org

  8. Page Complexity  Load Time  Well Studied MobiSys 2010 Huang, et al. IMC 2011 Butkiewicz, et al. HotMobile 2011 Wang, et al. httparchive.org

  9. Page Complexity  Load Time  Well Studied MobiSys 2010 Huang, et al. IMC 2011 Butkiewicz, et al. HotMobile 2011 Wang, et al. httparchive.org 2008 50 objects

  10. Page Complexity  Load Time  Well Studied MobiSys 2010 Huang, et al. IMC 2011 Butkiewicz, et al. HotMobile 2011 Wang, et al. httparchive.org 2012 100 objects! 2008 50 objects

  11. Page Complexity  Load Time  Well Studied MobiSys 2010 Huang, et al. IMC 2011 Butkiewicz, et al. HotMobile 2011 Wang, et al. httparchive.org 2012 100 objects! 2008 50 objects Webpage Complexity outpacing Mobile Resources

  12. WebSieve’s Goal State of the Art: Manual Reduction of Complexity

  13. WebSieve’s Goal State of the Art: Manual Reduction of Complexity Our Goal: Automate Mobile-Friendly Optimization

  14. WebSieve’s Goal State of the Art: Manual Reduction of Complexity Our Goal: Automate Mobile-Friendly Optimization

  15. WebSieve’s Goal State of the Art: Manual Reduction of Complexity Our Goal: Automate Mobile-Friendly Optimization • Block Low Importance Objects

  16. WebSieve’s Goal State of the Art: Manual Reduction of Complexity Our Goal: Automate Mobile-Friendly Optimization • Block Low Importance Objects • Prioritize High Importance Objects

  17. WebSieve’s Goal State of the Art: Manual Reduction of Complexity Our Goal: Automate Mobile-Friendly Optimization • Block Low Importance Objects • Prioritize High Importance Objects

  18. Challenge 1. Inferring Object Utility

  19. Challenge 1. Inferring Object Utility Low Utility Low Utility Low Utility

  20. Challenge 1. Inferring Object Utility High Utility High Utility

  21. Challenge 1. Inferring Object Utility ? Utility

  22. Challenge 2. Discovering Dependencies HTML CSS JS

  23. Challenge 2. Discovering Dependencies HTML CSS JS

  24. Challenge 2. Discovering Dependencies HTML CSS JS

  25. Challenge 3. Predicting New Load Times

  26. Challenge 3. Predicting New Load Times Server Variability

  27. Challenge 3. Predicting New Load Times Server Variability Script Processing

  28. Challenge 3. Predicting New Load Times Server Variability Script Processing Parallel Connection Limits

  29. Our Vision For WebSieve Front-end Back-end O1 O2 O3 O4 foo.com/x

  30. Our Vision For WebSieve Dependency Extraction Front-end Back-end O1 O2 O3 O4 foo.com/x

  31. Our Vision For WebSieve User Utility Inference Dependency Extraction Front-end Back-end Object Selection O1 O2 O3 O4 foo.com/x

  32. Our Vision For WebSieve User Utility Inference Dependency Extraction Front-end Back-end Object Selection Fetch Fingerprint O1 O2 O3 O4 Fetch HTML foo.com/x

  33. Our Vision For WebSieve User Utility Inference Dependency Extraction Front-end Back-end Object Selection {O1,O3} O1 O2 O3 O4 Fetch HTML foo.com/x

  34. Our Vision For WebSieve User Utility Inference Dependency Extraction Front-end Back-end Object Selection 2. Load {O1,O3} 1. HTML Received O1 O2 O3 O4 foo.com/x

  35. Challenge 1. Inferring Utility Approach: User Study + Machine Learning

  36. Challenge 1. Inferring UtilityApproach: User Study + Machine Learning Simple Machine Learning Not Enough Personalization Is Key

  37. Challenge 2. Discover DependenciesApproach: Block & Infer Original Load HTML JPG a JS 1 JS 2 JPG b JPG c

  38. Challenge 2. Discover DependenciesApproach: Block & Infer Original Load Block JS 1 HTML HTML JPG a JPG a JS 1 JS 2 JPG b JPG c

  39. Challenge 2. Discover DependenciesApproach: Block & Infer Original Load Block JS 2 Block JS 1 HTML HTML HTML JPG a JPG a JS 1 JPG a JS 1 JS 2 JPG b JPG b JPG c

  40. Challenge 2. Discover DependenciesApproach: Block & Infer Original Load Block JS 2 Block JS 1 HTML HTML HTML JPG a JPG a JS 1 JPG a JS 1 JS 2 JPG b JPG b JPG c

  41. Challenge 3. Object Selection Approach: Page Tree Cut • Cut Dependency DAG • Maximize Utility • Respect Load Time Budget Util: 5 Time: 4s Util: 1 Time: 1s Util: 2 Time: 0.5s Util: 0 Time: 0.1s Util: 2 Time: 0.5s Util: 1 Time: 2s Util: 7 Time: 0.4s Util: 3 Time: 2s Util: 5 Time: 0.5s

  42. Challenge 3. Object Selection Approach: Page Tree Cut • Cut Dependency DAG • Maximize Utility • Respect Load Time Budget Util: 5 Time: 4s Util: 1 Time: 1s Util: 2 Time: 0.5s Util: 0 Time: 0.1s Util: 2 Time: 0.5s Util: 1 Time: 2s Util: 7 Time: 0.4s Util: 3 Time: 2s Util: 5 Time: 0.5s

  43. Wrap Up Load Time Strongly Impacts User Satisfaction State of the Art:Manual Complexity Reduction

  44. Wrap Up Load Time Strongly Impacts User Satisfaction State of the Art:Manual Complexity Reduction WebSieve:Automate Mobile-Friendly Optimization

  45. Wrap Up Load Time Strongly Impacts User Satisfaction State of the Art:Manual Complexity Reduction WebSieve:Automate Mobile-Friendly Optimization • Block Low Importance Objects

  46. Wrap Up Load Time Strongly Impacts User Satisfaction State of the Art:Manual Complexity Reduction WebSieve:Automate Mobile-Friendly Optimization • Block Low Importance Objects • Prioritize High Importance Objects

  47. Wrap Up Load Time Strongly Impacts User Satisfaction State of the Art:Manual Complexity Reduction WebSieve:Automate Mobile-Friendly Optimization • Block Low Importance Objects • Prioritize High Importance Objects Challenges: Object Dependency, Utility, Obj. Selection

  48. Wrap Up Load Time Strongly Impacts User Satisfaction State of the Art:Manual Complexity Reduction WebSieve:Automate Mobile-Friendly Optimization • Block Low Importance Objects • Prioritize High Importance Objects Challenges: Object Dependency, Utility, Obj. Selection Ongoing Prototype Development & Promising Results

More Related