Kaimin Zhang
ABSTRACT
This paper presents smart caching schemes for Web browsers. For modern Web applications, the style formatting and layout calculation often account for substantial amounts of the local computation in order to render a Web page. In this paper, we propose two caching schemes to reduce the computation of style formatting and layout calculation, named smart style caching and layout caching, respectively. The stable style data and layout data for DOM (Document Object Model) elements are recorded to construct the caches when a Web page is browsed. The cached data is checked in the granularity of DOM elements and applied directly if the identified DOM element is not changed in the sequent visits to the same page.
We have implemented a prototype of the proposed caching schemes based on the Webkit layout engine. The experimental results with Web pages from the Top 25 Web sites show that, with the smart style caching scheme enabled, the time consumed for style formatting is reduced by 64% on average; with both the smart style caching scheme and layout caching scheme enabled, the time consumed for layout calculation are reduced by 61% on average, and the overall performance improvement is about 46%.
References
- Microsoft Corp. Bing Maps. http://www.bing.com/maps.Google Scholar
- Google Inc. Google Docs. http://docs.google.com/.Google Scholar
- Jones, C. G., Liu, R., Meyerovich, L., Asanovic, K., and Bodik, R. 2009. Parallelizing the Web browser, 1st USENIX Workshop on Hot Topics in Parallelism (Mar. 30-31, 2009). Google ScholarDigital Library
- IE 8 Performance. http://blogs.msdn.com/ie/archive/2008/08/26/ie8-performance.aspx.Google Scholar
- The Webkit Open Source Project. http://webkit.org/.Google Scholar
- Cascading Style Sheets 2.1. http://www.w3.org/TR/CSS2/.Google Scholar
- W3C. Document Object Model (DOM). http://www.w3.org/DOM/Google Scholar
- Reflows & Repaints: CSS performance making your JavaScript slow. http://www.stubbornella.org/content/2009/03/27/reflows-repaints-css-performance-making-your-javascript-slow/.Google Scholar
- Wilton-Jones, M. Efficient JavaScript. http://dev.opera.com/articles/view/efficient-javascript/.Google Scholar
- Baron, D. Faster HTML and CSS: layout engine internals for web developers, https://library.mozilla.org/Faster_HTML_and_CSS:_Layout_Engine_Internals_for_Web_Developers.Google Scholar
- HTML Reflow, http://www.mozilla.org/newlayout/doc/reflow.html.Google Scholar
- W3C standards. http://www.w3.org/standards/.Google Scholar
- GNU WGet, http://www.gnu.org/software/wget/Google Scholar
- Squid Web Caching Proxy, http://www.squid-cache.org/Google Scholar
- V8 JavaScript Engine, http://code.google.com/apis/v8/design.htmlGoogle Scholar
- Best Practices for Speeding Up Your Web Site, http://developer.yahoo.com/performance/rules.htmlGoogle Scholar
- JavaScript: TraceMonkey, https://wiki.mozilla.org/JavaScript:TraceMonkeyGoogle Scholar
- SquirrelFish-Webkit, http://trac.webkit.org/wiki/SquirrelFishGoogle Scholar
- Opera Mini homepage, http://www.opera.com/mini/Google Scholar
Index Terms
Smart caching for web browsers
Comments