API Node.js gratuita per il confronto delle immagini
API open source basata su Node.js che confronta le immagini pixel per pixel. Una soluzione potente, flessibile ed efficiente per il confronto delle immagini nelle applicazioni Node.js.
Il confronto delle immagini svolge un ruolo fondamentale nello sviluppo del software, in particolare in aree quali test di regressione visiva, garanzia della qualità delle immagini e verifica del design pixel-perfect. Che tu stia sviluppando software per garantire un aspetto UI coerente su più piattaforme o automatizzando i controlli visivi in una pipeline di produzione, avere uno strumento di confronto delle immagini efficiente è essenziale. LooksSame, un'API open source sviluppata da Gemini-Testing, semplifica il processo di creazione di software per il confronto delle immagini con le sue funzionalità intuitive. Ci sono diverse funzionalità importanti nella libreria come il confronto delle immagini pixel per pixel, rilevamento anti-aliasing, configurazione del controllo della tolleranza, gestione delle dimensioni delle immagini, supporto per Promises e molto altro.
LooksSame è un'API basata su Node.js progettata per il confronto delle immagini. Consente agli sviluppatori di confrontare le immagini pixel per pixel, con opzioni per gestire piccole variazioni che possono verificarsi a causa di differenze negli ambienti di rendering. Utilizzando la libreria, gli sviluppatori di software possono creare le proprie applicazioni che rilevano differenze visive significative ignorando le variazioni banali. L'API è principalmente focalizzata sull'aiutare gli sviluppatori a mantenere la coerenza nel design dell'interfaccia utente, ma la sua versatilità la rende adatta a molti altri casi d'uso di confronto di immagini. Con la sua API semplice e le opzioni personalizzabili, LooksSame è un'ottima aggiunta al toolkit di qualsiasi sviluppatore, in particolare per i test dell'interfaccia utente basati sul Web, la generazione automatica di immagini e altri scenari in cui la precisione visiva è fondamentale.
Indipendenza dalla piattaforma
LooksSame può essere utilizzato in più ambienti come Node o browser ecc.
Installa LooksSame tramite NPM
npm install looks-same
Confronto di immagini di base nelle app Node.js
La libreria open source LooksSame semplifica per gli sviluppatori software l'esecuzione di un confronto di immagini di base all'interno delle applicazioni Node.js. Una volta installata, puoi confrontare due immagini richiedendo il modulo LooksSame nel tuo codice. Ecco un esempio di base che mostra come utilizzare la libreria per verificare se due immagini sono visivamente identiche: in questo esempio, confronta image1.png e image2.png. Se sono visivamente uguali, equal restituirà true; in caso contrario, restituirà false.
Come confrontare due immagini all'interno delle app Node.js?
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!');
}
});
Confronto immagini basato sulla tolleranza
Per le applicazioni che non richiedono corrispondenze pixel-perfect, gli sviluppatori software possono aggiungere un livello di tolleranza. Ciò consente di ignorare piccole differenze tra le immagini, come modifiche dovute al rendering su browser o sistemi operativi diversi. Nel seguente esempio di codice, la tolleranza è impostata al 5%, il che significa che piccole variazioni di pixel (fino al 5%) non faranno sì che le immagini vengano considerate diverse.
Come eseguire il confronto delle immagini basato sulla tolleranza all'interno delle app Node.js?
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
Evidenziazione di aree specifiche di differenza
Per applicazioni più sofisticate, gli sviluppatori software potrebbero voler identificare e analizzare solo aree specifiche di differenza. La libreria LooksSame fornisce una funzionalità di bounding box che mostra la regione esatta in cui si verificano le differenze. Questa funzione restituisce le coordinate del bounding box delle regioni diverse, facilitando la messa a fuoco su parti specifiche dell'immagine che sono cambiate. L'esempio seguente mostra come utilizzare le coordinate del bounding box per confrontare le immagini ed evidenziare le differenze.
Come confrontare e identificare le differenze tra aree specifiche delle immagini tramite le app Node.js?
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');
Rilevamento anti-aliasing per confronti accurati
La libreria open source LooksSame consente agli sviluppatori software di eseguire la compressione delle immagini utilizzando il metodo di rilevamento anti-aliasing all'interno delle applicazioni Node.js. L'anti-aliasing può causare falsi positivi quando si confrontano le immagini, poiché introduce leggere variazioni nel rendering dei bordi. L'opzione ignoreAntialiasing della libreria aiuta a evitare questi falsi positivi. Ciò è particolarmente utile per le applicazioni in cui le immagini possono essere renderizzate in modo diverso su vari dispositivi o browser, ma sono comunque visivamente le stesse.
