This application enables to visualize a microservices architecture from a data perspective.
%%% Cite the papers
@inproceedings{andre2025b,
title = {Understanding Data Access in Microservices Applications Using Interactive Treemaps},
author = {Andr{\'e}, Maxime and Raglianti, Marco and Cleve, Anthony and Lanza, Michele},
booktitle = {Proceedings of the 33rd International Conference on Program Comprehension (ICPC 2025): ERA Track},
year = {2025},
organization = {IEEE Computer Society Press / ACM Press},
doi = {https://doi.org/10.1109/icpc66645.2025.00030}
}
@inproceedings{andre2025d,
title = {Visualizing and Exploring Data Access in Microservices Using Interactive Treemaps},
author = {Andr{\'e}, Maxime and Raglianti, Marco and Cleve, Anthony and Lanza, Michele},
booktitle = {Proceedings of the 13th Working Conference on Software Visualization (VISSOFT 2025): Research Track},
year = {2025},
organization = {IEEE Computer Society Press},
doi = {https://doi.org/10.1109/vissoft67405.2025.00012}
}
@inproceedings{deRycke2025a,
title = {Visualizing Data Access Traces in Microservices Using Animated Heat Treemaps},
author = {De Rycke, Maxime and Andr{\'e}, Maxime and Raglianti, Marco and Cleve, Anthony and Lanza, Michele},
booktitle = {Proceedings of the 13th Working Conference on Software Visualization (VISSOFT 2025): NIER Track},
year = {2025},
organization = {IEEE Computer Society Press},
doi = {https://doi.org/10.1109/vissoft67405.2025.00017}
}Here is a summary of the features currently supported.
It transforms a static analysis report logic object into a treemap view object.
| Transformation | Implementation status |
|---|---|
| Treemap | 🌕 |
INPUT
Invoke the transformation by using the POST /treemap route with a static analysis report in JSON (obtained from DENIM Reverse Engineering) inside the request.
OUTPUT
Consult the response view object in JSON:
{
"type": "treemap",
"data": {
// ...
},
"childrenNumber": <children number>,
"descendantsNumber": <descendants number>,
"width": <width>,
"height": <height>,
"x": <position on X axis>,
"y": <position on Y axis>,
"children": [
{
"type": "repository",
"data": {
"location": "https://github.com/<user>/<repository>"
},
"childrenNumber": <children number>,
"descendantsNumber": <descendants number>,
"width": <width>,
"height": <height>,
"x": <position on X axis>,
"y": <position on Y axis>,
"children": [
{
"type": "directory",
"data": {
"location": "https://github.com/<user>/<repository>/"
},
"childrenNumber": <children number>,
"descendantsNumber": <descendants number>,
"width": <width>,
"height": <height>,
"x": <position on X axis>,
"y": <position on Y axis>,
"children": [
{
"type": "file",
"data": {
"location": "https://github.com/<user>/<repository>/.../<file path>.js"
},
"width": <width>,
"height": <height>,
"x": <position on X axis>,
"y": <position on Y axis>,
"children": [
{
"type": "codeFragment",
"data": {
// See CodeFragment class in the static analysis report model
},
"childrenNumber": 0,
"descendantsNumber": 0,
"width": 20,
"height": 20,
"x": 7.5,
"y": 7.5,
"children": [],
"color": "<color>",
"opacity": "<opacity>"
}
],
"color": "<color>",
"opacity": "<opacity>"
}
],
"color": "<color>",
"opacity": "<opacity>"
}
],
"color": "<color>",
"opacity": "<opacity>"
}
],
"color": "#000000",
"opacity": "0.05"
}It transforms a dynamic analysis report logic object into a animated treemap frames view object.
| Transformation | Implementation status |
|---|---|
| Frames | 🌕 |
INPUT
Invoke the transformation by using the POST /frames route with a dynamic analysis report in JSON (obtained from DENIM Reverse Engineering Dynamic Analysis) inside the request.
OUTPUT
Consult the response view object in JSON:
[
{
"location": "https://github.com/<user>/<repository>/.../<file path>.js#Ly1Cx1Ly2Cx2",
"timestamp": <timestamp>,
"technology": {
"id": "<technology>"
},
"operation": {
"name": "<operation>"
},
"argumentValues": ["<key>", "<value>"],
"heuristics": "<heuristics>"
},
// ...
]It transforms a dynamic analysis report logic object into an object indicating the minimum and maximum number of calls across all code fragments.
| Transformation | Implementation status |
|---|---|
| Min Max | 🌕 |
INPUT
Invoke the transformation by using the POST /minmax route with a dynamic analysis report in JSON (obtained from DENIM Reverse Engineering Dynamic Analysis) inside the request.
OUTPUT
Consult the response view object in JSON:
{
"min": <min>,
"max": <max>
}See INSTALL file.
Manual test suites are set up thanks through the Postman tool.
The tests are specified in the /test/manual directory.
Unit test suites are set up thanks to the Jest framework.
The tests are specified in the /test/unit directory and are named following the *.test.js pattern.
The configuration of Jest is stated in the /package.json file.
The tests running computes the code coverage.
-
Launch the unit tests.
npm run test_unit
Integration test suites are set up thanks to the SuperTest framework.
The tests are specified in the /test/integration directory and are named following the *.test.js pattern.
The configuration of Jest is stated in the /package.json file.
- Launch the application on Docker (cf. Dockerize the application).
-
Launching integration tests.
npm run test_integration
An autogenerated documentation is available thanks to SwaggerUI at http://localhost:3000/docs.
-
Generate the documentation.
npm run swagger
A CI/CD process is set up thanks to GitLab CI/CD. Learn more about GitLab CI/CD via this page.
This one is described in the .gitlab-ci.yml.
-
Lint the application.
npm run lint
-
Formatting the application.
npm run format
- JavaScript
- Docker
- bin-pack is used for the implementation of the bin packing algorithm.
- expressjs is a backend NodeJS framework.
- body-parser is used for parsing REST API request body.
- cors is used for managing CORS.
- swagger-autogen is used for SWAGGER documentation.
- swagger-ui-express is used UI SWAGGER documentation.
- npm is the package manager used.
- GitLab CI/CD is the CI/CD continuous tool used.
- Docker Desktop is the containerization technology used.
- Postman is the tool for testing manually the API.
The treemap follows that model:
The animated heat treemap follows that model:
The timeline follows that model:
If you want to contribute to the project, please consider the following instructions:
- Any helping method or class must be named clearly (no abbreviations), especially integrating the type of detection, technology, and type of code fragment.
- More generally, any contribution must follow the conventions and keep the shape of previous contributions.
- Any contribution must be tested (unit and integration tests).
- All the tests and the CI/CD pipeline must pass before definitively integrating the contribution.
- Any contribution must be documented, especially by updating the
README.mdand theINSTALL.mdfile. - Any contribution must be approved via the pull request mechanism.
- More generally, any contribution must follow the conventions and keep the shape of previous contributions.
The complete data of our evaluation is detailed in the /evaluation folder. The subfolders /treemap, /animated-heat-treemap, and /timeline contains input and output files of our approach alongside additional files detailing the systems and the versions targeted.