Efficient and Precise Dynamic Slicing for Client-Side JavaScript Programs

JavaScript is the de facto dominant programming language for developing web applications. Most popular websites are using JavaScript, especially to develop client-side features. Being syntactically flexible and highly dynamic, JavaScript is easy to use and productive, but its code is known to be less maintainable. The task of maintaining client-side JavaScript code is further complicated by the pervasive interactions between JavaScript code and HTML elements, through browsers. In this paper, we present JS-Slicer, a dynamic slicer for JavaScript, to ease the task of understanding and debugging practical client-side JavaScript code. JS-Slicer defines three types of dependences, including data dependences, control dependences, and DOM dependences, to capture all relationships between program elements. JS-Slicer extends a novel dynamic analysis framework and combines dynamic and static analysis to precisely capture the dependences at run-time. A lot of language specific issues are properly handled, which enables JS-Slicer to slice practical JavaScript code. Our evaluation on six real-world web applications and JavaScript libraries shows that JS-Slicer is both precise and efficient: on average it captures around 40K dependences in 2.5K lines of code, in less than 3.0 seconds.