Ana içeriğe geç
%50 indirim tüm planlarda, sınırlı süreyle. Başlangıç fiyatı $2.48/mo
13 min left
Geliştirici Araçları ve DevOps

Self-Hosted Visual Regression Testing: BackstopJS vs. Argos (and What Happened to Lost Pixel)

M Yazan Matej 13 dk okuma
Comparison of self-hosted visual regression testing tools BackstopJS, Argos, and the archived Lost Pixel.

CI'nizi herkesin kısa listeye aldığı üç açık kaynak görsel regresyon test aracından birine (BackstopJS, Argos, Lost Pixel) standardize ettiğinizi ve araştırmanın bir haftasında üçünden ikisinin dışarıdan göründükleri şey olmadığını fark ettiğinizi düşünün. Argos'un GitHub'da mükemmel kodu var, ancak sürdürücüsü açıkça self-hosting'in ne desteklendiğini ne de belgelendiğini söylüyor. Lost Pixel, ekip Figma'ya katıldığında 22 Nisan 2026'da arşivlendi ve onu zaten çalıştıran ekipler için hiçbir geçiş yolu sunmadı.

Bu, bugün gerçekten self-host edilebilir ve bakımı yapılan tam olarak üçünden birini geride bırakıyor. Bu kadar çok görünür seçeneği olan bir kategori için söylenmesi tuhaf bir şey, ama manzara aslında böyle. İnsanların üç eşdeğer gibi gördüğü araçlar pratikte çalışan bir self-hosted seçenek, başkasının sunucularında yaşayan güçlü bir araç ve uzaklaşmanız gereken bir tanesidir.

Bu, gerçeklikle temasta hayatta kalan self-hosted görsel regresyon test araçlarına self-hosting öncelikli bir bakış: hangisi hangi kısıta uyuyor ve şu anda Lost Pixel kullanıyorsanız ne yapmalısınız.

Kısa Versiyon

  • BackstopJS self-host edilebilir, bakımı yapılan, MIT lisanslı ve maliyeti sıfır olan seçenektir. Varsayılan olarak Puppeteer ve Playwright desteği, Resemble.js üzerinden piksel karşılaştırma ve bir HTML inceleme arayüzü (planlamanız gereken Docker render uyarılarıyla birlikte).
  • Argos iş akışında daha güçlü araçtır (PR incelemesi ve 2025 sonundan beri ARIA anlık görüntü karşılaştırması), ancak pratikte yönetilen bir SaaS'tır. Sürdürücü, onu kendiniz çalıştırmanız için ne destek ne de belge sunuyor.
  • Lost Pixel Nisan 2026'da arşivlendi. Yeni işler için benimsemeyin ve kullanıyorsanız geçişinizi şimdi planlayın.

Tek satırlık karar: tamamen self-hosted bir CI hattı için BackstopJS pratik seçimdir. En iyi inceleme iş akışını istiyorsanız ve bir SaaS bağımlılığını kabul edebiliyorsanız Argos daha iyi araçtır.

(Bunun kapsamadığı: Cypress tabanlı görsel testler, Storybook'a özgü bileşen iş akışları ve elle ölçülmüş performans rakamları. Bu karşılaştırma birincil kaynaklardan gelen gerçeklere dayanır, kendim çalıştırdığım bir test düzeneğine değil.)

Self-hosted görsel regresyon test manzarası değişti

Geçen yıl içinde iki belirli olay bu kısa listeyi yeniden şekillendirdi ve bunlar olmadan önce yazılmış bir listeden çalışıyorsanız ikisini de kaçırmak kolaydır.

Birincisi: Eylül 2025 tarihli bir GitHub tartışmasındabir Argos sürdürücüsü, Argos'un yönetilen hizmet dışında çalıştırılması için destek veya belge sunmadığını belirtti. Kod MIT lisanslı ve açıkta duruyor, dolayısıyla "onu self-host edebilirsiniz" teknik olarak doğru, ancak desteklenen bir yol yok, bu da onun için nöbetçi kişi siz olduğunuzda muazzam derecede önemli hale gelen bir ayrım.

İkincisi: Lost Pixel deposu arşivlendi 22 Nisan 2026'da, salt okunur olarak, ekip Figma'ya katıldığınıduyurduğunda. Kapanışa hiçbir geçiş rehberi eşlik etmedi. Yakın zamana kadar Percy ve Chromatic'e meşru bir ücretsiz self-hosted alternatif olan bir araç, artık sürdürücüsü olmayan bir bağımlılık.

Her iki değişiklik de aynı yönü gösteriyor. Ekiplerin ilk etapta buraya gelme nedeni, tarayıcılar çarpı görünüm alanları çarpı sayfalarla büyüyen SaaS fiyatlandırması ya da yayınlanmamış arayüz ekran görüntülerinin üçüncü bir tarafa yüklenmesine karşı bir uyumluluk kuralı, ortadan kalkmadı. Değişen şey, self-hosted menünün göründüğünden daha kısa olması.

Bölümün ana çıkarımı: İnsanların kısa listeye aldığı üç araçtan yalnızca biri bugün gerçekten self-host edilebilir ve etkin biçimde bakımı yapılıyor.

Timeline showing the self-hosted visual regression landscape in 2025-2026: BackstopJS remains maintained and self-hosted, Argos shifts to SaaS-only in practice, and Lost Pixel is archived and read-only.

BackstopJS: gerçekten self-host edilebilir seçenek

Kurulum npm install -g backstopjs (ya da yerel bir proje kurulumu) şeklindedir ve bu tek gerçek, BackstopJS'in self-hosting ekseninde neden kazandığının büyük kısmını açıklar: tersine mühendislik yapılacak bir hizmet, gizlice bağlı olduğu yönetilen bir arka uç yok. Kontrol ettiğiniz altyapıda bir npm paketi ya da bir Docker konteyneri olarak, MIT lisansı altında, sıfır lisans maliyetiyle çalışır. README mevcut sürüm hattının (6.3.x) Node 20'yi desteklediğini belirtir.

Kaputun altında varsayılan olarak Puppeteer'i (headless Chrome) sürer ve ayrıca chromium, firefox ve webkit genelinde Playwright'ı destekler. Karşılaştırma Resemble.js üzerinden piksel tabanlıdır ve ne kadar piksel sapmasının başarısızlık sayılacağını denetleyen ayarlanabilir bir değere sahiptir. misMatchThreshold Onaylar, değişiklikleri kabul etmek için tarayıcı içi bir arayüze sahip bir HTML raporu aracılığıyla gerçekleşir.

Sınırlamalar, stratejik bir kararın verildiği yerdir. BackstopJS'in yerleşik bir PR engelleme iş akışı yok: bir fark olduğunu size söyler, ancak bunu bir "bu PR birleştirilemez" kapısına bağlamak size kalmış. Yapılandırması JSON içinde, her seferinde bir senaryo olarak yaşar ve birkaç yüz test durumunda o JSON kendi başına bir bakım yüzeyi haline gelir. Geliştirme hızlı olmaktan çok yavaştır: proje arşivlenmemiştir, paket şu anda 6.3.25 sürümündeve depo yaklaşık 7.200 GitHub yıldızı ve 516 açık sorun gösteriyor. Dolayısıyla BackstopJS'i olgun ve kullanılabilir olarak değerlendirin, hızlı gelişen bir görsel test platformu olarak değil.

En keskin operasyonel risk Docker render'ıdır. İki sorun, Docker'da beyaz ya da kesik ekran görüntüleri (#1156) ve v5.3.0 Docker yükseltmesinden sonra tutarsız sonuçlar (#1303), yıllardır çözülmeden açık duruyor. Docker aynı zamanda CI için tam olarak istediğiniz şeydir, çünkü render'ı makineler arasında normalleştirir. Böylece size en fazla kontrolü veren araç, aynı zamanda onu çalıştıracağınız kurulumun tam da içinde bilinen, düzeltilmemiş bir kararsızlık sınıfını da verir. Bu, planlanabilir bir risktir, bir engel değil, ama bağlanmadan önce masada olması gerekir.

Profesyonel ipucu: işletim sistemleri arası referans tuzağı. Geliştiricileriniz referansları macOS'te yakalıyorsa ve CI çalıştırıcılarınız Linux ise, testleriniz gerçek bir regresyon var olmadan önce yalnızca yazı tipi kenar yumuşatma farklarıyla başarısız olur. Bir uygulayıcının belgelediğigibi, yazı tipi render'ı CI hizmetlerinde kullanılan Linux imajı ile yerel bir macOS makinesi arasında, bir görsel testi kendi başına başarısız kılmaya yetecek kadar farklıdır. Çözüm, referansları tek bir ortamda üretip karşılaştırmaktır (BackstopJS'i yerelde CI'de kullandığınız aynı Docker imajı içinde çalıştırın), böylece referans ve karşılaştırma görüntüleri özdeş render'dan gelir.

Argos: en iyi iş akışı, ama pratikte SaaS

Argos, inceleme deneyimini BackstopJS'in beceremediği bir şekilde tutturur ve self-hosting uyarısına rağmen bu listede olmasının tüm nedeni budur. Playwright, Cypress, Storybook, WebdriverIO ve Puppeteer ile entegre olur ve GitHub Actions, GitLab CI, Bitbucket ve Azure DevOps'a bağlanır. PR inceleme iş akışı birinci sınıf bir ürün yüzeyidir ve hareket etmeye devam etti. Son changelog girdileri sabitlenmiş yorumlarla işbirlikçi incelemeler (Haziran 2026) ve kararsız değişikliklerin otomatik olarak yok sayılmasını ekliyor.

En ilginç teknik ayırt edici özelliği karşılaştırmadır. Deterministik piksel karşılaştırmasının üstüne, Argos Playwright SDK'sı için ARIA anlık görüntü karşılaştırmasını 4 Kasım 2025'te ekledi. ARIA anlık görüntü karşılaştırması, erişilebilirlik ağacını (roller, etiketler ve yapı) piksel ekran görüntüsünün yanında karşılaştırır; bu da salt piksel karşılaştırmasının gözden kaçırabileceği bir sınıf anlamsal ve erişilebilirlik regresyonunu yakalar (örneğin hâlâ özdeş görünen ama erişilebilir etiketini kaybetmiş bir düğme). Erişilebilirlik taahhütleri olan ekipler için bu, salt piksel araçlarının sunmadığı gerçek bir yetenektir.

Sonra kısıt geliyor. Kod MIT, ancak ürün yönetilen hizmettir ve sürdürücü, self-hosting'in belgesiz ve desteksiz olduğu konusunda açık olmuştur. Onu kaynaktan ayağa kaldırabilirsiniz. Bunu yalnızca, herhangi bir üst akış değişikliğinin dağıtımınızı bozabileceğini ve kimsenin yardım etmekle yükümlü olmadığını bilerek yaparsınız. Beyan etmek yerine işaret etmeye değer ilişkili bir belirsizlik var: topluluk raporları, GitLab Self-Managed entegrasyonunun bir Enterprise planı beklediğini öne sürüyor (bunu onaylanmış bir teknik özellik değil, bir topluluk sinyali olarak ele alıyorum, dolayısıyla bir kararı yönlendirmeden önce kendi kurulumunuzda doğrulayın).

Bu, rahatsız edici bir boşluk üretir. Katı gizlilik gereksinimleri olan bir ekip (self-host etmek için en motive ekip), aynı zamanda Argos inceleme deneyimini de istiyorsa iyi bir yolu yoktur. Yönetilen hizmeti kullanıp üçüncü taraf bağımlılığını kabul edebilir, desteksiz self-host edebilir ya da başka bir araç seçebilirler. Temiz bir dördüncü kapı yok ve bunu, açık kaynak lisansının onu kapattığını iddia etmektense söylemek daha dürüst.

Bölümün ana çıkarımı: Argos daha güçlü araçtır. Onu self-host etmek desteksizdir ve operasyonel olarak kırılgandır.

Lost Pixel: arşivlendi ve kullanıyorsanız ne yapmalısınız

Lost Pixel deposunun kendi başlığı tüm hikayeyi tek satırda özetler: depo, sahibi tarafından 22 Nisan 2026'da arşivlendi ve artık salt okunur. Ekip Figma'ya katıldı, son sürüm Kasım 2024'te v3.22.0 oldu ve hiçbir geçiş rehberi yayımlanmadı.

Arşivlenene kadar Lost Pixel makul bir seçimdi (Docker tabanlı render, Playwright ve Storybook desteği artı Ladle ve Histoire ve hem tam sayfa hem bileşen düzeyinde görsel test). Bunların hiçbiri 22 Nisan'da teknik olarak değişmedi. Değişen şey, artık sürdürücüsü, güvenlik yamaları ve yol haritası olmaması; bu da bir CI bağımlılığı için mevcut sürüm ne kadar iyi çalışırsa çalışsın yeni iş için diskalifiye edicidir.

Bugün kullanıyorsanız, geçiş onu nasıl kullandığınıza göre ayrılır. Bileşen düzeyindeki testlerine, özellikle Storybook ya da Ladle iş akışlarına dayanıyorsanız, en yakın alternatifiniz yönetilen Argos hizmeti ya da Playwright'ın yerel ekran görüntüsü testidir. BackstopJS seçicileri ya da Storybook URL'lerini yakalayabilir, ancak size Lost Pixel'in verdiği aynı yerleşik bileşen iş akışını vermez, dolayısıyla o bileşen durumlarını kendiniz modellemeniz gerekir. Onu tam sayfa görsel regresyon için kullanıyorsanız, BackstopJS doğrudan self-hosted haleftir. Her iki durumda da geçiş "build'leriniz yarın bozulacak" anlamında acil değildir, ama saat işliyor: bakımı yapılmayan bir test aracı, tarayıcınızın, işletim sisteminizin ve framework'ünüzün sürümleri en son karşı derlendiği sürümlerden uzaklaştıkça sessizce çürür.

Bir bakışta karşılaştırma

İşte aynı bilgi yan yana, böylece bir CI kararı için önemli olan eksenleri kendi kısıtlarınıza yerleştirmeden önce tarayabilirsiniz.

EksenBackstopJSArgosLost Pixel
LisansMITMIT kodu, yönetilen SaaS ürünüMIT
Self-hosting gerçeğiTasarım gereği tamamen self-host edilebilirMümkün ama desteksiz ve belgesizSelf-host edilebilirdi, artık arşivlendi
Bakım durumuBakımı yapılıyor, yavaş ilerleyen ve olgunEtkin (yönetilen hizmet)22 Nisan 2026'da arşivlendi
Karşılaştırma yaklaşımıPiksel karşılaştırma (Resemble.js)Piksel karşılaştırma artı ARIA anlık görüntü karşılaştırmaPiksel karşılaştırma (bakımsız)
Framework ve motor desteğiPuppeteer (varsayılan), PlaywrightPlaywright, Cypress, Storybook, WebdriverIO, PuppeteerPlaywright, Storybook, Ladle, Histoire (arşivleme anında)
İnceleme iş akışıHTML raporu, elle onay, PR kapısı yokPR incelemesi, işbirlikçi yorumlar, PR geçiş denetimiUygulanamaz (arşivlendi)
MaliyetÜcretsizSaaS fiyatlandırma (anlık görüntü tabanlı)Ücretsiz ama bakımsız
Side-by-side comparison of BackstopJS, Argos, and Lost Pixel across self-hosting, maintenance, diffing, review workflow, and cost.

Nasıl seçilir (karar çerçevesi)

Bir özellik listesinden değil, en zorlu kısıtınızdan başlayın. Kısıt, menünün büyük kısmını sizin için eler.

  • Tamamen self-hosted, sıfır bütçe ve elle incelemeyle yalnızca tam sayfa testini kabul edebiliyorsanız: BackstopJS. Self-hosted, bakımı yapılan ve ücretsiz olmayı aynı anda karşılayan tek seçenektir ve ödünleşimler (PR kapısı yok, JSON yapılandırma, Docker kararsızlığı) etrafında tasarım yapabileceğiniz bilinen büyüklüklerdir.
  • En iyi inceleme deneyimini, PR geçiş denetimini ve ARIA karşılaştırmasını istiyorsanız ve bir SaaS bağımlılığını kabul edebiliyorsanız: yönetilen Argos hizmeti. Bu, desteksiz self-hosting riski olmadan Argos'un güçlü yönlerine giden yoldur. Bir uyumluluk kuralı üçüncü taraf ekran görüntüsü yüklemeyi yasaklıyorsa, bu kapı kapalıdır ve BackstopJS'e geri dönersiniz.
  • Küçük test paketi ya da önce Playwright: hiç özel bir araç eklememeyi düşünün. Playwright, toHaveScreenshot() yerel olarak gelir ve yaklaşık 100 testin altındaki paketler için ihtiyacınız olan her şey olabilir. Bir uygulayıcı rehberi özel bir aracın karşılığını vermeye başladığı dönüm noktasını yaklaşık o ölçekte konumlandırır (bunu resmi bir Playwright rakamı değil, bir sektör gözlemi olarak ele alın). Referans dosyalarını git'te yönetmenin ek yükü o noktanın ötesinde büyür ve işte orada özel bir araç kendini amorti eder.
  • Şu anda Lost Pixel'de: önceki bölümdeki ayrıma göre şimdi geçiş yapın. "Hâlâ çalışıyor"u kalmak için bir neden olarak almayın.

Bütün bu araçlardan önce gelen ve onlardan sonra da yaşayan bir uyarı: Sparkbox ekibi, yıllar önce yazarken, mühendislerin testleri gerçekten kullanmasını sağlamak kurulumdan daha zor olduğu için özellikle barındırılan bir seçenek seçti. Daha zayıf bir inceleme arayüzüne sahip self-hosted bir araç maliyette kazanıp benimsenmede kaybedebilir (ekibiniz gürültülü bir BackstopJS raporunu görmezden geliyorsa, sıfır lisans maliyeti size hiçbir şey kazandırmamıştır). İnceleme deneyimini kararda hesaba katın, yalnızca fiyatı değil.

Bölümün ana çıkarımı: Kısıt aracı seçer. Self-hosted ve ücretsiz BackstopJS'i, en iyi iş akışı ve SaaS kabul edilebilir Argos'u işaret eder ve küçük ve önce Playwright belki hiçbir aracı işaret etmez.

CI çalıştırıcısını headless Chromium için boyutlandırma

Üç araç da headless Chromium'u sürer ve çalıştırıcınızın boyutunu belirleyen şey Chromium'un bellek ayak izidir (CPU değil), çünkü her eşzamanlı tarayıcı işçisi kendi birkaç gigabaytlık RAM'ini ister. Makineyi küçük boyutlandırırsanız görsel testleriniz temiz biçimde başarısız olmaz. Çalışmanın ortasında OOM ile öldürülür ve kararsız altyapı gürültüsü olarak raporlanır; bu da hata ayıklaması en kötü türden bir arızadır.

Yaklaşık bir rehber olarak, katı rakamlar yerine paralellik üzerinden boyutlandırılmıştır (gerçek kullanım sayfa karmaşıklığına ve paralelde kaç işçi çalıştırdığınıza bağlıdır):

  • Küçük ekip ya da seri testler: yaklaşık 2 vCPU / 4 GB RAM, CI arka plan hizmeti ek yüküyle tek bir headless Chromium işçisini kaldırır.
  • Ekip CI kullanımı: yaklaşık 4 vCPU / 8 GB RAM, çoğu ekibin bulunduğu yer olan kabaca 2 ila 4 paralel tarayıcı işçisini destekler.
  • Yüksek verim ya da büyük paketler: yüksek paralellik için ya da görsel regresyon çalışması bir çalıştırıcıyı başka CI işiyle paylaştığında yaklaşık 8 vCPU / 16 GB RAM.

Depolama sessiz kalemdir. Ekran görüntüsü çıktıları ve geçmiş referanslar çalıştırmadan çalıştırmaya birikir, dolayısıyla bu büyümeyi planlayın: referansları yerelde tutuyorsanız cömert depolama payı ayırın ya da çalıştırıcının diski kısıt olmasın diye referansları ve çıktıları nesne depolamaya gönderin.

Bir VPS, bunu yapan self-hosted bir CI çalıştırıcısı için doğal ana bilgisayardır, çünkü Chromium işçileri için öngörülebilir, ayrılmış RAM istersiniz ve bir ev laboratuvarı makinesi ancak donanım zaten oradaysa mantıklıdır. Çevredeki CI yığınını da kuruyorsanız, görsel test aracının çevresindeki parçalar Cloudzy pazar yerinde tek tıkla dağıtımlardır: CI forge için Gitea, GitLab, Jenkins ve Forgejo ve araçların ihtiyaç duyduğu render tutarlılığı için Docker. Görsel regresyon aracının kendisi npm ya da Docker üzerinden üstüne kurulur, dolayısıyla yukarıdaki aralıklara göre boyutlandırılmış bir Linux VPS başlatın ve orada çalıştırın. Docker tabanlı CI kuruyorsanız, Cloudzy'nin self-hosted GitLab alternatifleri ve Docker konteynerlerini listeleme rehberleri komşu kurulumu kapsar.

CI runner sizing for headless Chromium across three tiers: 2 vCPU / 4 GB for serial tests, 4 vCPU / 8 GB for 2 to 4 parallel workers, and 8 vCPU / 16 GB for large suites, with storage headroom for baselines.

Sıkça Sorulan Sorular

Argos self-host edilebilir mi?

Teknik olarak evet (kod MIT lisanslı), ancak sürdürücü Eylül 2025'te Argos'un yönetilen hizmet dışında çalıştırılması için destek ya da belge sunmadığını belirtti. Self-hosting'i desteksiz ve operasyonel olarak kırılgan olarak ele alın: herhangi bir üst akış değişikliğinde, hiçbir sürdürücü yardım etmekle yükümlü olmadan bozulabilir. Çoğu ekip için yönetilen hizmet, Argos'un faydalarını elde etmenin pratik yoludur.

Lost Pixel'e ne oldu?

Lost Pixel, ekip Figma'ya katılıp ürünü kapattığında 22 Nisan 2026'da arşivlendi. Depo salt okunur, son sürüm Kasım 2024'te v3.22.0'dı ve hiçbir geçiş rehberi sağlanmadı. Yeni işler için benimsemeyin. Kullanıyorsanız, BackstopJS'e (tam sayfa test) ya da Argos ve Playwright-yerel'e (bileşen testi) bir geçiş planlayın.

ARIA anlık görüntü karşılaştırması nedir?

ARIA anlık görüntü karşılaştırması, erişilebilirlik ağacını (roller, etiketler ve yapı) piksel ekran görüntüsünün yanında karşılaştırır ve salt piksel karşılaştırmasının gözden kaçırabileceği, örneğin erişilebilir etiketini kaybetmiş görsel olarak özdeş bir düğme gibi anlamsal ve erişilebilirlik regresyonlarını yakalar. Argos özelliği 4 Kasım 2025'te ekledi.

CI'de headless Chromium ne kadar RAM gerektirir?

Tek bir seri işçi tipik olarak yaklaşık 2 ila 4 GB'de çalışır ve eşzamanlı işçiler RAM'i oradan kabaca doğrusal ölçekler. Gerçek kullanım sayfa karmaşıklığına ve paralelde kaç tarayıcı örneği çalıştırdığınıza bağlıdır, dolayısıyla bu değerleri katı rakamlar yerine rehber olarak ele alın ve OOM ile öldürülen test çalışmalarından kaçınmak için pay bırakın.

BackstopJS Playwright'ı destekler mi?

Evet. Puppeteer varsayılan motordur (headless Chrome) ve BackstopJS ayrıca chromium, firefox ve webkit genelinde Playwright'ı destekler. Motoru yapılandırmanızda seçersiniz.

Paylaş

Bloga göz at

Okumaya devam et.

Dağıtmaya hazır mısın? 2,48 $/ay'dan başlayan fiyatlarla.

2008'den beri bağımsız bulut. AMD EPYC, NVMe, 40 Gbps. 14 gün para iade garantisi.