Görüntü Karşılaştırması için Ücretsiz Node.js API'si
Görüntüleri Piksel Piksel Karşılaştıran Açık Kaynaklı Node.js Tabanlı API. Node.js Uygulamalarında Görüntü Karşılaştırması İçin Güçlü, Esnek ve Verimli Bir Çözüm.
Görüntü karşılaştırması, özellikle görsel regresyon testi, görüntü kalitesi güvencesi ve piksel mükemmelliğinde tasarım doğrulaması gibi alanlarda yazılım geliştirmede hayati bir rol oynar. Birden fazla platformda tutarlı kullanıcı arayüzü görünümü sağlamak için yazılım geliştiriyor veya bir üretim hattında görsel kontrolleri otomatikleştiriyor olun, etkili bir görüntü karşılaştırma aracına sahip olmak esastır. Gemini-Testing tarafından geliştirilen açık kaynaklı bir API olan LooksSame, sezgisel özellikleriyle görüntü karşılaştırması için yazılım oluşturma sürecini basitleştirir. Piksel piksel görüntü karşılaştırması, kenar yumuşatma algılama, tolerans denetimi yapılandırma, görüntü boyutlarını işleme, Promises desteği ve daha fazlası gibi kütüphanenin bir parçası olan birkaç önemli özellik vardır.
LooksSame, görüntü karşılaştırması için tasarlanmış Node.js tabanlı bir API'dir. Geliştiricilerin görüntüleri piksel piksel karşılaştırmasına olanak tanır ve işleme ortamlarındaki farklılıklar nedeniyle oluşabilecek küçük değişiklikleri işleme seçenekleri sunar. Yazılım geliştiricileri, kütüphaneyi kullanarak önemsiz değişiklikleri görmezden gelirken önemli görsel farklılıkları algılayan kendi uygulamalarını oluşturabilirler. API, öncelikle geliştiricilerin kullanıcı arayüzü tasarımında tutarlılığı sürdürmesine yardımcı olmaya odaklanmıştır, ancak çok yönlülüğü onu birçok başka görüntü karşılaştırma kullanım durumu için uygun hale getirir. Basit API'si ve özelleştirilebilir seçenekleriyle LooksSame, özellikle web tabanlı kullanıcı arayüzü testi, otomatik görüntü oluşturma ve görsel doğruluğun en önemli olduğu diğer senaryolar için her geliştiricinin araç setine harika bir ektir.
LooksSame ile Başlarken
LooksSame'i kurmanın önerilen yolu NPM kullanmaktır. Sorunsuz bir kurulum için lütfen aşağıdaki komutu kullanın.
NPM aracılığıyla LooksSame'i yükleyin
npm install looks-same
Node.js Uygulamalarında Temel Görüntü Karşılaştırması
Açık kaynaklı LooksSame kütüphanesi, yazılım geliştiricilerinin Node.js uygulamaları içinde temel görüntü karşılaştırması yapmasını kolaylaştırır. Kurulduktan sonra, kodunuzda LooksSame modülünü gerektirerek iki görüntüyü karşılaştırabilirsiniz. İşte kütüphanenin iki görüntünün görsel olarak aynı olup olmadığını kontrol etmek için nasıl kullanılacağını gösteren temel bir örnek: Bu örnekte, image1.png ve image2.png'yi karşılaştırır. Görsel olarak aynıysa, equal true döndürür; aksi takdirde false döndürür.
Node.js Uygulamaları İçinde İki Görüntü Nasıl Karşılaştırılır?
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!');
}
});
Tolerans Tabanlı Görüntü Karşılaştırması
Piksel mükemmelliği gerektirmeyen uygulamalar için yazılım geliştiricileri bir tolerans düzeyi ekleyebilir. Bu, farklı tarayıcılarda veya işletim sistemlerinde işleme nedeniyle oluşan değişiklikler gibi görüntüler arasındaki küçük farklılıkların göz ardı edilmesini sağlar. Aşağıdaki kod örneğinde, tolerans %5 olarak ayarlanmıştır; bu da küçük piksel farklılıklarının (%5'e kadar) görüntülerin farklı olarak değerlendirilmesine neden olmayacağı anlamına gelir.
Node.js Uygulamaları İçinde Tolerans Tabanlı Görüntü Karşılaştırması Nasıl Yapılır?
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
Belirli Fark Alanlarını Vurgulama
Daha karmaşık uygulamalar için, yazılım geliştiriciler yalnızca belirli fark alanlarını belirlemek ve analiz etmek isteyebilir. LooksSame kütüphanesi, farklılıkların meydana geldiği tam bölgeyi gösteren bir sınırlayıcı kutu özelliği sağlar. Bu işlev, farklı bölgelerin sınırlayıcı kutu koordinatlarını çıktı olarak verir ve böylece görüntünün değişen belirli kısımlarına odaklanmayı kolaylaştırır. Aşağıdaki örnek, sınırlayıcı kutu koordinatlarının görüntüleri karşılaştırmak ve farklılıkları vurgulamak için nasıl kullanılacağını gösterir.
Node.js Uygulamaları Aracılığıyla Görüntülerin Belirli Alanları Arasındaki Farklılıkları Nasıl Karşılaştırıp Belirleyebilirim?
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');
Doğru Karşılaştırmalar İçin Anti-Aliasing Algılama
Açık kaynaklı LooksSame kütüphanesi, yazılım geliştiricilerinin Node.js uygulamaları içinde Anti-Aliasing Algılama yöntemini kullanarak görüntü sıkıştırması yapmalarına olanak tanır. Anti-aliasing, kenar işlemede ufak farklılıklara neden olduğu için görüntüleri karşılaştırırken yanlış pozitiflere neden olabilir. Kütüphanenin ignoreAntialiasing seçeneği bu yanlış pozitifleri önlemeye yardımcı olur. Bu, özellikle görüntülerin çeşitli cihazlarda veya tarayıcılarda farklı şekilde işlenebileceği ancak yine de görsel olarak aynı olduğu uygulamalar için faydalıdır.