A Source Code History Navigator

Alexander Bradley (awjb@cs.ubc.ca)

CPSC 533C Project ProposalUniversity of British Columbia

October 30, 2009

1 Problem Description

This project will address a problem drawn from the domain of software engineering: visualizingthe history of source code. To gain understanding of the decisions and developmental steps thatled to the current state of a piece of source code, a developer may need to consult several previousrevisions of the code using a revision control system such as CVS. Current integrated developmentenvironments (IDEs) such as Eclipse make it easy to compare two revisions of a source code file.However, the developer may need to compare several past revisions to gain the desired understand-ing of the code’s evolution. Many-revision comparison is not, to my knowledge, well supportedby current IDEs. Research in software visualization systems has explored some techniques fordisplaying software evolution, and I hope to build on these existing approaches.

Any codebase with a significant revision history (and probably, though not necessarily, multiplecontributors) is a potential dataset for this project. A particular dataset I may use is the open-sourceJQuery project from the UBC Software Practices Lab, with which I have some past experience asa developer.

2 Personal Expertise

I have 20 months of employment experience (16 co-op, 4 as an undergraduate RA) in software de-velopment positions. I am familiar with the Eclipse IDE and revision control systems such as CVS,Subversion and Perforce. The problem addressed in this project is one I personally encountered insome of my development work.

I have some experience developing GUIs using the Swing toolkit for Java. I have little experi-ence developing GUIs directly with SWT, although I have some experience using SWT indirectlyduring Eclipse plugin development.

3 Proposed Solution

For my proposed solution to this problem, I am considering some variations on a small multiplesapproach. In its simplest form, this approach would display several revisions of the same file sideby side (see Figure 1) or in a grid (Figure 2). The available screen real estate on current monitorswould probably make it difficult to display more than three legible code panes horizontally andtwo panes vertically, but scroll bars could be used to permit access to a larger virtual space of codepanes. (I envision the side-by-side display scrolling horizontally and the grid display scrollingvertically.) Each code pane could incorporate additional visual and textual information of use tothe developer, e.g. marginal hints regarding the locations of differences, revision notes, revisionnumbers and authors, or source code colouring showing code age, statement type or authorship.

I am also considering a more complex focus+context visualization (see Figure 3) which incor-porates elements of the TableLens of Rao and Card [2] and the “evolution view” from the VisualCode Navigator (VCN) of Lommerse et al. [1]. As in VCN, file revisions would be displayed asa “flow” of vertical stripes of pixels, with each horizontal pixel line in the stripe representing oneor more lines of code from the revision. The horizontal pixel lines could be coloured accordingto code age, code authorship, etc. (see Figure 8 in [1] for examples.) At a few points, code panesshowing the actual text of code from particular revisions could be embedded in the flow immedi-ately to the right of the pixel stripes for those revisions. A black rectangle to the left of a code pane

1

could indicate where the code shown in the pane was located in the pixel-stripe representation ofthat revision. The lines of code in the pane could have a similar background colour scheme to thepixel stripe, to further emphasize the connection between the panes and the flow. The user wouldbe able to move the panes to focus on different revisions, perhaps by dragging them or selectingrevision stripes with the mouse.

The three visualizations described above would probably be useful in different and comple-mentary ways. The focus+context view could be used to assess the overall patterns of evolutionin the code and pick revisions of interest. The two small multiples views could be used for moredetailed code comparison between selected revisions of interest.

Ideally, this system would be integrated with an IDE (e.g., as an Eclipse plugin), but this willnot be considered an essential aspect of this course project. I will investigate Eclipse integration ifI have extra time.

This tool will tentatively be called the Source Code History Navigator (SCHN).

Figure 1: Side-by-side small multiples display (mockup).

4 Usage Scenario

A developer has discovered buggy code in source file AnalyticalEngine.java and wants toexplore the file’s history. The developer opens the file in SCHN. Initially, the focus+context viewof the revision history is displayed with some arbitrarily selected code panes. The developer selectscolouring by authorship and moves the code panes to points where significant changes seem to haveoccurred. The developer selects four interesting revisions and displays them in the grid view. Afterdetailed comparison of the revisions, the developer might conclude that the code causing a buggybehaviour was introduced by user menabrea in revision 31 and significantly modified by usersalovelace in revision 45 and cbabbage in revision 60. The developer might then contact thoseusers to discuss the impact of a possible bug fix.

5 Implementation Approach

I plan to implement this system in Java using either Swing or Eclipse SWT. I am more familiarwith using Swing for GUI development. However, using SWT would make subsequent integration

2

Figure 2: Grid small multiples display (mockup).

Figure 3: Historical evolution view with embedded code panes (sketch).

3

of my system as an Eclipse plugin easier, and might also permit me to reuse source code displaycomponents from Eclipse. My system will probably be designed to interact with the CVS revisioncontrol system.

6 Schedule

A tentative schedule for this project is as follows:

Friday, November 6: Development environment set up. Prototype should becapable of accessing CVS repository and downloadingcode. Small-multiples prototype started.

Monday, November 16: Prototype of small-multiples views complete.Prototype of focus+context view started.

Monday/Wednesday, November 16/18: Project update presentation.Friday, November 27: Prototypes of all views complete.Thursday, December 10: Final implementation complete.

Final presentation and report drafted.Monday, December 14: Final project presentations.Wednesday, December 16: Final report submitted.

7 Related Work

The code evolution “flow” visualization used in this project has its roots in a number of priorsystems. Early work by Ball and Eick [3] explored the idea of representing large amounts ofcode by condensing source code lines to single-pixel horizontal line representations. The “flow”approach considered above was inspired by the “history flows” created by Viegas et al. [3] tovisualize Wikipedia edit history. Voinea [4, 5, 6] has explored the domain of software evolutionvisualization extensively and has produced a variety of visualization techniques for exploring thehistory of source code files and entire codebases. The Visual Code Navigator [1] mentioned earlierincorporates his work. Voinea’s CVSscan tool [5] includes a pixel-stripe revision visualizationsimilar to “history flows”, but has more sophisticated filtering techniques to accommodate thepotentially large size of code files. CVSscan also includes a “details-on-demand” feature whichallows the user to select a single revision from the flow and view the associated source code.

References

[1] G. Lommerse, F. Nossin, L. Voinea, and A. Telea. The visual code navigator: An interactivetoolset for source code investigation. In INFOVIS ’05: Proceedings of the 2005 IEEE Sym-posium on Information Visualization, page 4, Washington, DC, USA, 2005. IEEE ComputerSociety.

[2] R. Rao and S. K. Card. The table lens: merging graphical and symbolic representations in aninteractive focus + context visualization for tabular information. In CHI ’94: Proceedings ofthe SIGCHI conference on Human factors in computing systems, pages 318–322, New York,NY, USA, 1994. ACM.

4

[3] F. B. Viegas, M. Wattenberg, and K. Dave. Studying cooperation and conflict between authorswith history flow visualizations. In CHI ’04: Proceedings of the SIGCHI conference on Humanfactors in computing systems, pages 575–582, New York, NY, USA, 2004. ACM.

[4] L. Voinea and A. Telea. Visual querying and analysis of large software repositories. EmpiricalSoftware Engineering, 14(3):316–340, 2009.

[5] L. Voinea, A. Telea, and J. J. van Wijk. CVSscan: visualization of code evolution. In SoftVis’05: Proceedings of the 2005 ACM symposium on Software visualization, pages 47–56, NewYork, NY, USA, 2005. ACM.

[6] S. L. Voinea. Software Evolution Visualization. PhD thesis, Technische Universiteit Eind-hoven, 2007.

5