DevScope

A Visual Studio Code extension that analyzes folder structure and language usage with interactive D3.js bubble chart visualizations.

Features

• Language Usage Analysis: Recursively scans files and generates a summary of languages by file extensions
• Project Structure Analysis: Traverses directories and provides insights into folder sizes and file counts
• Interactive Visualizations: Beautiful bubble charts powered by D3.js
• Responsive Design: Works seamlessly with VS Code's dark and light themes
• Real-time Tooltips: Hover over bubbles to see detailed file counts and sizes

Installation

From VS Code Marketplace

1. Open Visual Studio Code
2. Press Ctrl+Shift+X (Windows/Linux) or Cmd+Shift+X (Mac) to open Extensions
3. Search for "DevScope"
4. Click Install
5. Reload VS Code if prompted

From VSIX File

1. Open Visual Studio Code
2. Go to Extensions → Click ... (three dots) → Install from VSIX...
3. Select your .vsix file
4. Reload VS Code if prompted

Usage

1. Open Command Palette: Ctrl+Shift+P (Windows/Linux) or Cmd+Shift+P (Mac)
2. Type: DevScope: Analyze Workspace
3. Select a folder to analyze
4. Wait for analysis to complete
5. View results in the DevScope Analysis panel

Interacting with Visualizations

• Hover over bubbles to see tooltips with file counts and sizes
• Bubble size represents total bytes for that language or folder
• Charts automatically adapt to VS Code's theme

Requirements

• VS Code 1.106.0 or higher

License

MIT License - see LICENSE file for details