Como o WebAssembly Está Revolucionando o Desenvolvimento Web

Eu não cheguei a utilizar WebAssembly em um projeto próprio e, por isso, este não é um relato de experiência ou um tutorial baseado em algo que implementei. A proposta aqui é outra: entender o que realmente é o WebAssembly, por que ele surgiu, onde já pode ser utilizado e até onde faz sentido dizer que ele está mudando o desenvolvimento de aplicações.

E existe uma diferença importante entre dizer que uma tecnologia está ganhando espaço e afirmar que ela vai substituir tudo o que usamos atualmente.

No caso do WebAssembly, a própria documentação deixa claro que ele foi projetado para trabalhar ao lado do JavaScript, e não para simplesmente substituí-lo.

WebAssembly é um formato de código de baixo nível, normalmente chamado de Wasm, criado inicialmente com a web em mente. Em vez de ser uma linguagem que o desenvolvedor normalmente escreve diretamente, ele funciona como um alvo de compilação para linguagens como C, C++, Rust e outras.

A ideia é permitir que determinados tipos de código sejam executados no navegador com desempenho próximo ao nativo, aproveitando características que seriam difíceis de obter utilizando apenas JavaScript em determinados cenários.

Isso é particularmente interessante para aplicações que exigem bastante processamento, como jogos, edição de imagens e vídeos, processamento de dados, visão computacional, simulações e outras tarefas que podem exigir muito da máquina do usuário.

Mas existe um detalhe que considero fundamental para entender o WebAssembly:

ele não foi criado para acabar com o JavaScript.

Essa talvez seja uma das maiores confusões quando alguém começa a pesquisar sobre WebAssembly.

É fácil encontrar explicações que apresentam o Wasm como o próximo passo depois do JavaScript, quase como se uma tecnologia estivesse esperando a outra desaparecer.

Não é essa a proposta.

WebAssembly e JavaScript podem trabalhar juntos. Um aplicativo web pode utilizar JavaScript para a interface e para a comunicação com as APIs do navegador, enquanto módulos WebAssembly ficam responsáveis por determinadas tarefas que se beneficiam de um formato de execução de baixo nível.

A própria MDN descreve essa relação como complementar: o JavaScript continua oferecendo flexibilidade, expressividade e um enorme ecossistema, enquanto o WebAssembly fornece uma alternativa de baixo nível voltada para determinados cenários de desempenho.

Isso muda bastante a maneira de enxergar a tecnologia.

Em vez de perguntar:

"O WebAssembly vai substituir o JavaScript?"

Talvez a pergunta mais interessante seja:

"Em quais partes de uma aplicação vale a pena utilizar WebAssembly junto com JavaScript?"

Uma das características mais importantes do WebAssembly é seu formato binário compacto e sua capacidade de executar código com desempenho próximo ao nativo em determinados cenários.

Isso abriu espaço para levar para a web aplicações e bibliotecas que anteriormente dependiam muito mais de tecnologias nativas ou de adaptações específicas para o navegador.

Um exemplo simples seria uma aplicação de edição de imagens.

Uma aplicação desse tipo pode utilizar JavaScript para cuidar da interface, dos botões, dos menus e da interação com o usuário, enquanto uma parte pesada do processamento poderia ser executada através de WebAssembly.

O mesmo raciocínio pode ser aplicado a jogos, processamento de áudio e vídeo, simulações, ferramentas de engenharia, aplicações científicas e outros sistemas que realizam operações intensivas.

A documentação oficial do WebAssembly lista justamente esse tipo de cenário entre seus casos de uso, incluindo jogos, edição de imagem e vídeo, reconhecimento de imagens, CAD, visualização científica, emulação e ferramentas para desenvolvedores.

Quando pensamos em WebAssembly, é comum imaginar imediatamente uma página da internet executando um módulo .wasm.

Esse continua sendo um dos principais cenários, mas não é o único.

Aplicações no navegador

No navegador, WebAssembly pode ser utilizado como parte de uma aplicação web.

Um módulo pode ser carregado por JavaScript e suas funções podem ser utilizadas pela aplicação. Isso permite combinar as características das duas tecnologias em um mesmo projeto.

Esse modelo é interessante principalmente quando existe uma parte específica do sistema que exige bastante processamento.

Alguns exemplos incluem:

• edição de imagens;
• processamento de vídeo;
• jogos;
• simulações;
• reconhecimento de imagens;
• aplicações científicas;
• ferramentas de engenharia e CAD;
• emuladores;
• processamento de áudio;
• ferramentas de desenvolvimento.

Não significa que todos esses sistemas precisem utilizar WebAssembly. A tecnologia é uma opção que pode fazer sentido quando existe uma necessidade concreta.

Aplicações fora do navegador

É aqui que o assunto fica ainda mais interessante.

Apesar de ter sido criado pensando na web, WebAssembly também pode ser executado em ambientes que não são navegadores.

A documentação oficial cita ambientes como servidores, dispositivos IoT e aplicações para desktop e dispositivos móveis. Também existem esforços relacionados ao WASI, um conjunto de APIs voltado para utilização do WebAssembly em ambientes fora do navegador e de engines JavaScript.

Isso amplia bastante a ideia original que muitas pessoas têm sobre o Wasm.

Ele não precisa necessariamente significar:

"JavaScript rodando dentro de uma página."

Podemos pensar nele também como uma forma portátil de executar determinados tipos de código em diferentes ambientes.

Outra característica interessante é que o desenvolvedor não precisa necessariamente escrever WebAssembly manualmente.

Uma das propostas da tecnologia é justamente funcionar como destino de compilação.

É possível, por exemplo, escrever código em C, C++, Rust e outras linguagens e compilá-lo para WebAssembly. Ferramentas como o Emscripten também permitem levar código C e C++ para o ambiente Web.

Isso cria uma possibilidade muito interessante: bibliotecas e partes de sistemas desenvolvidos originalmente para outros ambientes podem, em determinados casos, ser aproveitados em aplicações web.

Para quem desenvolve aplicações, isso pode representar uma vantagem importante quando já existe uma biblioteca madura em outra linguagem e seria muito trabalhoso reimplementar toda aquela lógica em JavaScript.

É justamente aqui que eu acho importante colocar um pouco de cautela na discussão.

É fácil olhar para o WebAssembly e imaginar que qualquer aplicação ficaria automaticamente mais rápida simplesmente por utilizar Wasm.

Não é tão simples.

Existe custo de carregamento, compilação, comunicação entre JavaScript e WebAssembly e toda a arquitetura envolvida na aplicação. Além disso, nem toda tarefa possui características que justificam utilizar uma tecnologia de baixo nível.

Se uma aplicação é predominantemente composta por regras de interface, formulários, requisições HTTP e manipulação do DOM, por exemplo, não existe necessariamente uma razão para transformar tudo em WebAssembly.

O ganho depende do problema.

Essa é uma diferença importante entre uma tecnologia possuir potencial de desempenho e uma aplicação inteira ficar automaticamente mais rápida ao utilizá-la.

Depois de pesquisar sobre o assunto, eu teria cuidado com essa afirmação.

Não acho que seja correto dizer que o WebAssembly simplesmente chegou para substituir o modelo atual de desenvolvimento web.

Por outro lado, também seria um erro tratá-lo apenas como uma curiosidade técnica.

O que considero realmente interessante é que ele ampliou as possibilidades da plataforma.

Hoje, o navegador não precisa ficar limitado ao tipo de processamento que tradicionalmente associamos ao JavaScript. É possível combinar JavaScript e WebAssembly, aproveitar código escrito em outras linguagens e levar determinados tipos de processamento pesado para aplicações que antes teriam limitações maiores nesse sentido.

E a possibilidade de utilizar WebAssembly também fora do navegador torna o cenário ainda mais interessante.

A própria documentação do projeto apresenta casos de uso para processamento server-side, aplicações de servidor e execução de código em ambientes que não são necessariamente browsers.

Essa é provavelmente a distinção que mais faltava nas discussões exageradas sobre WebAssembly.

Já é realidade:

• WebAssembly é suportado pelos principais navegadores modernos;
• módulos WebAssembly podem ser carregados e utilizados por aplicações JavaScript;
• linguagens como C, C++ e Rust podem ter código compilado para WebAssembly;
• existem casos de uso em jogos, processamento de mídia, computação e outras aplicações;
• WebAssembly também pode ser executado em ambientes fora do navegador.

Esses pontos estão documentados tanto pela MDN quanto pelo próprio projeto WebAssembly.

O que merece cautela:

• afirmar que WebAssembly vai substituir JavaScript;
• tratar qualquer aplicação como candidata automática ao uso de Wasm;
• prometer ganhos de desempenho sem considerar o cenário específico;
• usar números de benchmarks isolados como se fossem resultados universais;
• assumir que utilizar uma tecnologia de baixo nível significa automaticamente ter uma aplicação melhor.

Esse último ponto é importante. Uma tecnologia não é boa apenas porque é tecnicamente poderosa; ela precisa resolver um problema real.

Mesmo sem ter utilizado WebAssembly em um projeto próprio, foi justamente durante a pesquisa para este artigo que comecei a enxergar a tecnologia de uma maneira diferente.

O mais interessante não é simplesmente a possibilidade de executar código mais próximo do desempenho nativo dentro do navegador.

É a possibilidade de aproximar mundos que tradicionalmente ficaram separados.

Uma biblioteca desenvolvida em outra linguagem pode, dependendo do cenário, chegar à aplicação web. Um processamento pesado pode ser separado da camada de interface. Uma mesma tecnologia pode encontrar espaço no navegador, no servidor ou em outros ambientes.

Isso não significa que o WebAssembly será a resposta para todos os problemas de desenvolvimento.

Mas significa que existe uma nova peça no nosso conjunto de ferramentas.

Se eu estivesse avaliando a tecnologia para um projeto hoje, não começaria perguntando:

"Como posso colocar WebAssembly aqui?"

Eu começaria perguntando:

"Existe alguma parte deste sistema que realmente se beneficiaria dele?"

A partir daí, eu avaliaria o custo de implementação, a complexidade adicional, a comunicação com JavaScript, o tamanho dos módulos, a necessidade de manutenção e principalmente o ganho real obtido.

Se o problema puder ser resolvido de maneira simples utilizando JavaScript ou outra tecnologia já adotada pelo projeto, talvez não exista motivo para adicionar complexidade.

Se existir uma tarefa pesada, uma biblioteca que já existe em outra linguagem ou uma necessidade específica de portabilidade e desempenho, aí sim WebAssembly passa a ser uma alternativa muito interessante para investigar.

WebAssembly não precisa substituir o JavaScript para ser importante.

Na verdade, talvez sua maior contribuição para o desenvolvimento web seja justamente permitir que as duas tecnologias trabalhem juntas.

O navegador continua sendo um ambiente extremamente poderoso, mas agora possui mais uma opção para lidar com determinados tipos de processamento e aplicações que exigem características diferentes das oferecidas tradicionalmente pelo JavaScript.

Por isso, eu prefiro dizer que o WebAssembly está ampliando as possibilidades do desenvolvimento web em vez de afirmar que ele está simplesmente "matando" ou substituindo tecnologias existentes.

E talvez essa seja a parte mais interessante dessa história: não sabemos exatamente até onde o WebAssembly vai chegar, mas já é possível enxergar que ele deixou de ser apenas uma promessa.

E você?

Já utilizou WebAssembly em algum projeto? Trabalha com Rust, C/C++ ou outra linguagem que possa ser compilada para Wasm?

Se você já teve uma experiência prática com a tecnologia, conte nos comentários. Uma experiência real pode ajudar a complementar este artigo e mostrar casos de uso que não aparecem apenas na documentação.

Se você trabalha com desenvolvimento, tecnologia, games ou cultura geek e gostaria de compartilhar conhecimento e experiências com a comunidade, o Nerd Cult está aberto a colaborações.

Se tiver uma experiência interessante, um projeto, uma ferramenta ou um assunto que gostaria de apresentar aos leitores, entre em contato com a gente.

Gostou do conteúdo?

Compartilhe este artigo com outros desenvolvedores que possam se interessar pelo assunto e continue acompanhando o Nerd Cult para mais conteúdos sobre tecnologia, programação, games e cultura geek.

Nerd Cult — onde o código encontra o rock, o cinema e a cultura geek. Porque ser nerd é transformar o medo em curiosidade, e a curiosidade em poder.

#WebAssembly #Wasm #JavaScript #DesenvolvimentoWeb #NerdCult