Abstract
HTML5 applications normally have a large set of CSS (Cascading Style Sheets) rules for data display. Each CSS rule consists of a node selector and a declaration block (which assigns values to selected nodes' display attributes). As web applications evolve, maintaining CSS files can easily become problematic. Some CSS rules will be replaced by new ones, but these obsolete (hence redundant) CSS rules often remain in the applications. Not only does this “bloat” the applications – increasing the bandwidth requirement – but it also significantly increases web browsers' processing time. Most works on detecting redundant CSS rules in HTML5 applications do not consider the dynamic behaviours of HTML5 (specified in JavaScript); in fact, the only proposed method that takes these into account is dynamic analysis, which cannot soundly prove redundancy of CSS rules. In this paper, we introduce an abstraction of HTML5 applications based on monotonic tree-rewriting and study its "redundancy problem". We establish the precise complexity of the problem and various subproblems of practical importance (ranging from P to EXP). In particular, our algorithm relies on an efficient reduction to an analysis of symbolic pushdown systems (for which highly optimised solvers are available), which yields a fast method for checking redundancy in practice. We implemented our algorithm and demonstrated its efficacy in detecting redundant CSS rules in HTML5 applications.
Supplemental Material
Available for Download
Artifact containing the TreePed tool discussed in the main paper as a jar file, source code, and VM image.
- A no-limit version of {2}. http://treeped.bitbucket. org/example-up.html, March 2015.Google Scholar
- A simple HTML5 application. http://treeped. bitbucket.org/example.html, March 2015.Google Scholar
- P. A. Abdulla, K. Cerans, B. Jonsson, and Y.-K. Tsay. General decidability theorems for infinite-state systems. In LICS, pages 313–321, 1996. Google Scholar
Digital Library
- P. A. Abdulla, B. Jonsson, P. Mahata, and J. d’Orso. Regular tree model checking. In CAV, pages 555–568, 2002. Google Scholar
Digital Library
- S. Abiteboul, R. Hull, and V. Vianu. Foundations of Databases. Addison-Wesley, 1994. Google Scholar
Digital Library
- S. Abiteboul, O. Benjelloun, and T. Milo. Positive active XML. In PODS, pages 35–45, 2004. Google Scholar
Digital Library
- S. Abiteboul, L. Segoufin, and V. Vianu. Static analysis of active XML systems. ACM Trans. Database Syst., 34(4), 2009. Google Scholar
Digital Library
- E. Andreasen and A. Møller. Determinacy in static analysis for jQuery. In OOPSLA, pages 17–31, 2014.. URL http: //doi.acm.org/10.1145/2660193.2660214. Google Scholar
Digital Library
- Average Web Page Size. http://www. websiteoptimization.com/speed/tweak/ average-web-page/.Google Scholar
- J. Bailey, A. Poulovassilis, and P. T. Wood. An eventcondition-action language for XML. In WWW, pages 486– 495, 2002. Google Scholar
Digital Library
- T. Ball and S. K. Rajamani. Bebop: A symbolic model checker for boolean programs. In SPIN, pages 113–130, 2000. Google Scholar
Digital Library
- M. Bodin, A. Charguéraud, D. Filaretti, P. Gardner, S. Maffeis, D. Naudziuniene, A. Schmitt, and G. Smith. A trusted mechanised JavaScript specification. In POPL, pages 87–100, 2014.. URL http://doi.acm.org/10.1145/2535838. Google Scholar
Digital Library
- 2535876.Google Scholar
- M. Bosch, P. Genevès, and N. Layaïda. Automated refactoring for size reduction of CSS style sheets. In DocEng, pages 13– 16, 2014. Google Scholar
Digital Library
- Cilla website. https://github.com/saltlab/cilla/.Google Scholar
- W. Fan, F. Geerts, and F. Neven. Expressiveness and complexity of XML publishing transducers. ACM Trans. Database Syst., 33(4), 2008. Google Scholar
Digital Library
- A. Finkel and P. Schnoebelen. Well-structured transition systems everywhere! Theor. Comput. Sci., 256(1-2):63–92, 2001. Google Scholar
Digital Library
- J. Flum and M. Grohe. Parameterized Complexity Theory. Springer, 2006. Google Scholar
- B. Genest, A. Muscholl, O. Serre, and M. Zeitoun. Tree pattern rewriting systems. In ATVA, pages 332–346, 2008. Google Scholar
Digital Library
- B. Genest, A. Muscholl, and Z. Wu. Verifying recursive active documents with positive data tree rewriting. In FSTTCS, pages 469–480, 2010.Google Scholar
- P. Geneves, N. Layaida, and V. Quint. On the Analysis of Cascading Style Sheets. In WWW, pages 809–818, 2012. Google Scholar
Digital Library
- S. Göller and A. W. Lin. Refining the process rewrite systems hierarchy via ground tree rewrite systems. ACM Trans. Comput. Log., 15(4):26:1–26:28, 2014.. Google Scholar
Digital Library
- S. Guarnieri and V. B. Livshits. GATEKEEPER: mostly static enforcement of security and reliability policies for JavaScript code. In USENIX, pages 151–168, 2009. URL http://www.usenix.org/events/sec09/ tech/full_papers/guarnieri.pdf. Google Scholar
Digital Library
- S. Guarnieri, M. Pistoia, O. Tripp, J. Dolby, S. Teilhet, and R. Berg. Saving the world wide web from vulnerable JavaScript. In ISSTA, pages 177–187, 2011. Google Scholar
Digital Library
- . URL http://doi.acm.org/10.1145/2001420.2001442.Google Scholar
- M. Hague. Senescent ground tree rewrite systems. In CSLLICS, page 48, 2014. Google Scholar
Digital Library
- M. Hague, A. W. Lin, and L. Ong. Detecting redundant CSS rules in HTML5 applications: A tree-rewriting approach. CoRR, abs/1412.5143, 2014. URL http://arxiv.org/ abs/1412.5143.Google Scholar
- D. Jang and K. M. Choe. Points-to analysis for JavaScript. In SAC, pages 1930–1937, 2009.. URL http://doi.acm. org/10.1145/1529282.1529711. Google Scholar
Digital Library
- S. H. Jensen, A. Møller, and P. Thiemann. Type Analysis for JavaScript. In SAS, pages 238–255, 2009.. URL http: //dx.doi.org/10.1007/978-3-642-03237-0_17. Google Scholar
Digital Library
- S. H. Jensen, M. Madsen, and A. Møller. Modeling the HTML DOM and browser API in static analysis of JavaScript web applications. In SIGSOFT/FSE, pages 59–69, 2011.. URL http://doi.acm.org/10.1145/2025113.2025125. Google Scholar
Digital Library
- jQuery. http://jquery.com/.Google Scholar
- jQuery stats (Dec 2014). http://trends.builtwith.com/ javascript/jQuery.Google Scholar
- N. Klarlund, A. Møller, and M. I. Schwartzbach. MONA implementation secrets. Int. J. Found. Comput. Sci., 13(4): 571–586, 2002.Google Scholar
Cross Ref
- . URL http://dx.doi.org/10.1142/ S012905410200128X.Google Scholar
- S. La Torre, P. Madhusudan, and G. Parlato. Analyzing recursive programs using a fixed-point calculus. In PLDI, pages 211–222, 2009. Google Scholar
Digital Library
- B. S. Lerner, L. Elberty, J. Li, and S. Krishnamurthi. Combining form and function: Static types for JQuery programs. In ECOOP, pages 79–103, 2013. Google Scholar
Digital Library
- L. Libkin. Logics for unranked trees: An overview. Logical Methods in Computer Science, 2(3), 2006.Google Scholar
- A. W. Lin. Weakly-synchronized ground tree rewriting. In MFCS, pages 630–642, 2012. Google Scholar
Digital Library
- A. W. Lin. Accelerating tree-automatic relations. In FSTTCS, pages 313–324, 2012.Google Scholar
- C. Löding. Reachability problems on regular ground tree rewriting graphs. Theory Comput. Syst., 39(2):347–383, 2006. Google Scholar
Digital Library
- C. Löding and A. Spelten. Transition graphs of rewriting systems over unranked trees. In MFCS, pages 67–77, 2007. Google Scholar
Digital Library
- S. Maneth, A. Berlea, T. Perst, and H. Seidl. XML type checking with macro tree transducers. In PODS, pages 283– 294, 2005. Google Scholar
Digital Library
- Z. Manna and A. Pnueli. Temporal Verification of Reactive Systems: Safety. Springer, 1995. Google Scholar
Digital Library
- M. Marx. Conditional XPath. ACM Trans. Database Syst., 30 (4):929–959, 2005. Google Scholar
Digital Library
- R. Mayr. Process rewrite systems. Inf. Comput., 156(1-2): 264–286, 2000.. Google Scholar
Digital Library
- D. Mazinanian, N. Tsantalis, and A. Mesbah. Discovering refactoring opportunities in cascading style sheets. In FSE, pages 496–506, 2014. Google Scholar
Digital Library
- K. L. McMillan. Symbolic model checking. Kluwer, 1993. ISBN 978-0-7923-9380-1. Google Scholar
Digital Library
- A. Mesbah and S. Mirshokraie. Automated Analysis of CSS Rules to Support Style Maintenance. In ICSE, pages 408–418, 2012. Google Scholar
Digital Library
- L. A. Meyerovich and R. Bodik. Fast and parallel webpage layout. In WWW, pages 711–720, 2010. Google Scholar
Digital Library
- Moped. http://www2.informatik.uni-stuttgart.de/ fmi/szs/tools/moped/.Google Scholar
- Nivo Slider. https://github.com/gilbitron/ Nivo-Slider.Google Scholar
- Sanwebe. http://www.sanwebe.com/2013/03/ addremove-input-fields-dynamically-with-jquery.Google Scholar
- M. Schäfer, M. Sridharan, J. Dolby, and F. Tip. Dynamic determinacy analysis. In PLDI, pages 165–174, 2013.. URL http://doi.acm.org/10.1145/2462156.2462168. Google Scholar
Digital Library
- B. Schlingloff. Expressive completeness of temporal logic of trees. Journal of Applied Non-Classical Logics, 2(2):157– 180, 1992.Google Scholar
Cross Ref
- S. Schwoon. Model-Checking Pushdown Systems. PhD thesis, Technischen Universität München, 2002.Google Scholar
- M. Sipser. Introduction to The Theory of Computation. Cengage Learning, 3 edition, 2012.Google Scholar
- M. Sridharan, J. Dolby, S. Chandra, M. Schäfer, and F. Tip. Correlation tracking for points-to analysis of JavaScript. In ECOOP, pages 435–458, 2012.. URL http://dx.doi. org/10.1007/978-3-642-31057-7_20. Google Scholar
Digital Library
- D. Suwimonteerabuth, F. Berger, S. Schwoon, and J. Esparza. jMoped: A test environment for Java programs. In CAV, pages 164–167, 2007. Google Scholar
Digital Library
- TreePed. https://bitbucket.org/TreePed/treeped.Google Scholar
- UnCSS website. https://github.com/giakki/uncss.Google Scholar
Index Terms
Detecting redundant CSS rules in HTML5 applications: a tree rewriting approach
Recommendations
Detecting redundant CSS rules in HTML5 applications: a tree rewriting approach
OOPSLA 2015: Proceedings of the 2015 ACM SIGPLAN International Conference on Object-Oriented Programming, Systems, Languages, and ApplicationsHTML5 applications normally have a large set of CSS (Cascading Style Sheets) rules for data display. Each CSS rule consists of a node selector and a declaration block (which assigns values to selected nodes' display attributes). As web applications ...






Comments