Since the launch of our SemanticDiff extension for Visual Studio Code, our goal has been to help developers understand code changes faster through our language-aware diff. All the positive feedback we have received seems to indicate that we are moving in the right direction.
However, we know that relying solely on a VS Code extension may not cover all aspects of working with diffs. Therefore, we are excited to announce that we’ve taken the first step in making SemanticDiff available outside of VS Code. Allow me to introduce you to the SemanticDiff Pull Request Viewer:
The SemanticDiff Pull Request Viewer does pretty much what the name implies. It allows you to view public pull requests hosted on GitHub with our diff. The viewer is based on our VS Code extension, so you get all the features you are already used to (style-only changes are hidden, moved code is detected, …) directly in your browser. We hope this makes your reviews easier and helps developers who do not use VS Code.
Get Started
To give it a try click on the following button or open https://app.semanticdiff.com in your browser.
This opens a “search engine”-like page where you just enter the URL of a public GitHub pull request (or commit) and click Go.
How It Differs From GitHub
We took inspiration from GitHub’s interface design to make it as easy as possible to get started. For instance, the header shows the same pull request information as the native interface and the sidebar contains a similar file list. However, we have added a few notable enhancements to make working with larger pull requests easier. The sidebar now provides a direct view of the commit list, with the currently selected commit highlighted to give you a better overview. Additionally, we display the changes for each file individually to not overwhelm you with a large diff.
Note: On small screens, you may need to expand the sidebar first by clicking the icon or by swiping right on touchscreens.
The most important difference to GitHub is not any of these minor interface tweaks, but the way the diff works. A semantic diff analyzes the code and can decide between irrelevant changes, like an optional comma or whitespace, and relevant changes. By hiding modifications that do not affect the program execution, we can display a more compact diff that puts more focus on the logic changes. The exact list of style-only changes we ignore depends on the programming language but usually includes things like adding/removing unnecessary parentheses, optional commas, etc.
While hiding irrelevant changes is a big part of SemanticDiff, there are a few differences that are a little easier to see. If you haven’t used our Visual Studio Code extension yet, you will discover some new visual indicators. Let me give you an overview of the three most important ones:
This should cover everything you need to know to use our pull request viewer. If you have any further questions, feel free to start a discussion.
Future Development
If you like our pull request viewer, you can make it a part of your development process by installing our GitHub App. It will add a comment with the corresponding SemanticDiff URL below each new pull request. Currently, it doesn’t offer any review features such as viewing or adding comments, and it only works with public pull requests. We plan to remove these limitations and provide an OAuth2 based authentication flow that lets users perform their full review within the pull request viewer. Meanwhile you can help us improve the app by reporting any bugs or feature requests you have in our issue tracker.
Just to avoid confusion: We will also continue to develop our Visual Studio Code Extension and already have some exciting features planned. Since both implementations share the most of the code, these features will be available in both versions.
