Are you tired of squinting at plain text Git differentials in your code editor? Say hello to Better Diff Viewer, a VS Code extension that revolutionises the way you interact with Git diffs. Developed by myself (Sam Wang), Better Diff Viewer brings the power of Diff2Html-UI to your fingertips, offering a colourful and intuitive HTML-based diff viewing experience right within Visual Studio Code.

What is Better Diff Viewer?

Better Diff Viewer enhances your Git diff viewing process by presenting changes in a visually appealing HTML format. Whether you’re inspecting changes between commits, exploring uncommitted modifications, or comparing different branches, Better Diff Viewer makes the process seamless and enjoyable. View the project on Github – https://github.com/liveinaus/vscode-diff-viewer

Features at a Glance

  • Rich HTML Diff View: Enjoy a colourful HTML-based diff view powered by Diff2Html-UI, making it easier to understand and navigate code changes.
  • Dark/Light Mode Support: Seamlessly switch between dark and light themes to suit your coding environment.
  • Customisable Settings: Tailor the extension to your preferences with customisable settings, including auto-refresh toggles, button display options, custom CSS styling, and more.
  • Convenient Commands: Access a range of commands directly from the toolbar, allowing you to view diffs, revert changes, open files, and execute custom Git commands effortlessly.
  • Hunk Actions: Granular control over changes with support for reverting selected hunks of code.

Screenshots

Dark Mode (v0.0.8)

Better Diff Viewer screenshot - dark

Light Mode (v0.0.1)

Better Diff Viewer screenshot - light

Commands and Settings

Better Diff Viewer offers a comprehensive set of commands and customisable settings to streamline your workflow:

  • Commands: From viewing diffs to executing custom Git commands, Better Diff Viewer provides a command for every aspect of your diff management.
  • Settings: Fine-tune your diff viewing experience with settings to control auto-refresh behaviour, button display preferences, custom CSS styling, and more.

Installation

Getting started with Better Diff Viewer is a breeze:

  1. Install the extension from the Visual Studio Marketplace.
  2. Configure the settings to your liking.
  3. Enjoy a superior Git diff viewing experience in VS Code!

Acknowledgments

Better Diff Viewer owes its functionality to Diff2Html, a powerful library for rendering Git diffs in HTML format. We extend our gratitude to the creators and contributors of Diff2Html for their invaluable work.

About the Author

Better Diff Viewer is developed and maintained by myself (Sam Wang), a passionate software developer dedicated to enhancing the developer experience. Connect with Sam on liveinaus.com to learn more about his projects and contributions to the developer community.

License

Better Diff Viewer is licensed under the GNU General Public License v3.0, ensuring that it remains open and accessible to all developers.

Try Better Diff Viewer Today!

Transform your Git diff viewing experience with Better Diff Viewer. Install the extension from the Visual Studio Marketplace and take your code review process to the next level. Happy coding!