Temos ótimas notícias! Você criou um aplicativo de IA da Web legal que executa modelos de machine learning diretamente no dispositivo de um usuário. Ele é executado inteiramente no navegador da Web do lado do cliente, sem depender da nuvem. Este no dispositivo o design melhora a privacidade do usuário, aumenta o desempenho e reduz custos significativamente.
No entanto, há um obstáculo. Seu O modelo do TensorFlow.js pode operar tanto CPUs (WebAssembly) quanto GPUs mais potentes (por meio WebGL e WebGPU). A pergunta é: como automatizar os testes de navegador com o hardware selecionado de forma consistente?
Manter a consistência é crucial para comparar o modelo de machine learning o desempenho ao longo do tempo à medida que você os itera e melhora, antes da implantação para de usuários do mundo real para usar nos dispositivos deles.
Configurar um ambiente de teste consistente com GPUs pode ser mais difícil o esperado. Nesta postagem do blog, vamos compartilhar os problemas que enfrentamos e como resolvemos para que você possa melhorar o desempenho do seu aplicativo.
Isso não é apenas para desenvolvedores de IA da Web! Se você trabalha com jogos na Web ou gráficos, esta postagem é valiosa para você também.
Recursos de automação
Veja o que estamos usando:
- Ambiente: um Google Colab baseado em Linux. notebook conectado a uma NVIDIA GPU T4 ou V100. É possível usar outras plataformas de nuvem, como o Google Cloud (GCP), se preferir.
- Navegador: o Chrome oferece suporte a WebGPU, um poderoso sucessor da WebGL, que traz para a Web os avanços das APIs modernas de GPU.
- Automação: o Puppeteer é uma biblioteca do Node.js que permite você controla os navegadores de forma programática com JavaScript. Com o Puppeteer, podemos automatizar o Chrome no modo headless, o que significa que o navegador é executado sem um do Kubernetes, em um servidor. Estamos usando a versão novo modo headless, não o legado.
Verificar o ambiente
A melhor maneira de verificar se a aceleração de hardware está ativada no Chrome é
Digite chrome://gpu
na barra de endereço. Você pode
realizar o equivalente com o Puppeteer de maneira programática
com console.log
ou salve o relatório completo como PDF para verificação manual:
/* 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();
Abra chrome://gpu
. Você verá estes resultados:
Status do recurso gráfico | |
---|---|
OpenGL: | Desativada |
Vulkan: | Desativada |
WebGL: | Somente software, aceleração de hardware indisponível. |
WebGL2: | Somente software, aceleração de hardware indisponível. |
WebGPU: | Desativada |
Problemas detectados. |
Não foi um ótimo começo. Está claro que a detecção do hardware estava falhando. WebGL, WebGL2 e WebGPU estão essencialmente desativados ou somente de software. Qa não estão sozinhos nesse problema. Há inúmeras discussões on-line de pessoas em uma situação semelhante, inclusive nos canais de suporte oficiais do Chrome (1) (2).
Ativar o suporte à WebGPU e ao WebGL
Por padrão, o Headless Chrome desativa a GPU; Para ativá-lo no Linux, aplique todas as flags abaixo ao iniciar o Headless. Google Chrome:
- A sinalização
--no-sandbox
desativa o sandbox de segurança do Chrome, que isola as processo do navegador do restante do sistema. Executar o Chrome como raiz sem este sandbox não é suportado. - A flag
--headless=new
executa o Chrome com as melhorias novas modo headless, sem nenhuma interface visível. - A flag
--use-angle=vulkan
instrui o Chrome a usar Back-end da Vulkan para ANGLE, que converte chamadas do OpenGL ES 2/3 para chamadas da API do Vulkan. - A flag
--enable-features=Vulkan
ativa o back-end gráfico do Vulkan para composição e varredura no Chrome. - A flag
--disable-vulkan-surface
desativa o vulkanVK_KHR_surface
. extensão de instância. Em vez de usar uma cadeia de troca, A blit blit é usada para apresentar o resultado da renderização na tela. - A flag
--enable-unsafe-webgpu
ativa a API WebGPU experimental na Chrome no Linux e desativa a lista de bloqueio de adaptadores.
Agora, combinamos todas as mudanças feitas até o momento. Veja o script completo.
/* 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();
Execute o script novamente. Nenhum problema com a WebGPU foi detectado, e o valor muda de ficam desativados apenas para software.
Status do recurso gráfico | |
---|---|
OpenGL: | Desativada |
Vulkan: | Desativada |
WebGL: | Somente software, aceleração de hardware indisponível. |
WebGL2: | Somente software, aceleração de hardware indisponível. |
WebGPU: | Somente software, aceleração de hardware indisponível. |
No entanto, a aceleração de hardware ainda está indisponível, e a GPU NVIDIA T4 não está detectado.
Instalar os drivers de GPU corretos
Investigamos mais de perto a saída de chrome://gpu
com alguns especialistas em GPU
da equipe do Chrome. Encontramos problemas com os drivers padrão instalados na
Colab para Linux
exemplo, causando problemas com o Vulkan, fazendo com que o Chrome não consiga detectar o
GPU NVIDIA T4 no nível GL_RENDERER
, conforme mostrado na saída a seguir. Isso
causa problemas com o Headless Chrome.
Informações do motorista | |
---|---|
GL_RENDERER | ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (Subzero) (0x0000C0DE)), driver SwiftShader -5.0.0) |
A instalação dos drivers corretos que eram compatíveis, portanto, corrige o problema.
Informações do motorista | |
---|---|
GL_RENDERER | ANGLE (NVIDIA Corporation, Tesla T4/PCIe/SSE2, OpenGL ES 3.2 NVIDIA 525.105.17) |
Para instalar os drivers corretos, execute os comandos a seguir durante a instalação. A
as duas últimas linhas ajudam a registrar as saídas dos drivers da NVIDIA detectados
com vulkaninfo
.
apt-get install -y vulkan-tools libnvidia-gl-525
// Verify the NVIDIA drivers detects along with vulkaninfo
nvidia-smi
vulkaninfo --summary
Execute o script novamente e o resultado a seguir será exibido. 🎉
Status do recurso gráfico | |
---|---|
OpenGL: | Ativado |
Vulkan: | Ativado |
WebGL: | Aceleração de hardware, mas com desempenho reduzido. |
WebGL2: | Aceleração de hardware, mas com desempenho reduzido. |
WebGPU: | Aceleração de hardware, mas com desempenho reduzido. |
Com o uso dos drivers e sinalizações corretos ao executar o Chrome, agora temos a WebGPU e suporte a WebGL usando o novo modo headless.
Nos bastidores: investigação da nossa equipe
Depois de muita pesquisa, não encontramos métodos de trabalho para o meio ambiente necessárias para execução no Google Colab, embora houvesse postagens esperançasas que funcionava em outros ambientes, o que era promissor. No final das contas, não estávamos replicar seu sucesso no ambiente Colab NVIDIA T4, tendo 2 principais problemas:
- Algumas combinações de sinalizações permitem a detecção da GPU, mas não permitem usar a GPU.
- Exemplos de soluções de trabalho de terceiros usadas na versão headless do Chrome , que em algum momento terá seu uso suspenso em favor do nova versão. Precisávamos de uma solução que trabalharam com o novo Headless Chrome para se preparar melhor para o futuro.
Confirmamos a subutilização da GPU executando uma exemplo de página da Web do TensorFlow.js para reconhecimento de imagem, no qual treinamos um modelo para reconhecer amostras de roupas (como um mundo" do machine learning).
Em uma máquina regular, 50 ciclos de treinamento (conhecidos como períodos) precisam ser executados em menos de 1 segundo cada. Ao chamar o Headless Chrome no estado padrão, podemos registrar a saída do Console JavaScript para a linha de comando do lado do servidor Node.js rápido esses ciclos de treinamento estavam realmente tomando.
Como esperado, cada período de treinamento levou muito mais tempo do que o esperado (várias segundos), o que sugere que o Chrome voltou à execução da CPU JS simples. em vez de usar a GPU:
![Os períodos de treinamento são mais lentos.](https://developer.chrome.com/blog/supercharge-web-ai-testing/image/initial_epoch_timing.gif?authuser=19&hl=pt-br)
Depois de corrigir os drivers e usar a combinação certa de flags para o modo headless no Chrome. Executar novamente o exemplo de treinamento do TensorFlow.js gera resultados períodos de treinamento.
![Há um aumento na velocidade para períodos.](https://developer.chrome.com/blog/supercharge-web-ai-testing/image/epoch_timing_with_headless.gif?authuser=19&hl=pt-br)
Resumo
A IA da Web cresceu exponencialmente desde sua criação em 2017. Com tecnologias de navegador como WebGPU, WebGL e WebAssembly, a interface operações matemáticas podem ser ainda mais aceleradas no lado do cliente.
Em 2023, o TensorFlow.js e o MediaPipe Web ultrapassaram a marca de mais de 1 bilhão de downloads de e bibliotecas, um marco histórico e um sinal de como a Web os desenvolvedores e engenheiros estão migrando para a IA na próxima geração apps da Web para criar soluções realmente incríveis.
O uso bem-sucedido traz grandes responsabilidades. Neste nível de uso em sistemas de produção, surge a necessidade de testar IAs baseadas em navegador no lado do cliente em um ambiente de navegador real, além de ser escalonável, automatizável, e em uma configuração de hardware padronizada conhecida.
Ao aproveitar o poder combinado do novo Headless Chrome e do Puppeteer, você testar essas cargas de trabalho com confiança de forma confiável garantindo resultados consistentes e confiáveis.
Resumo
Um guia passo a passo está disponível em nossa documentação, para que você mesmo possa testar a configuração completa.
Se você achou isso útil, envie uma mensagem para LinkedIn, X (antigo Twitter) ou qualquer rede social que você usa com a hashtag #WebAI. Seria ótimo saber feedbacks que você tiver, para que possamos escrever mais coisas como esta no futuro.
Adicionar uma estrela ao repositório do GitHub para receber atualizações futuras.
Agradecimentos
Agradecemos imensamente a todos da equipe do Chrome que ajudaram a depurar o driver e Os problemas com a WebGPU que enfrentamos nessa solução, especialmente a Jecelyn Yeen e Alexandra White, por ajudar a escritor nesta postagem do blog. Graças a Yuly Novikov, Andrey Kosyakov e Alex Rudenko, que foram fundamentais na criação da solução final de trabalho.