We are thrilled to announce the launch of Percy Visual Engine. The engine is an upgrade of Percy’s existing diffing algorithm. It uses computer vision and machine learning for visual diffs on the Percy platform. As a result, image comparisons on Percy are now faster and more accurate than ever.
The features and capabilities that the Percy Visual Engine unlocks are:
Page Shift Detection
Percy now highlights the exact pixels that cause the page shift instead of marking all of the page's contents as a diff. Our goal with Percy Visual Engine was to significantly reduce noise and highlight only the most important changes and you can see the change in the image below.
On this page, some content has been rearranged in a few sections of the page. However, the rest of the page remains the same. This could have resulted in a noisy diff, but not anymore. With the updates in Percy Visual Engine, we no longer see the whole page shown as a diff. Instead, we only see the exact areas that changed. The new Percy Visual Engine cleans up vertical content shifts and shows you only the diffs you care about.
Diff Highlighter
When making changes on a webpage, some changes can be quite small and hard to identify with the naked eye. To solve this, we have introduced the Diff highlighter which highlights the exact position of any diffs so you can get to what's important faster.
Here we can see a very long page, but only a small part of one icon has been changed. The Diff highlighter allows you to quickly find the diff in your snapshot so you can be on your way faster.
Handling Anti-Aliasing noise
The new Percy Visual Engine uses computer vision to analyze each pixel, thereby eliminating the false positives due to anti-aliasing. With so many browsers offered for rendering, it becomes important to compensate for variations between machines, chip architectures, and GPU non-determinism. Here we can see a difference in anti-aliasing between two different renders in our infrastructure. With Percy Visual Engine, we are able to detect these differences and remove them in your final diff so you can review only the important changes.
Intelligent Text Stabilization
With the new Percy Visual Engine, we have eliminated false positives caused by minor character shifts during rendering. Here are two images that look the same. It turns out that the positions of the text in this image have changed slightly between renders, but not due to code changes. With Percy Visual Engine, we detect and filter out this type of noise in your snapshots so you can ship your software faster.
Speed
Experience the all-new diffing algorithm that does way more processing per screenshot but still manages to be over 1.5X faster than before!
We hope you enjoyed this quick look into some of the exciting features of Percy Visual Engine. For more updates, follow Percy on Twitter.