WebGPU é a nova interface gráfica da web e já funciona em Chrome, Edge, Firefox e Safari. Para o site da sua marca, ela abre espaço para efeitos 3D mais ricos sem travar. Mas não reduz o peso dos arquivos nem acelera a primeira tela. É evolução de motor, não de roteiro.
O que é WebGPU, em uma frase?
É a forma moderna de um site conversar com a placa de vídeo do aparelho. A documentação da MDN sobre a API WebGPU a descreve como sucessora do WebGL, com melhor encaixe nas GPUs atuais e suporte de primeira classe a computação de uso geral.
A diferença prática está nessa segunda parte. O WebGL foi feito para desenhar na tela. A WebGPU desenha e também calcula: partículas, simulações, filtros de imagem e trabalhos pesados que antes ficavam no processador agora podem ir para a placa de vídeo.
Se o termo "WebGL" ainda é novo para você, o guia completo do site 3D explica o vocabulário básico antes de seguir.
A WebGPU já funciona em todos os navegadores?
Funciona nos quatro principais, com ressalvas. O post do web.dev de novembro de 2025 lista o Chrome e o Edge desde a versão 113 no Windows, macOS e ChromeOS, e no Android, a partir da versão 121, com Android 12 ou superior em aparelhos com GPU Qualcomm ou ARM; o Firefox 141 no Windows e o 145 no macOS com chip ARM; e o Safari 26 no macOS, iOS, iPadOS e visionOS.
As ressalvas importam para quem tem público amplo. O mesmo post diz que o suporte em Linux ainda está em andamento e que Macs com processador Intel ainda não têm WebGPU no Firefox. Celulares Android com outras GPUs ficam de fora.
Por isso a MDN, em outubro de 2026, ainda classifica a WebGPU como "disponibilidade limitada", e não como Baseline. Tradução para quem contrata: muitos visitantes já têm WebGPU, mas uma parte não tem. O site precisa funcionar para os dois grupos.
WebGPU vs WebGL: o que muda para o visitante?
A tabela resume o que o visitante percebe. O que ele não percebe, o fornecedor resolve por baixo.
| Aspecto | WebGL | WebGPU | O que muda para o visitante |
|---|---|---|---|
| Suporte | Praticamente universal há anos | Quatro grandes navegadores, com lacunas em Linux, Firefox em Mac Intel e parte do Android | Nada, se houver fallback; tela vazia, se não houver |
| Tipo de trabalho | Só desenho | Desenho e cálculo de uso geral na GPU | Efeitos mais densos (partículas, simulações) sem engasgar |
| Carga no processador | Mais trabalho fica na CPU | Mais trabalho pode ir para a GPU | Rolagem mais estável em cenas complexas |
| Peso dos arquivos 3D | Definido pelo modelo e pelas texturas | O mesmo | Nenhuma: o download continua igual |
| Primeira tela | Depende de HTML, imagem e carregamento adiado do 3D | O mesmo | Nenhuma: abrir rápido continua sendo decisão de projeto |
| Acessibilidade | Depende do código (reduzir movimento, foco) | O mesmo | Nenhuma: quem pede menos movimento continua precisando ser respeitado |
Fontes: suporte por navegador no web.dev, novembro de 2025; diferença entre desenho e computação na MDN, consultada em outubro de 2026. A coluna do visitante é leitura da Brave Cross.
O que muda na prática para um site de marca?
Muda o teto. Uma cena com milhares de partículas, um produto com reflexos calculados em tempo real ou um herói que reage ao cursor com física ficam mais viáveis em notebook comum. Efeitos que antes exigiam escolher entre beleza e fluidez passam a caber juntos.
Muda também o caminho das ferramentas. O three.js, biblioteca 3D mais usada na web, tem um renderizador próprio para WebGPU. A documentação oficial do WebGPURenderer diz que, quando o navegador não oferece WebGPU, ele cai para um backend WebGL 2. Na versão r186, lançada em setembro de 2026, o projeto seguiu com melhorias nesse renderizador.
Na nossa leitura, essa é a notícia mais útil: o mesmo código atende os dois mundos. Quem tem WebGPU ganha o motor novo; quem não tem continua vendo o site. Comparamos as ferramentas em three.js, Spline ou React Three Fiber.
E o que ainda não muda?
O peso. Um modelo 3D pesado continua pesado, em qualquer interface gráfica. O monólito da home da Brave Cross tem 36 KB em GLB, e esse número vem de modelagem e compressão, não do renderizador. Mostramos o processo em site 3D pesa?.
A primeira tela. O visitante julga o site antes de o 3D carregar, e isso depende de HTML leve, imagem otimizada e 3D adiado. Escrevemos sobre esse julgamento em a primeira dobra é o julgamento.
A ideia. WebGPU não escreve roteiro, não define direção de arte e não decide o que a marca quer que o visitante sinta. Um efeito mais pesado sem motivo continua sendo ruído, agora com mais partículas.
Como decidir se o seu projeto deve usar WebGPU?
Comece pela cena
descreva o efeito que a marca precisa antes de escolher a tecnologia
Pergunte pelo fallback
confirme que o renderizador cai para WebGL 2 quando não houver WebGPU
Olhe o seu público
veja no analytics a fatia de Android, Linux e Firefox em Mac Intel
Teste em aparelho comum
exija vídeo do site rodando em um celular intermediário, não só no notebook do estúdio
Meça a primeira tela
cobre que o 3D carregue depois do conteúdo principal
Reveja em seis meses
o suporte avança a cada versão de navegador, e a decisão pode mudar
Para projetos novos com three.js, faz sentido começar já no renderizador com WebGPU e fallback. Para um site em WebGL que roda bem, migrar só por migrar raramente compensa. A troca vale quando existe um efeito que o WebGL não entrega com fluidez.
Se você quer ver como um herói 3D é montado por dentro, com arquivos e camadas, abrimos o nosso em anatomia de um herói 3D. E se o seu mercado vende experiência antes da entrega, como o imobiliário, veja o site 3D como estande digital.
Perguntas frequentes
WebGPU substitui o WebGL?
É a sucessora, segundo a MDN em outubro de 2026, mas não o substitui de uma vez. O WebGL segue funcionando em praticamente todos os navegadores e continua sendo o fallback para quem ainda não tem WebGPU. Na prática, sites novos podem usar as duas: WebGPU onde existe e WebGL 2 onde não existe, com o mesmo código no three.js.
WebGPU funciona no iPhone?
Sim, a partir do iOS 26. O post do web.dev de novembro de 2025 confirma WebGPU no Safari 26 para macOS, iOS, iPadOS e visionOS. iPhones que não atualizaram para o iOS 26 ficam sem a interface nova e precisam do fallback em WebGL para ver o 3D do site normalmente.
Meu site 3D atual precisa ser refeito para WebGPU?
Não. Se o site roda bem em WebGL, ele continua rodando: nenhum navegador anunciou o fim do WebGL. A migração faz sentido quando a marca quer um efeito que o WebGL não entrega com fluidez, como simulações densas ou muitas partículas, ou num redesenho que já ia acontecer.
O site fica mais leve com WebGPU?
Não no download. O peso vem dos modelos, das texturas e do código, e isso não muda com a interface gráfica. O que pode melhorar é a fluidez em cenas complexas, porque mais cálculo vai para a placa de vídeo. Para abrir rápido, o caminho continua sendo compressão de modelos e 3D carregado depois do conteúdo.
O three.js já suporta WebGPU?
Sim. O three.js tem o WebGPURenderer, e a documentação oficial informa que ele recorre a um backend WebGL 2 quando o navegador não oferece WebGPU. A biblioteca chegou à versão r186 em setembro de 2026, com novas melhorias nesse renderizador, segundo as notas de lançamento no GitHub.
O próximo passo: motor novo, mesma pergunta
WebGPU é boa notícia para quem faz 3D na web: mais teto, menos engasgo e um caminho de transição sem abandonar ninguém. Para quem contrata, a pergunta continua a mesma de sempre: o que o visitante vai sentir, em quais aparelhos, e quanto tempo até a primeira tela aparecer.
Se você quer aprender a construir esse tipo de experiência, os cursos de Front-End e Next.js são o começo; se quer um site 3D para a sua marca, fale com a gente em /contato. Para aprender, a porta é a Brave Cross Education.
