Abstract

To characterize the building blocks of a legacy software system (e.g.,structure, dependencies), programmers usually spend a long timenavigating its source code. Yet, modern integrated developmentenvironments (IDEs) do not provide appropriate means to efficientlyachieve complex software comprehension tasks. To deal with thisunfulfilled need, we present Hunter, a tool for the visualizationof JavaScript applications. Hunter visualizes source code througha set of coordinated views that include a node-link diagram thatdepicts the dependencies among the components of a system, anda treemap that helps programmers to orientate when navigatingits structure.In this paper, we report on a controlled experiment that evaluates Hunter. We asked 16 participants to solve a set of softwarecomprehension tasks, and assessed their effectiveness in terms of(i) user performance (i.e., completion time, accuracy, and attention),and (ii) user experience (i.e., emotions, usability). We found thatwhen using Hunter programmers required significantly less timeto complete various software comprehension tasks and achieveda significantly higher accuracy. We also found that the node-linkdiagram panel of Hunter gets most of the attention of programmers, whereas the source code panel does so in Visual Studio Code.Moreover, programmers considered that Hunter exhibits a gooduser experience.