1 / 11

Doloto: Enhancing AJAX Application Performance Through Code Splitting

Doloto is a groundbreaking approach to code management for AJAX applications, addressing the challenges of large JavaScript codebases. By utilizing a strategy of on-demand code loading, Doloto enhances responsiveness and reduces latency, ultimately improving user experience. With AJAX apps often comprising up to 90% JavaScript, this tool optimizes performance by downloading only what's needed when bandwidth allows. Features include runtime training for access profiling, function rewriting for on-demand loading, and background prefetching. Doloto drives faster startup times and efficient resource usage.

plato
Download Presentation

Doloto: Enhancing AJAX Application Performance Through Code Splitting

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. Ben Livshits and Emre Kiciman Microsoft Research Redmond, WA Doloto: Code Splitting for AJAX Applications

  2. A Web 2.0 Application Disected 1+ MB code Talks to 14 backend services (traffic, images, directions, ads, …) 70,000+ lines of JavaScript code downloaded 2,855 Functions

  3. AJAXApps Have Lots of Code Up to 90% of a Web 2.0 app is JavaScript code!

  4. Why AJAX? • Client-side JavaScript code • Reduces latency and improves user experience • Avoids constant network round trips • Catch-22 • Takes a while to transfer code to the client • Code can be MBs in size • Application execution is blocked until code arrives

  5. Motivation for Doloto • Idea behind Doloto • Start with a small piece of code on the client • Download required code on demand (pull) • Send code when bandwidth available (push) • Leads to better application responsiveness • Interleave code download & execution • Faster startup times • Rarely executed code is rarely downloaded

  6. Doloto Training Tool • [training] Runtime training to collect access profile (AjaxView Fiddler plugin) • [rewriting] Function rewriting or “stubbing” for on-demand code loading • [prefetch] Background prefetch of clusters as the application is running

  7. Automated Function Splitting var g = 10; var real_f1; function f1() { if(!real_f1){ var code = load(“f1”); real_f1 = eval(code); f1 = real_f1; } return real_f1.apply(this, arguments); } var g = 10; function f1(){ var x=g+1; … … … … … return …; } • [training] Runtime training to collect access profiles • [rewriting] Function rewriting or “stubbing” for on-demand code loading • [prefetch] Background prefetch of clusters as the application is running eval($exp(“f1”), “”); // 21 chars

  8. Architecture of Doloto • [training] Runtime training to collect access profiles • [rewriting] Function rewriting or “stubbing” for on-demand code loading • [prefetch] Background prefetch of clusters as the application is running

  9. Size Savings with Doloto

  10. Runtime Savings with Doloto

  11. Contact us Ben Livshits (livshits@microsoft.com) Doloto MSR _

More Related