Options
2025
Bachelor Thesis
Title
Diagnostics Visualizer: Source Code Line Visualization integrated into an IDE
Abstract
Contemporary software development encounters major obstacles in handling code diagnostics throughout more complicated projects, where quickly identifying and resolving vulnerabilities has become vital for ensuring software security. Present static analysis tools, although able to identify problems, frequently engulf developers with disorganized data and necessitate context switching across various interfaces, diminishing their efficiency in everyday development processes. This thesis introduces the Diagnostics Visualizer, a Visual Studio Code extension designed to incorporate diagnostic visualization into the development environment to overcome these limitations. The extension features an innovative dual-view architecture that merges real-time code highlighting with an interactive visualization webview panel, allowing developers to grasp both the seriousness and connections of code problems throughout associated files. The tool presents diagnostic summaries with visual displays of file dependencies and problem distributions, removing the necessity for context switching while ensuring a clear understanding of code health. User assessments showed that the extension effectively enhances diagnostic understanding and navigation efficiency. Testing with developers of different experience levels revealed that it enhances the ability to detect vulnerabilities and efficiency of navigating associated files. The extension’s intuitive interface and smooth integration with current workflows accumulated number of positive responses, as most users showed interest in frequent use. This research adds to the area of software visualization by illustrating how combined visual representations can improve code maintenance processes and lower cognitive demand. The implementation also establishes a basis for upcoming studies in IDE-integrated diagnostic visualization tools, especially concerning complex dependency visualization and immediate diagnostic feedback.
;
Die moderne Softwareentwicklung steht vor großen Herausforderungen bei der Handhabung von Code-Diagnostiken in zunehmend komplexen Projekten, wobei die schnelle Identifizierung und Behebung von Schwachstellen für die Gewährleistung der Softwaresicherheit entscheidend geworden ist. Gegenwärtige
statische Analyse-Tools können zwar Probleme erkennen, überfordern jedoch häufig Entwickler mit unorganisierten Daten und erfordern Kontextwechsel zwischen verschiedenen Schnittstellen, was ihre Effizienz in alltäglichen Entwicklungsprozessen mindert. Diese Arbeit stellt den Diagnostics Visualizer vor, eine Visual Studio Code-Erweiterung, die entwickelt wurde, um Diagnosevisualisierung in die Entwicklungsumgebung zu integrieren und diese Einschränkungen zu überwinden. Die Erweiterung verfügt über eine innovative Zwei-Ansicht-Architektur, die Echtzeit-Code-Hervorhebung mit einem interaktiven Visualisierungs-Webview-Panel verbindet und es Entwicklern ermöglicht, sowohl den Schweregrad als auch die Zusammenhänge von Code-Problemen in verbundenen Dateien zu erfassen. Das Tool präsentiert Diagnosezusammenfassungen mit visuellen Darstellungen von Dateiabhängigkeiten und Problemverteilungen, wodurch die Notwendigkeit von Kontextwechseln entfällt und gleichzeitig ein klares Verständnis der Code-Gesundheit gewährleistet wird. Benutzerbewertungen zeigten, dass die Erweiterung das Diagnoseverständnis und die Navigationseffizienz effektiv verbessert. Tests mit Entwicklern unterschiedlicher Erfahrungsstufen ergaben, dass sie die Fähigkeit zur Erkennung von Schwachstellen und die Effizienz bei der Navigation verbundener Dateien verbessert. Die intuitive Benutzeroberfläche und die reibungslose Integration in bestehende Arbeitsabläufe erhielten zahlreiche positive Rückmeldungen, da die meisten Benutzer Interesse an häufiger Nutzung zeigten. Diese Forschung trägt zum Bereich der Softwarevisualisierung bei, indem sie zeigt, wie kombinierte visuelle Darstellungen Code-Wartungsprozesse verbessern und die kognitive Belastung reduzieren können. Die Implementierung schafft auch eine Grundlage für künftige Studien zu IDE-integrierten Diagnosevisualisierungstools, insbesondere im Hinblick auf komplexe Abhängigkeitsvisualisierung und sofortiges Diagnosefeedback.
statische Analyse-Tools können zwar Probleme erkennen, überfordern jedoch häufig Entwickler mit unorganisierten Daten und erfordern Kontextwechsel zwischen verschiedenen Schnittstellen, was ihre Effizienz in alltäglichen Entwicklungsprozessen mindert. Diese Arbeit stellt den Diagnostics Visualizer vor, eine Visual Studio Code-Erweiterung, die entwickelt wurde, um Diagnosevisualisierung in die Entwicklungsumgebung zu integrieren und diese Einschränkungen zu überwinden. Die Erweiterung verfügt über eine innovative Zwei-Ansicht-Architektur, die Echtzeit-Code-Hervorhebung mit einem interaktiven Visualisierungs-Webview-Panel verbindet und es Entwicklern ermöglicht, sowohl den Schweregrad als auch die Zusammenhänge von Code-Problemen in verbundenen Dateien zu erfassen. Das Tool präsentiert Diagnosezusammenfassungen mit visuellen Darstellungen von Dateiabhängigkeiten und Problemverteilungen, wodurch die Notwendigkeit von Kontextwechseln entfällt und gleichzeitig ein klares Verständnis der Code-Gesundheit gewährleistet wird. Benutzerbewertungen zeigten, dass die Erweiterung das Diagnoseverständnis und die Navigationseffizienz effektiv verbessert. Tests mit Entwicklern unterschiedlicher Erfahrungsstufen ergaben, dass sie die Fähigkeit zur Erkennung von Schwachstellen und die Effizienz bei der Navigation verbundener Dateien verbessert. Die intuitive Benutzeroberfläche und die reibungslose Integration in bestehende Arbeitsabläufe erhielten zahlreiche positive Rückmeldungen, da die meisten Benutzer Interesse an häufiger Nutzung zeigten. Diese Forschung trägt zum Bereich der Softwarevisualisierung bei, indem sie zeigt, wie kombinierte visuelle Darstellungen Code-Wartungsprozesse verbessern und die kognitive Belastung reduzieren können. Die Implementierung schafft auch eine Grundlage für künftige Studien zu IDE-integrierten Diagnosevisualisierungstools, insbesondere im Hinblick auf komplexe Abhängigkeitsvisualisierung und sofortiges Diagnosefeedback.
Thesis Note
Darmstadt, TU, Bachelor Thesis, 2025