TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Image-diff – Create an image differential between two images

110 pointsby jsvinealmost 9 years ago

11 comments

f-almost 9 years ago
Not sure I follow - especially if it already depends on IM, how is it different from &#x27;convert -compose difference&#x27; or a similar operator?<p><a href="http:&#x2F;&#x2F;www.imagemagick.org&#x2F;Usage&#x2F;compose&#x2F;#difference" rel="nofollow">http:&#x2F;&#x2F;www.imagemagick.org&#x2F;Usage&#x2F;compose&#x2F;#difference</a>
评论 #12183855 未加载
评论 #12185384 未加载
dahartalmost 9 years ago
This is cool, and a good idea. I will try it out, but I can highly recommend the existing pdiff utility for your image regression testing.<p><a href="http:&#x2F;&#x2F;pdiff.sourceforge.net" rel="nofollow">http:&#x2F;&#x2F;pdiff.sourceforge.net</a><p>Pdiff allows you to specify perceptual thresholds of visibility, so diffs that are not pixel perfect can still pass if they&#x27;re &#x27;good enough&#x27;. Semi-critical if you render the input images using different browsers or at different resolutions, or if your images have any sub-pixel randomness.<p>Lots of people (myself included) have used pdiff successfully in production. It doesn&#x27;t depend on ImageMagick (a bonus in my book). And it&#x27;s already available in lots of Linux distros.
评论 #12185600 未加载
_jomoalmost 9 years ago
ImageMagick already ships the `compare` command [0] which does exactly this.<p>It also accepts a bunch of CLI flags such as -fuzz to consider colors within a certain distance as equal. That flag is very useful when dealing with JPG or similar compression that slightly alters pixels, so you can ignore these barely visible differences and focus on the &#x27;real&#x27; differences.<p>0: <a href="http:&#x2F;&#x2F;www.imagemagick.org&#x2F;script&#x2F;compare.php" rel="nofollow">http:&#x2F;&#x2F;www.imagemagick.org&#x2F;script&#x2F;compare.php</a>
评论 #12186629 未加载
nicolashahnalmost 9 years ago
Interesting, I couldn&#x27;t find a tool like this that would give me a useful % difference between images, so I rolled my own tiny python version using PIL: <a href="https:&#x2F;&#x2F;github.com&#x2F;nicolashahn&#x2F;python-image-diff" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;nicolashahn&#x2F;python-image-diff</a><p>which gives both a diff image and the % difference.
spatulanalmost 9 years ago
Or you can import the two images into graphics software like gimp. Invert the colours in the top image, then knock transparency for that layer down to 50%. If the images are identical, you&#x27;ll just see grey. Any differences will instantly become visible.
评论 #12185735 未加载
silverwindalmost 9 years ago
Pure JS alternative: <a href="https:&#x2F;&#x2F;github.com&#x2F;yahoo&#x2F;blink-diff" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;yahoo&#x2F;blink-diff</a>
0xmohitalmost 9 years ago
Not sure what was the intent behind creating this.<p>Once upon a time (several years back), I worked on one. The intent therein was two compare images produced by different versions of a product. As such, one of the major features was motion detection [0] (apart from computing deltas between the images). We made use of OpenCV [1].<p>[0] <a href="https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Motion_detection" rel="nofollow">https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Motion_detection</a><p>[1] <a href="https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;OpenCV" rel="nofollow">https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;OpenCV</a>
chris_vaalmost 9 years ago
This sort of thing + headless browser makes for nice regression testing.
评论 #12184056 未加载
评论 #12183884 未加载
评论 #12185430 未加载
mrmondoalmost 9 years ago
I hacked up something quickly for a one-off need to render two websites as images and diff them a few years back (warning - I&#x27;m not a developer (clearly)) - <a href="https:&#x2F;&#x2F;github.com&#x2F;sammcj&#x2F;urldiff" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;sammcj&#x2F;urldiff</a>
adnanhalmost 9 years ago
Combine this with my webscrot and diff development vs production websites :-)<p><a href="https:&#x2F;&#x2F;github.com&#x2F;adnanh&#x2F;webscrot" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;adnanh&#x2F;webscrot</a>
ameliusalmost 9 years ago
The diff utility (for text) can detect displacement of fragments of text. Can this image-diff utility do a similar thing for images?