A Visual Studio Code extension designed to enhance the experience of reading code by providing a comprehensive history of code navigation and a tree structure of calling hierarchies.
When exploring a new codebase, developers typically need to understand the overall architecture. This process usually involves:
- Locating feature entry points to begin code exploration
- Navigating through calling hierarchies to comprehend implementations
Common challenges during this process include:
- Difficulty tracking previously visited locations, especially with deep calling hierarchies and scattered entry points
- Challenges in grasping the codebase's big picture during initial exploration
- Identifying interesting or complex code sections while reading the code
Thus, this extension is designed to help developers to:
- Record the history of code navigation, and organize the history as a tree reflecting the calling hierarchy of each symbol
- Focus on most important symbols, which could be chosen by visit count or manually pinned
- 📍 Maintains a comprehensive history of code navigation
- 🌳 Record the calling hierarchy of each symbol in a tree structure
- 📊 Tracks symbol visit frequency, highlighting frequently accessed ones
- 📋 Enables sorting by visit count or chronological order
- 📌 Allows pinning of important symbols for focused attention
Calling Hierarchy Visualization
- Open the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of the window
- Search for "Navigation History" in the search bar.
- Click on the "Install" button.
- Once installed, you can activate the extension by clicking on the "Enable" button.
- Clone the repository
- Run
npm installto install the dependencies - Run
npm run compileto compile the extension - Run
npm run packageto package the extension - Run
code --install-extension ./navigation-history-1.0.1.vsixto install the extension
I've found that while "Open Editors" is great for managing files, it's not really designed for helping us understand code. In my experience, I end up using the file palette more often when I need to navigate between files.
Code Navigation Stack Extension 🔍
I like this extension for following a single call path, but I've noticed it struggles when I switch between different areas of code. It gets particularly tricky when I'm jumping between classes in the same file or methods within a class.
We all know this one - it shows us the symbols in our current file and updates when we switch files. I find it works best when I already know my way around the codebase.
CodeMap Extension 🗺️
I appreciate how this extension gives us a clean view of classes and functions, and I love that we can customize how it parses symbols. But similar to the Outline view, I've found it's most helpful once I'm familiar with the code I'm working with.
I'm happy to report everything's working great so far! But if you run into any problems, I'd really appreciate it if you could let me know by opening an issue on our GitHub repository.
For detailed updates and changes, please refer to CHANGELOG.md.
This extension is distributed under the MIT License.
Happy Code Reading! 🚀✨