Architecture

This page provides a broad description of the architecture for the first prototype.

Design

The model that suits better the application is a 2-tier stack consisting of:

     +----------+
     | Renderer |
     +-----+----+
           ^
           | <HTTP>
           |
+----------+----------+
| Target Code Parsing |
+---------------------+

• Rendering layer Responsible for physically drawing the visualization of the current state of the program at runtime.
• Code parsing layer Responsible for instrumenting the target source code in order to augment it with calls to the rendering API through which visual events can be sent to the rendering layer for visualization.

The lower layer is responsible for acting at compile time on the target source code. The upper will rely on the structures generated by the lower layer in order to visualize the running code.

Decoupling

Communications are made via the HTTP protocol which would provide a very good level of decoupling between the two layers. By doing so we can achieve a lot:

• The final application can reside in two different locations: the target program running can run on a different machine and its runtime visualization can be displayed on another machine allowing remote inspection out-of-the-box/by-design.
• It is possible not to avoid binding the application to a specific type of target source. More parsers can be implemented for handling different languages (C++, Java, TypeScript, etc.).