Gratis Node.js API voor beeldvergelijking
Open Source Node.js-gebaseerde API die afbeeldingen pixel voor pixel vergelijkt. Een krachtige, flexibele en efficiënte oplossing voor het vergelijken van afbeeldingen in Node.js-toepassingen.
Afbeeldingsvergelijking speelt een cruciale rol in softwareontwikkeling, met name op gebieden zoals visuele regressietesten, beeldkwaliteitsborging en pixel-perfecte ontwerpverificatie. Of u nu software ontwikkelt om een consistente UI-uitstraling op meerdere platforms te garanderen of visuele controles in een productiepijplijn automatiseert, een efficiënte tool voor beeldvergelijking is essentieel. LooksSame, een open-source API ontwikkeld door Gemini-Testing, vereenvoudigt het proces van het maken van software voor beeldvergelijking met zijn intuïtieve functies. Er zijn verschillende belangrijke functies onderdeel van de bibliotheek, zoals pixel-voor-pixel beeldvergelijking, anti-aliasingdetectie, configuratietolerantiecontrole, verwerking van beeldafmetingen, ondersteuning voor Promises en nog veel meer.
LooksSame is een op Node.js gebaseerde API die is ontworpen voor beeldvergelijking. Het stelt ontwikkelaars in staat om afbeeldingen pixel voor pixel te vergelijken, met opties om kleine variaties te verwerken die kunnen optreden als gevolg van verschillen in renderingomgevingen. Door gebruik te maken van de bibliotheek kunnen softwareontwikkelaars hun eigen applicaties bouwen die significante visuele verschillen detecteren en triviale variaties negeren. De API is primair gericht op het helpen van ontwikkelaars om consistentie in UI-ontwerp te behouden, maar de veelzijdigheid maakt het geschikt voor veel andere use cases voor beeldvergelijking. Met zijn eenvoudige API en aanpasbare opties is LooksSame een geweldige aanvulling op de toolkit van elke ontwikkelaar, met name voor webgebaseerde UI-tests, geautomatiseerde beeldgeneratie en andere scenario's waarbij visuele nauwkeurigheid van het grootste belang is.
Aan de slag met LooksSame
De aanbevolen manier om LooksSame te installeren is met NPM. Gebruik de volgende opdracht voor een soepele installatie.
LooksSame installeren via NPM
npm install looks-same
Basisvergelijking van afbeeldingen in Node.js-apps
De open source LooksSame-bibliotheek maakt het voor softwareontwikkelaars eenvoudig om basisvergelijkingen van afbeeldingen uit te voeren in Node.js-applicaties. Na installatie kunt u twee afbeeldingen vergelijken door de LooksSame-module in uw code te vereisen. Hier is een basisvoorbeeld dat laat zien hoe u de bibliotheek kunt gebruiken om te controleren of twee afbeeldingen visueel identiek zijn: In dit voorbeeld worden image1.png en image2.png vergeleken. Als ze visueel hetzelfde zijn, retourneert equal true; anders retourneert het false.
Hoe vergelijk ik twee afbeeldingen in Node.js-apps?
const looksSame = require('looks-same');
// Compare two images
looksSame('image1.png', 'image2.png', (error, { equal }) => {
if (error) {
console.error('Error comparing images:', error);
} else if (equal) {
console.log('Images are identical!');
} else {
console.log('Images differ!');
}
});
Tolerantiegebaseerde afbeeldingsvergelijking
Voor toepassingen die geen pixel-perfecte matches vereisen, kunnen softwareontwikkelaars een tolerantieniveau toevoegen. Hierdoor kunnen kleine verschillen tussen afbeeldingen, zoals wijzigingen door rendering op verschillende browsers of besturingssystemen, worden genegeerd. In het volgende codevoorbeeld is de tolerantie ingesteld op 5%, wat betekent dat kleine pixelvariaties (tot 5%) er niet voor zorgen dat de afbeeldingen als verschillend worden beschouwd.
Hoe voer je een tolerantiegebaseerde afbeeldingsvergelijking uit in Node.js-apps?
cfunction compareWithTolerance(image1, image2, toleranceLevel) {
looksSame(image1, image2, { tolerance: toleranceLevel }, (error, { equal }) => {
if (error) {
console.error('Error comparing images:', error);
} else if (equal) {
console.log('Images are visually identical within tolerance!');
} else {
console.log('Images differ!');
}
});
}
// Usage
compareWithTolerance('image1.png', 'image2.png', 5); // 5% tolerance
Specifieke gebieden van verschil markeren
Voor geavanceerdere toepassingen willen softwareontwikkelaars mogelijk alleen specifieke gebieden van verschil identificeren en analyseren. De LooksSame-bibliotheek biedt een bounding box-functie die de exacte regio laat zien waar verschillen voorkomen. Deze functie geeft de bounding box-coördinaten van de verschillende regio's weer, waardoor het gemakkelijker wordt om te focussen op specifieke delen van de afbeelding die zijn gewijzigd. Het volgende voorbeeld laat zien hoe u bounding box-coördinaten kunt gebruiken om afbeeldingen te vergelijken en de verschillen te markeren.
Hoe identificeer ik de verschillen tussen specifieke gebieden van afbeeldingen via Node.js-apps?
function compareWithDiffBounds(image1, image2) {
looksSame(image1, image2, (error, { diffBounds }) => {
if (error) {
console.error('Error comparing images:', error);
} else {
console.log('Bounding box of differences:', diffBounds);
}
});
}
// Usage
compareWithDiffBounds('image1.png', 'image2.png');
Anti-aliasingdetectie voor nauwkeurige vergelijkingen
De open source LooksSame-bibliotheek stelt softwareontwikkelaars in staat om afbeeldingen te comprimeren met behulp van de Anti-aliasingdetectiemethode in Node.js-toepassingen. Anti-aliasing kan leiden tot valse positieven bij het vergelijken van afbeeldingen, omdat het kleine variaties in randweergave introduceert. De ignoreAntialiasing-optie van de bibliotheek helpt deze valse positieven te voorkomen. Dit is vooral handig voor toepassingen waarbij afbeeldingen op verschillende apparaten of browsers anders kunnen worden weergegeven, maar visueel nog steeds hetzelfde zijn.
