CodeSkyline - Visualize your repository

This extension adds a visualization of your source code files. It allows developers to discover code, gain insight into developer activities, compare versions and navigate a large code base.

Features

• Interactive visualization of the source code files in the current workspace.
• Works in any language when the language server (LSP) is installed.
• The visualization includes filtering, tooltips, full-text search and more.
• Multiple color scales to highlight and inspect different aspects of your code. For example, view the code age, showing the last time each source code line has been changed.
• A tree visualization that acts as explorer to view and explore subfolders.
• A visualization that shows connections between files, or file couplings by analysing the import and export statements in your files.
• A bar chart that shows the file importance, calculated by PageRank algorithm according to the file connections.
• Hold CTRL to view code details when hovering a file.

Installation

1. Recieve the extension as .vsix file.
2. Open VS Code, open the extensions tab (CTRL+SHIFT+X)
3. Click on the three dots (...) -> Install from VSIX -> Install
4. At the bottom bar click "Code Skyline" button

Or try the VS Code command palette with Ctrl+Shift+P and run the command CodeSkyline: Show Visualization.

Commands

This extension provides two commands:

• CodeSkyline: Open Visualization - Open the visualization webview.
• CodeSkyline: Delete Cached Data - This deletes all cached data in case of an error. The next startup will take longer.

It also adds context menu items to the explorer when right-clicking a folder:

• Open in CodeSkyline - Opens the visualization and only shows the current selected folder.

Configuration

• codeSkyline.maxFileSizeKb - Maximum file size that will be shown, in KB. (default is 1024)
• codeSkyline.ignoredFiles - List of default filtered files and folders. (default is package-lock.json, yarn.lock, node_modules, dist, build, out, .next, bun.lock and more)
• codeSkyline.applyGitIgnore - If it should uses the root level .gitignore to filter files. (default is true)

Requirements

This extension requires vscode version 1.103.0 or higher.

Privacy

This extension currently does use telemetry. All computations are fully offline. The data is collected from the local repository and calculated with language servers and git.

License

Fraunhofer Institute for Computer Graphics Research (IGD) Competence Center for Information Visualization and Visual Analytics

Copyright (c) 2025 Fraunhofer IGD. All rights reserved.

This source code is property of the Fraunhofer IGD and underlies copyright restrictions. It may only be used with explicit permission from the respective owner.

Acknowledgements

This research work has been funded by the German Federal Ministry of Education and Research and the Hessian Ministry of Higher Education, Research, Science and the Arts within their joint support of the National Research Center for Applied Cybersecurity ATHENE.