Source Code Visualisation

Author: Samuel Williams When: Thursday, 05 August 2010

Source code visualisation can potentially help programmers understand a program more quickly, especially if they are not familiar with it. Traditional tools are being improved to allow for more accurate software engineering and better visibility of program structure.

Find/Replace is being improved by project visualisation and language aware refactoring tools. Browsing classes and functions has become easier with high level visualisations. Changing the name of a variable, moving a function from one class to another, and many other structured tasks are becoming much simpler with language aware editors.

Here are some projects which might find there way into the future programmers toolbox.

Project Visualisation

Gource is a software version control visualisation tool. It allows you to review the changes to source code over time at a very high level, including the person who makes the change. While the idea is fascinating and the implementation visually exciting, the actual technical information that is conveyed is minimal. In many ways, it might be more useful when used in real time; for example, it would allow you to find out who is working on a particular part of a large project. It could also be used as a navigational tool for understanding the structure of a project.

Extravis (Execution Trace Visualizer) is a visual tool for inspecting the execution of a program. In this sense, it allows the end user to accurately visualise the connections between components which would otherwise be separated by layers of indirection.

Doxygen is a fantastic tool for generating documentation from source code. It can create high level diagrams and outputs documentation in multiple formats. It is a fantastic tool for understanding source code and quickly getting up to speed with a large project.

SLOCcount (Source Lines Of Code Count) is an excellent tool for understanding the high level composition of a program in terms of what languages are used. It could easily be extended to show this information over time by integrating it with a SCM system.

Language Aware Editors

Code Bubbles is a fantastic concept where source code is manipulated at a much finer granularity than is traditionally possible using a classic file based editor. Functions in the program are shown as bubbles of code, and these can be expanded as required to show dependant functionality. It allows for developers to rapidly drill into a function and to find out how things are working.

Source Code Augmentation

Basic syntax highlighting is a well covered area. However, there are many other areas where source code augmentation can be useful. Semantic meaning along with syntax is equally important when reading and understanding a program's source code.

Inline documentation, unit test coverage, performance metrics, are a few of the ways source code could be annotated to provide better feedback about the source code.

Further Reading

Comments

Leave a comment

Please note, comments must be formatted using Markdown. Links can be enclosed in angle brackets, e.g. <www.codeotaku.com>.