ABSTRACT
We present Theseus, an IDE extension that visualizes run-time behavior within a JavaScript code editor. By displaying real-time information about how code actually behaves during execution, Theseus proactively addresses misconceptions by drawing attention to similarities and differences between the programmer's idea of what code does and what it actually does. To understand how programmers would respond to this kind of an always-on visualization, we ran a lab study with graduate students, and interviewed 9 professional programmers who were asked to use Theseus in their day-to-day work. We found that users quickly adopted strategies that are unique to always-on, real-time visualizations, and used the additional information to guide their navigation through their code.
- Burg, B., Bailey, R., Ko, A. J., and Ernst, M. D. Interactive record/replay for web application debugging. UIST '13, ACM (New York, NY, USA, 2013), 473--484. Google ScholarDigital Library
- Chilton, L., Kim, J., André, P., Cordeiro, F., Landay, J., Weld, D., Dow, S., Miller, R., and Zhang, H. Frenzy: Collaborative Data Organization for Creating Conference Sessions. SIGCHI '14 (2014). Theseus: https://github.com/adobe-research/theseus Fondue: https://github.com/adobe-research/fondue Google ScholarDigital Library
- Fleming, S. D., Scaffidi, C., Piorkowski, D., Burnett, M., Bellamy, R., Lawrance, J., and Kwan, I. An information foraging theory perspective on tools for debugging, refactoring, and reuse tasks. TOSEM 22, 2 (2013), 14. Google ScholarDigital Library
- Gould, J. D. Some psychological evidence on how people debug computer programs. International Journal of Man-Machine Studies 7, 2 (1975), 151--182.Google ScholarCross Ref
- Griffiths, D. Scheme Bricks, Sept. 2013. http://www. pawfal.org/dave/index.cgi'Projects/Scheme%20Bricks.Google Scholar
- Ko, A., Myers, B., and Aung, H. Six learning barriers in end-user programming systems. In VL/HCC (2004), 199--206. Google ScholarDigital Library
- Ko, A. J., and Myers, B. A. Designing the Whyline: A Debugging Interface for Asking Questions about Program Behavior. In SIGCHI '04, vol. 6 (2004). Google ScholarDigital Library
- LaToza, T. D., and Myers, B. A. Developers Ask Reachability Questions. In Proc. ICSE 2010, vol. 1, ACM Press (New York, New York, USA, 2010). Google ScholarDigital Library
- LaToza, T. D., and Myers, B. A. Visualizing Call Graphs. In VL/HCC 2011 (Sept. 2011).Google Scholar
- Lieberman, H., and Fry, C. Bridging the Gulf Between Code and Behavior in Programming. CHI '95 (1995). Google ScholarDigital Library
- Mankoff, J., Dey, A. K., Hsieh, G., Kientz, J., Lederer, S., and Ames, M. Heuristic evaluation of ambient displays. CHI '03, ACM (2003), 169--176. Google ScholarDigital Library
- McDirmid, S. Usable live programming. SIGPLAN (2013).Google Scholar
- Meier, M. S., Miller, K. L., and Pazel, D. P. Experiences with Building Distributed Debuggers. In Proc. SIGMETRICS 1996 (1996). Google ScholarDigital Library
- Microsoft. Debug Your App by Recording Code Execution with IntelliTrace. http://msdn.microsoft.com/ en-us/library/vstudio/dd264915.aspx.Google Scholar
- Resnick, M., Maloney, J., Monroy-Hernández, A., Rusk, N., Eastmond, E., Brennan, K., Millner, A., Rosenbaum, E., Silver, J., Silverman, B., et al. Scratch: programming for all. Communications of the ACM 52, 11 (2009), 60--67. Google ScholarDigital Library
- Saff, D., and Ernst, M. Reducing wasted development time via continuous testing. In ISSRE '03 (2003), 281--292. Google ScholarDigital Library
- Schrock, E. Debugging AJAX in Production. ACM Queue (2009). Google ScholarDigital Library
- Sillito, J., Murphy, G. C., and De Volder, K. Questions programmers ask during software evolution tasks. SIGSOFT '06/FSE-14, ACM (2006), 23--34. Google ScholarDigital Library
- Swift, B., Sorensen, A., Gardner, H., and Hosking, J. Visual code annotations for cyberphysical programming. In 1st International Workshop on Live Programming (LIVE) (2013).Google ScholarDigital Library
- Tanimoto, S. Towards a theory of progressive operators for live visual programming environments. In IEEE Workshop on Visual Languages (1990), 80--85.Google ScholarCross Ref
- Victor, B. Learnable Programming. http://worrydream.com/#!/LearnableProgramming, 2012.Google Scholar
Index Terms
- Addressing misconceptions about code with always-on programming visualizations
Recommendations
Augmenting Code with In Situ Visualizations to Aid Program Understanding
CHI '18: Proceedings of the 2018 CHI Conference on Human Factors in Computing SystemsProgrammers must draw explicit connections between their code and runtime state to properly assess the correctness of their programs. However, debugging tools often decouple the program state from the source code and require explicitly invoked views to ...
Theseus: understanding asynchronous code
CHI EA '13: CHI '13 Extended Abstracts on Human Factors in Computing SystemsThe behavior of JavaScript is difficult to understand due to the language's asynchronous and dynamic nature. In particular, chains of event handlers pose difficulties because they cannot be stepped through with a debugger, and determining where a chain ...
CrossCode: Multi-level Visualization of Program Execution
CHI '23: Proceedings of the 2023 CHI Conference on Human Factors in Computing SystemsProgram visualizations help to form useful mental models of how programs work, and to reason and debug code. But these visualizations exist at a fixed level of abstraction, e.g., line-by-line. In contrast, programmers switch between many levels of ...
Comments