Web AI model testini güçlendirin: WebGPU, WebGL ve gözetimsiz Chrome

Jason Mayes

François Beaufort

Güzel bir haberimiz var. Havalı bir Web AI uygulaması geliştirdiniz makine öğrenimi modellerini doğrudan kullanıcının cihazında çalıştıran. Tamamen çalışır istemci tarafı web tarayıcısında hızlı bir şekilde iletebilir. Cihazdaki bu Tasarım kullanıcı gizliliğini artırır, performansı artırır ve maliyetleri azaltır önemli ölçüde artış gösteriyor.

Ancak bir zorluk var. Sizin TensorFlow.js modeli üzerinde çalışabilir hem CPU'lar (WebAssembly) hem de daha güçlü GPU'lar ( WebGL ve WebGPU). Soru şudur: Seçilen donanımla tarayıcı testini nasıl tutarlı bir şekilde otomatikleştirebilirsiniz?

Tutarlılığın sürdürülmesi, makine öğrenimi modellerinin karşılaştırılması açısından çok önemlidir. dağıtımdan önce, bunları geliştirip geliştirdikçe zaman içinde cihazlarında kullanmalarına izin verir.

GPU'larla tutarlı bir test ortamı oluşturmak, bekleniyor. Bu blog yayınında, karşılaştığımız sorunları ve bu sorunları nasıl çözdüğümüzü paylaşacağız. bu sayede uygulamanızın performansını artırabilirsiniz.

Bu, yalnızca Web AI geliştiricileri için değildir. Web oyunları üzerinde çalışıyorsanız bu gönderi sizin için de değerlidir.

Otomasyon araç kutumuz

Şunları kullanıyoruz:

• Ortam: Linux tabanlı bir Google Colab NVIDIA'ya bağlı notebook T4 veya V100 GPU. Google Cloud gibi diğer bulut platformlarını kullanabilirsiniz (GCP) belirtin.
• Tarayıcı: Chrome, modern GPU API'lerinin avantajlarını web'e getiren güçlü bir WebGL'nin varisi olan WebGPU'yi destekler.
• Otomasyon: Puppeteer şunları sağlayan bir Node.js kitaplığıdır: tarayıcıları programlı bir şekilde JavaScript ile kontrol edersiniz. Puppeteer ile Chrome'u gözetimsiz modda otomatikleştirebiliriz. Bu, tarayıcının görünür bir arayüz olmadan bir sunucuda çalıştığı anlamına gelir. İyileştirilmiş yeni gözetimsiz mod eski formu kullanmayın.

Ortamı doğrulama

Chrome'da donanım hızlandırmanın açık olup olmadığını kontrol etmenin en iyi yolu adres çubuğuna chrome://gpu yazın. console.log ile Puppeteer ile eşdeğer işlemi programatik olarak gerçekleştirebilir veya raporun tamamını PDF olarak kaydedip manuel olarak kontrol edebilirsiniz:

/* Incomplete example.js */
import puppeteer from 'puppeteer';

// Configure launch parameters: Expands later
const browser = await puppeteer.launch({
  headless: 'new',
  args:  ['--no-sandbox']
});

const page = await browser.newPage();
await page.goto('chrome://gpu');

// Verify: log the WebGPU status or save the GPU report as PDF
const txt = await page.waitForSelector('text/WebGPU');
const status = await txt.evaluate(g => g.parentElement.textContent);
console.log(status);
await page.pdf({ path: './gpu.pdf' });

await browser.close();

chrome://gpu uygulamasını açtığınızda aşağıdaki sonuçları göreceksiniz:

İyi bir başlangıç değil. Donanım algılamanın başarısız olduğu oldukça açıktır. WebGL, WebGL2 ve WebGPU, temelde devre dışıdır veya yalnızca yazılım mevcuttur. Biz değildir. İnsanların çevrimiçi ortamda çok sayıda tartışması vardır. resmi Chrome destek kanalları da dahil olmak üzere (1), (2).

WebGPU ve WebGL desteğini etkinleştir

Gözetimsiz Chrome varsayılan olarak GPU'yu devre dışı bırakır. Özelliği Linux'ta etkinleştirmek için Gözetimsiz'i başlatırken aşağıdaki işaretlerin tümünü uygulayın Chrome:

• --no-sandbox işareti Chrome'un güvenlik korumalı alanını devre dışı bırakır. Bu korumalı alan, sistem geri kalanından uzaklaştırın. Chrome'u bu korumalı alan desteklenmiyor.
• --headless=new işareti, Chrome'u yeni ve geliştirilmiş görünür kullanıcı arayüzü olmayan gözetimsiz mod.
• --use-angle=vulkan işareti, Chrome'a Vulkan arka ucu ANGLE için OpenGL ES 2/3 çağrılarını Vulkan API çağrılarına çevirir.
• --enable-features=Vulkan işareti, şunlar için Vulkan grafik arka ucunu etkinleştirir: birleştirme ve pikselleştirme.
• --disable-vulkan-surface işareti VK_KHR_surface vulkan'ını devre dışı bırakır örnek uzantısıdır. Değişim zinciri kullanmak yerine Bit blit, ekranda oluşturma sonucunu sunma.
• --enable-unsafe-webgpu işareti, şurada deneysel WebGPU API'yi etkinleştirir: Linux'ta Chrome'u açar ve bağdaştırıcıların engellenenler listesini devre dışı bırakır.

Şimdiye kadar yaptığımız tüm değişiklikleri birleştiriyoruz. Komut dosyasının tamamını aşağıda bulabilirsiniz.

/* Complete example.js */
import puppeteer from 'puppeteer';

// Configure launch parameters
const browser = await puppeteer.launch({
  headless: 'new',
  args: [
    '--no-sandbox',
    '--headless=new',
    '--use-angle=vulkan',
    '--enable-features=Vulkan',
    '--disable-vulkan-surface',
    '--enable-unsafe-webgpu',
  ]
});

const page = await browser.newPage();
await page.goto('chrome://gpu');

// Verify: log the WebGPU status or save the GPU report as PDF
const txt = await page.waitForSelector('text/WebGPU');
const status = await txt.evaluate(g => g.parentElement.textContent);
console.log(status);
await page.pdf({path: './gpu.pdf'});

await browser.close();

Komut dosyasını tekrar çalıştırın. WebGPU sorunu algılanmaz ve değer devre dışı değerinden yalnızca yazılım değerine geçer.

Ancak donanım hızlandırma hâlâ kullanılamıyor ve NVIDIA T4 GPU, algılandı.

Doğru GPU sürücülerini yükleyin

Bazı GPU uzmanlarıyla birlikte chrome://gpu çıktılarını daha yakından inceledik mühendisim. Google Drive'da yüklü varsayılan sürücülerle ilgili sorunlar Linux Colab Chrome, Vulkan'da soruna neden olarak Chrome'un Aşağıdaki çıkışta gösterildiği gibi GL_RENDERER düzeyindeki NVIDIA T4 GPU. Bu Gözetimsiz Chrome ile ilgili sorunlara neden olur.

Uyumlu olan doğru sürücülerin yüklenmesi sorunu çözer.

Doğru sürücüleri yüklemek için kurulum sırasında aşağıdaki komutları çalıştırın. İlgili içeriği oluşturmak için kullanılan son iki satır, NVIDIA sürücülerinin süreç boyunca algıladığı çıkışları günlüğe vulkaninfo ile birlikte.

apt-get install -y vulkan-tools libnvidia-gl-525

// Verify the NVIDIA drivers detects along with vulkaninfo
nvidia-smi
vulkaninfo --summary

Şimdi komut dosyasını tekrar çalıştırın. Aşağıdaki sonucu elde ederiz. 🎉

Chrome çalıştırırken doğru sürücüleri ve işaretleri kullanarak artık elimizde WebGPU var. yeni, gözetimsiz modu kullanarak WebGL desteğinden yararlanın.

Sahne arkası: Ekibimizin incelemesi

Uzun araştırmalardan sonra, geliştirdiğimiz ortama uygun çalışma yöntemleri bulamadık Google Colab'da yürütmem gerekiyordu. Ancak bununla birlikte, umut verici gönderiler başka ortamlarda işe yaradı ve bu da ümit vericiydi. Sonuç olarak, Colab NVIDIA T4 ortamında başarılarını tekrarlayabildik. temel sorunlar:

1. Bazı işaret kombinasyonları GPU'nun algılanmasına olanak tanır ancak şunları yapmanıza izin vermez: GPU'yu kullanıyor.
2. Eski Chrome gözetimsiz özelliğinin kullanıldığı üçüncü tarafların çalışan çözümlerine örnekler Bu sürüm, bir noktada kullanımdan kaldırılıp yeni sürüme gidin. Gelecekte daha iyi bir deneyim sunmak için yeni Gözetimsiz Chrome ile çalışan bir çözüme ihtiyacımız vardı.

GPU'nun yetersiz kullanıldığını doğruladığımızda görüntü tanıma için örnek TensorFlow.js web sayfası, Bu şekilde, bir modeli kıyafet numunelerini tanıyacak şekilde eğittik (örneğin, "merhaba" dünya" ilk adımıdır.

Normal bir makinede, 50 eğitim döngüsü (sıfır zaman olarak bilinir) daha kısa sürede 1 saniyeden fazla olacaktı. Gözetimsiz Chrome varsayılan durumunda çağrıldığında günlüğe nasıl yapıldığını görmek için JavaScript konsolu çıkışını Node.js sunucu tarafı komut satırına gerçekten çok hızlı aldı.

Beklendiği gibi her eğitim dönemi beklenenden daha uzun sürdü (birkaç saniye) Bu da Chrome'un eski JS CPU yürütmeye geri döndüğünü gösterir. daha basit bir alternatif:

Sürücüleri düzelttikten ve gözetimsiz için doğru işaret kombinasyonunu kullandıktan sonra Chrome, TensorFlow.js eğitim örneğini yeniden çalıştırmak çok daha hızlı sonuç verir eğitim dönemleri şeklinde özetlenebilir.

Özet

Web AI katlanarak büyüdü 2017'de kuruldu. WebGPU, WebGL gibi tarayıcı teknolojileri ve WebAssembly, makine öğrenimi modelinin istemci tarafında daha da hızlandırılabilir.

2023 itibarıyla TensorFlow.js ve MediaPipe Web, model ve kitaplık indirme sayısını 1 milyarı aştı. Bu, web geliştiricilerinin ve mühendislerinin gerçekten inanılmaz çözümler üretmek için yeni nesil web uygulamalarında yapay zekayı kullanmaya yöneldiğinin tarihi bir göstergesi ve işaretidir.

Uygulamada büyük başarı, büyük sorumluluk da beraberinde getirir. Üretim sistemlerinde bu düzeyde kullanımda, istemci tarafında tarayıcı tabanlı yapay zeka modellerini gerçek bir tarayıcı ortamında test etme ihtiyacı ortaya çıkar. Bu testler ölçeklenebilir, otomatikleştirilebilir ve bilinen standartlaştırılmış bir donanım kurulumunda yapılmalıdır.

Yeni Gözetimsiz Chrome ve Puppeteer'ın birleşik gücünden yararlanarak bu tür iş yüklerini standartlaştırılmış ve tekrarlanabilir bir ortamda güvenle test edebilir, tutarlı ve güvenilir sonuçlar elde edebilirsiniz.

Son adım

Adım adım açıklamalı kılavuza aşağıdaki bağlantıdan ulaşabilirsiniz: belgelerimize göz atın. Böylece kurulumun tamamını kendiniz deneyebilirsiniz.

Bu içeriği yararlı bulduysanız LinkedIn, X (eski adıyla Twitter) veya #WebAI hashtag'ini kullanarak kullandığınız sosyal ağ. Gelecekte bu tür içerikler yazmaya devam edebilmemiz için geri bildirimlerinizi öğrenmekten memnuniyet duyarız.

Gelecekteki güncellemeleri almak için GitHub deposuna yıldız ekleyin.

Teşekkür

Chrome ekibinde sürücünün hatalarını ayıklamaya yardımcı olan ve Bu çözümde karşılaştığımız WebGPU sorunları, Jecelyn Yeen ve Kelime ustalarına yardım ettiği için Alexandra White bu blog yayınına göz atın. Yuly Novikov, Andrey Kosyakov ve Alex Rudenko, dünyanın dört bir yanından işe yarayan nihai çözümü oluşturmaktır.