Usprawnij testowanie modeli Web AI: WebGPU, WebGL i Chrome bez interfejsu graficznego

François Beaufort
François Beaufort

Mamy dobre wieści. Udało Ci się utworzyć świetną aplikację internetową AI, która uruchamia modele systemów uczących się bezpośrednio na urządzeniu użytkownika. Działa w całości w przeglądarce po stronie klienta, bez pracy z chmurą. Taki sposób działania zwiększa prywatność użytkowników, zwiększa wydajność i znacząco obniża koszty.

Istnieje jednak przeszkoda. Twój model TensorFlow.js może działać na zarówno CPU (WebAssembly), jak i na wydajniejszych GPU (za pomocą WebGL i WebGPU). Pytanie brzmi: jak można konsekwentnie zautomatyzować testowanie przeglądarki za pomocą wybranego sprzętu?

Utrzymanie spójności jest kluczowe dla porównywania wydajności modelu systemów uczących się na przestrzeni czasu w miarę ich iteracji i ulepszania przed wdrożeniem dla rzeczywistych użytkowników na ich urządzeniach.

Skonfigurowanie spójnego środowiska testowego z układami GPU może być trudniejsze, niż się spodziewaliśmy. W tym poście omawiamy napotkane problemy i sposób ich rozwiązywania, co pomoże Ci zwiększyć wydajność swojej aplikacji.

Dotyczy to nie tylko programistów internetowych AI! Jeśli zajmujesz się grami internetowymi lub grafiką, ten post będzie także dla Ciebie wartościowy.

Co znajduje się w naszych narzędziach do automatyzacji

Korzystamy z tych rozwiązań:

  • Środowisko: oparty na systemie Linux notatnik Google Colab połączony z procesorem graficznym NVIDIA T4 lub V100. W razie potrzeby możesz używać innych platform chmurowych, np. Google Cloud (GCP).
  • Przeglądarka: Chrome obsługuje WebGPU, potężny następca WebGL, który przenosi do internetu rozwój nowoczesnych interfejsów API GPU.
  • Automatyzacja: Puppeteer to biblioteka Node.js, która umożliwia automatyczne sterowanie przeglądarkami za pomocą JavaScriptu. Dzięki Puppeteer możemy zautomatyzować Chrome w trybie bez interfejsu graficznego, co oznacza, że przeglądarka działa na serwerze bez widocznego interfejsu użytkownika. Używamy ulepszonego nowego trybu bez interfejsu graficznego, a nie starszej wersji.

Sprawdzanie środowiska

Najlepszym sposobem na sprawdzenie, czy akceleracja sprzętowa jest włączona w Chrome, jest wpisanie „chrome://gpu” na pasku adresu. Możesz wykonać odpowiednik w Puppeteer za pomocą console.log lub zapisać pełny raport w formacie PDF i sprawdzić go ręcznie:

/* 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();

Otwórz plik chrome://gpu. Powinien pojawić się następujący wynik:

Stan funkcji graficznej
OpenGL: Wyłączono
Interfejs Vulkan: Wyłączono
WebGL: Tylko oprogramowanie, akceleracja sprzętowa niedostępna.
WebGL 2 Tylko oprogramowanie, akceleracja sprzętowa niedostępna.
WebGPU: Wyłączono

Wykryto problemy.
Interfejs WebGPU został wyłączony za pomocą listy zablokowanych lub wiersza poleceń.

Nie był to dobry początek. Od razu widać, że nie udało się wykryć sprzętu. WebGL, WebGL2 i WebGPU są wyłączone lub mogą mieć tylko oprogramowanie. Nie jesteśmy sami w tym problemie – w internecie wiele osób rozmawia o podobnej sytuacji, m.in. w oficjalnych kanałach pomocy Chrome (1),2.

Włącz obsługę WebGPU i WebGL

Domyślnie Chrome bez interfejsu graficznego wyłącza GPU. Aby włączyć ten tryb w systemie Linux, w przypadku uruchamiania Chrome bez interfejsu graficznego zastosuj te wszystkie flagi:

  • Flaga --no-sandbox wyłącza bezpieczną piaskownicę Chrome, która odizoluje proces przeglądarki od reszty systemu. Uruchamianie Chrome jako użytkownik root bez tej piaskownicy nie jest obsługiwane.
  • Flaga --headless=new powoduje uruchomienie Chrome w nowym, ulepszonym trybie bez interfejsu graficznego bez widocznego interfejsu użytkownika.
  • Flaga --use-angle=vulkan informuje Chrome, że ma używać backendu Vulkan dla ANGLE, który tłumaczy wywołania OpenGL ES 2/3 na wywołania interfejsu Vulkan API.
  • Flaga --enable-features=Vulkan włącza backend grafiki Vulkan do komponowania i rasteryzacji w Chrome.
  • Flaga --disable-vulkan-surface wyłącza rozszerzenie instancji vulkan VK_KHR_surface. W przypadku bieżącego wyniku renderowania na ekranie używana jest metoda bit bllit, a nie swapchain.
  • Flaga --enable-unsafe-webgpu włącza eksperymentalny interfejs WebGPU API w Chrome w systemie Linux i wyłącza listę zablokowanych adapterów.

Teraz łączymy wszystkie wprowadzone do tej pory zmiany. Oto pełny skrypt.

/* 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();

Ponownie uruchom skrypt. Nie zostaną wykryte żadne problemy z WebGPU, a wartość zmieni się z „Wyłączono” na „Tylko oprogramowanie”.

Stan funkcji graficznej
OpenGL: Wyłączono
Interfejs Vulkan: Wyłączono
WebGL: Tylko oprogramowanie, akceleracja sprzętowa niedostępna.
WebGL 2 Tylko oprogramowanie, akceleracja sprzętowa niedostępna.
WebGPU: Tylko oprogramowanie, akceleracja sprzętowa niedostępna.

Jednak akceleracja sprzętowa jest nadal niedostępna i nie wykryto procesora GPU NVIDIA T4.

Zainstaluj odpowiednie sterowniki GPU

We współpracy z ekspertami od GPU w zespole Chrome dokładniej zbadaliśmy wynik działania chrome://gpu. Wykryliśmy problemy z domyślnymi sterownikami zainstalowanymi w instancji Colab Colab, które powodowały problemy z interfejsem Vulkan, przez co Chrome nie mógł wykryć GPU NVIDIA T4 na poziomie GL_RENDERER, jak pokazano poniżej. Powoduje to problemy z Chrome bez interfejsu graficznego.

Domyślne wyjście nie spowoduje wykrycia GPU NVIDIA T4.
Informacje o kierowcy
GL_RENDERER ANGLE (Google, Vulkan 1.3.0 (SwiftShader Urządzenie (Subzero) (0x0000C0DE)), sterownik SwiftShader-5.0.0)

Zainstalowanie zgodnych sterowników rozwiązuje problem.

Zaktualizowane dane wyjściowe po zainstalowaniu sterowników.
Informacje o kierowcy
GL_RENDERER ANGLE (NVIDIA Corporation, Tesla T4/PCIe/SSE2, OpenGL ES 3.2 NVIDIA 525.105.17)

Aby zainstalować prawidłowe sterowniki, podczas konfiguracji uruchom te polecenia. Ostatnie 2 wiersze pomagają zapisać dane wyjściowe wykryte przez sterowniki NVIDIA wraz z poleceniem vulkaninfo.

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

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

Teraz uruchom skrypt jeszcze raz. Otrzymasz następujący wynik. 🎉

Stan funkcji graficznej
OpenGL: Włączono
Interfejs Vulkan: Włączono
WebGL: Akceleracja sprzętowa przy zmniejszonej wydajności.
WebGL 2 Akceleracja sprzętowa przy zmniejszonej wydajności.
WebGPU: Akceleracja sprzętowa przy zmniejszonej wydajności.

Dzięki zastosowaniu odpowiednich sterowników i flag w Chrome mamy teraz obsługę WebGPU i WebGL w supernowym trybie bez interfejsu graficznego.

Za kulisami: śledztwo naszego zespołu

Po licznych badaniach nie znaleźliśmy metod roboczych dla środowiska, które musieliśmy wdrożyć w Google Colab. Było jednak kilka postów, które sprawdziły się w innych środowiskach, co było obiecujące. Ostatecznie nie udało się nam odtworzyć ich sukcesu w środowisku Colab NVIDIA T4, ponieważ wystąpiły 2 główne problemy:

  1. Niektóre kombinacje flag umożliwiają wykrywanie GPU, ale nie pozwalają na użycie tego GPU.
  2. Przykłady działających rozwiązań innych firm korzystających ze starej wersji Chrome bez interfejsu graficznego, która w pewnym momencie zostanie wycofana i zastąpiona nową wersją. Potrzebowaliśmy rozwiązania, które sprawdzi się w nowej wersji Chrome bez interfejsu graficznego, by lepiej przygotować się na przyszłość.

Potwierdziliśmy niedostateczne wykorzystanie GPU, uruchamiając przykładową stronę internetową w TensorFlow.js do rozpoznawania obrazów, dzięki której wytrenowaliśmy model do rozpoznawania próbek ubrań (na przykład „Świat Witt” systemów uczących się).

Na zwykłej maszynie 50 cykli trenowania (nazywanych epokami) powinno odbywać się w czasie krótszym niż 1 sekunda. Gdy wywołaliśmy Chrome bez interfejsu graficznego w stanie domyślnym, mogliśmy zapisać dane wyjściowe konsoli JavaScriptu w wierszu poleceń Node.js po stronie serwera, aby sprawdzić, jak szybko trwało te cykle trenowania.

Zgodnie z oczekiwaniami każda epoka trenowania trwała znacznie dłużej niż oczekiwano (kilka sekund), co sugeruje, że Chrome korzysta ze starego procesora JS zamiast korzystać z GPU:

Epoki trenowania następują w wolniejszym tempie.
Rysunek 1. Przechwytywanie w czasie rzeczywistym pokazujące czas trwania każdej epoki trenowania (w sekundach).

Po naprawieniu sterowników i użyciu odpowiedniej kombinacji flag dla Chrome bez interfejsu graficznego ponowne uruchomienie przykładowego trenowania TensorFlow.js powoduje znacznie szybsze okresy trenowania.

Wzrosła szybkość w epokach...
Rysunek 2. Robienie zdjęć w czasie rzeczywistym pokazujące przyspieszenie epok.

Podsumowanie

Internetowa AI rozwinęła się w gwałtowny sposób od czasu jej stworzenia w 2017 r. Dzięki takim technologiom przeglądarek jak WebGPU, WebGL i WebAssembly operacje matematyczne modelu systemów uczących się można przyspieszyć po stronie klienta.

W 2023 r. biblioteki TensorFlow.js i MediaPipe Web przekroczyły miliard pobrań modeli i bibliotek. To historyczny kamień milowy, który pokazuje, jak programiści i inżynierowie stron internetowych przechodzą na AI w swoich aplikacjach internetowych nowej generacji, aby tworzyć naprawdę niesamowite rozwiązania.

Duża odpowiedzialność wynika z dużej odpowiedzialności. Przy tym poziomie użycia w systemach produkcyjnych pojawia się potrzeba testowania opartych na przeglądarce modeli AI po stronie klienta w prawdziwym środowisku przeglądarki przy jednoczesnym skalowalności i automatyzacji oraz w ramach znanej, ustandaryzowanej konfiguracji sprzętowej.

Wykorzystując połączone możliwości nowej wersji Chrome bez interfejsu graficznego i Puppeteer, możesz bezpiecznie testować takie zadania w ustandaryzowanym i replikowanym środowisku, co zapewnia spójne i wiarygodne wyniki.

Podsumowanie

Szczegółowy przewodnik znajdziesz w naszej dokumentacji, dzięki czemu możesz samodzielnie wypróbować pełną konfigurację.

Jeśli te informacje były dla Ciebie przydatne, wspomnij o nich na LinkedIn, X (dawniej Twitter) lub w innych sieciach społecznościowych, w których używasz hashtagu #WebAI. Czekamy na Wasze opinie. Dzięki temu będziemy mogli napisać więcej podobnych rzeczy w przyszłości.

Dodaj gwiazdkę do repozytorium GitHub, aby otrzymywać w przyszłości aktualizacje.

Podziękowania

Serdecznie dziękujemy wszystkim członkom zespołu Chrome, którzy pomagali nam w debugowaniu problemów ze sterownikiem i WebGPU, które napotkaliśmy w tym rozwiązaniu. Szczególnie dziękujemy Jecelyn Yeen i Alexandrze White za pomoc w tym poście na blogu. Dzięki Julijowi Novikowi, Andriejowi Kosiakowi i Alexowi Rudenko, którzy odegrali kluczową rolę w opracowaniu ostatecznego, działającego rozwiązania.