API gratuita de Node.js para comparación de imágenes
API de código abierto basada en Node.js que compara imágenes píxel por píxel. Una solución potente, flexible y eficiente para la comparación de imágenes en aplicaciones Node.js.
La comparación de imágenes desempeña un papel fundamental en el desarrollo de software, en particular en áreas como las pruebas de regresión visual, el control de calidad de las imágenes y la verificación de diseños perfectos en píxeles. Tanto si está desarrollando software para garantizar una apariencia de interfaz de usuario uniforme en varias plataformas como si está automatizando los controles visuales en una cadena de producción, es esencial contar con una herramienta de comparación de imágenes eficaz. LooksSame, una API de código abierto desarrollada por Gemini-Testing, simplifica el proceso de creación de software para la comparación de imágenes con sus funciones intuitivas. Hay varias funciones importantes que forman parte de la biblioteca, como la comparación de imágenes píxel por píxel, la detección de suavizado, el control de tolerancia de configuración, el manejo de las dimensiones de las imágenes, la compatibilidad con promesas y muchas más.
LooksSame es una API basada en Node.js diseñada para la comparación de imágenes. Permite a los desarrolladores comparar imágenes píxel por píxel, con opciones para manejar variaciones menores que pueden producirse debido a las diferencias en los entornos de renderizado. Al utilizar la biblioteca, los desarrolladores de software pueden crear sus propias aplicaciones que detectan diferencias visuales significativas e ignoran las variaciones triviales. La API se centra principalmente en ayudar a los desarrolladores a mantener la coherencia en el diseño de la interfaz de usuario, pero su versatilidad la hace adecuada para muchos otros casos de uso de comparación de imágenes. Con su API sencilla y opciones personalizables, LooksSame es una gran incorporación al conjunto de herramientas de cualquier desarrollador, en particular para pruebas de interfaz de usuario basadas en la web, generación automática de imágenes y otros escenarios en los que la precisión visual es primordial.
Introducción a LooksSame
La forma recomendada de instalar LooksSame es mediante NPM. Utilice el siguiente comando para una instalación sin problemas.
Instalar LooksSame a través de NPM
npm install looks-same
Comparación básica de imágenes en aplicaciones Node.js
La biblioteca de código abierto LooksSame facilita a los desarrolladores de software la realización de comparaciones básicas de imágenes dentro de aplicaciones Node.js. Una vez instalada, puede comparar dos imágenes solicitando el módulo LooksSame en su código. A continuación, se muestra un ejemplo básico que muestra cómo usar la biblioteca para verificar si dos imágenes son visualmente idénticas: En este ejemplo, se compara image1.png e image2.png. Si son visualmente iguales, equal devolverá verdadero; de lo contrario, devolverá falso.
¿Cómo comparar dos imágenes dentro de aplicaciones 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!');
}
});
Comparación de imágenes basada en tolerancia
Para las aplicaciones que no requieren coincidencias perfectas de píxeles, los desarrolladores de software pueden agregar un nivel de tolerancia. Esto permite que se ignoren las pequeñas diferencias entre imágenes, como los cambios debidos a la representación en diferentes navegadores o sistemas operativos. En el siguiente ejemplo de código, la tolerancia se establece en 5 %, lo que significa que las pequeñas variaciones de píxeles (hasta 5 %) no harán que las imágenes se consideren diferentes.
¿Cómo realizar una comparación de imágenes basada en tolerancia dentro de las aplicaciones 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
Resaltar áreas específicas de diferencia
Para aplicaciones más sofisticadas, los desarrolladores de software pueden querer identificar y analizar solo áreas específicas de diferencia. La biblioteca LooksSame proporciona una función de cuadro delimitador que muestra la región exacta donde se producen las diferencias. Esta función genera las coordenadas del cuadro delimitador de las regiones diferentes, lo que facilita el enfoque en partes específicas de la imagen que han cambiado. El siguiente ejemplo muestra cómo usar las coordenadas del cuadro delimitador para comparar imágenes y resaltar las diferencias.
¿Cómo comparar e identificar las diferencias entre áreas específicas de imágenes a través de aplicaciones 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');
Detección de suavizado para comparaciones precisas
La biblioteca de código abierto LooksSame permite a los desarrolladores de software realizar la compresión de imágenes mediante el método de detección de suavizado dentro de las aplicaciones Node.js. El suavizado puede provocar falsos positivos al comparar imágenes, ya que introduce ligeras variaciones en la representación de los bordes. La opción ignoreAntialiasing de la biblioteca ayuda a evitar estos falsos positivos. Esto es especialmente útil para aplicaciones en las que las imágenes pueden representarse de forma diferente en varios dispositivos o navegadores, pero siguen siendo visualmente iguales.
