We have just released version 0.8.5 of SemanticDiff - our Visual Studio Code extension and GitHub App. This update improves several areas of our programming language aware diff, from the core algorithms to the user interface. Notable differences include the addition of a minimap, better move detection as well as an improved visualization of moves and support for GitHub comments.
If you are using the GitHub App, all updates have already been rolled out and no action is required on your part. VS Code users will usually receive the update automatically when the editor checks for extension updates. If not, you can get the latest packages from the Visual Studio Marketplace:
The most obvious change in this release is the addition of a minimap. It is displayed next to the scrollbar and gives you an overview of all added and deleted code within the diff:
The minimap works very similar to the one implemented by VS Code, showing all removed code in red on the left side and all additions in green on the right side (colors vary depending on your theme). Other colors are used to highlight moved code blocks. Instead of using red and green, moves use the color assigned to that move on both sides. This makes it easy to see directly in the minimap how much code has been moved and where the source and target are located. The color is the same as the one used as a border around the source and target:
Line Indicator For Moved Code
With the addition of the minimap, we also changed how moved code blocks are displayed. Previously, we used a colored line on top of the middle bar to connect the source and target of a move. In practice this solution had some drawbacks. If a file contained many moves over large distances, the middle bar could turn into a rainbow and hide the actual change indicators.
Since the minimap does a much better job of showing where the source and destination of a move are, we modified this system a bit. The full line is now only shown when the distance between the original and new code is rather small. Otherwise, the line is replaced by a shortened dotted line. This still shows the direction of the move, but does not crowd the middle bar over longer distances:
As before, you can jump directly to the source or destination of a move by hovering over the block and clicking the arrow in the upper right corner:
Comparing Changes Inside Moved Code
SemanticDiff not only detects moved code blocks, it can also display how the moved code has been modified. To visualize the changes, we used to display a copy of the old code next to the target of the move, including indicators for additions and deletions. While this allows for a quick comparison, it has the potential to mislead new users into thinking there is code in the old version where there is none.
To make this clearer, we have changed the default way of showing moved code blocks. When you open a diff with SemanticDiff 0.8.5, the source of the move is simply shown as one large deletion and the target as one large addition. Above the target, you will now find a text button labeled
Compare With Original:
If you click it, the view switches to the old behavior to let you compare the changes:
In case the moves contain no changes, the text instead reads
Moved without changes in italics and is not clickable:
If you prefer the old behavior with comparison mode enabled by default, you can achieve this by opening the preferences in VS Code and changing the
semanticdiff.diff.compareMovedCode option. There is currently no way to change this setting for the GitHub app.
Improved Matching and Move Detection
In addition to all the UI/UX changes, this release brings many improvements under the hood. SemanticDiff now takes more information into account when matching the old and new code. This results in more lines showing up as modified instead of additions/deletions. The detection of moved code blocks has been further refined so that SemanticDiff 0.8.5 detects more moved code blocks. At the same time we have reduced the average computation time by about 20%.
We have added support for viewing review comments in our GitHub App. When you open a pull request with app.semanticdiff.com, you will see all the code comments that have been added to the PR through the GitHub interface:
There are some limitations at the moment. You can’t edit or add new comments through our App and you can’t see if a comment has already been marked as resolved. This will be added in future versions of SemanticDiff for those repos that have the GitHub App enabled.
We would also like to add this feature to our VS Code extension, but unfortunately the VS Code API lacks the ability to query the comments added by other extensions.
We hope you enjoyed this update. If you encounter any issues, please let us know in our issue tracker.