Nooit meer een langzame website met WebAssembly?

Wat is WebAssembly?

WebAssembly is een soort code die gerund kan worden in alle moderne browsers – net als JavaScript. Echter, in tegenstelling tot JavaScript is WebAssembly gecompileerd naar binaire code vanaf een andere programmeertaal.

Een van de doelen van WebAssembly is dan ook om het mogelijk te maken om code geschreven in jouw favoriete programmeertaal te kunnen runnen in je browser. Zo is er al de mogelijkheid om allerlei talen te compileren, waaronder C#, Go, Rust, Kotlin, en nog veel, veel meer.

Wat kan je ermee?

In het kort: alles. Of tenminste, alles wat je ook met JavaScript kan. De browser speelt ook met WebAssembly een belangrijke rol: zorgen dat code binnen een sandbox draait, en websites dus niet zomaar alles op je computer kunnen.

Een van de voordelen is dat de performance van WebAssembly in veel gevallen beter is dan JavaScript. Verder is het – afhankelijk van je voorkeur – prettig dat je niet meer vast zit aan JavaScript, maar frontend code kan schrijven in elke taal die naar WebAssembly kan compileren. Je bent echter niet snel helemaal van JavaScript af, omdat je vaak nog steeds interacties moet hebben met het HTML-document – of DOM. Veel talen die naar WebAssembly compileren hebben hiervoor een bridge die de vertaalslag kan maken van JavaScript-objecten naar de taal waar je in werkt – en andersom.

Voortaan alle frontend code in WebAssembly?

Er zijn verschillende libraries die precies dit doel hebben. De bekendste is waarschijnlijk Blazor voor C#, wat onderdeel is van ASP.NET Core. Dit is dan ook direct het meest stabiele en waarschijnlijk enige production-ready framework.

Ook in andere talen zijn er verschillende initiatieven en projecten. Zo heb je voor Go onder andere Vugu en Vecty, libraries die respectievelijk door Vue en React geïnspireerd zijn, in Rust is Yew verreweg het grootste project, en zo zijn er waarschijnlijk nog tientallen anderen. Echter, een gedeeld probleem van veel van deze frameworks is dat ze relatief nieuw, en grotendeels experimenteel zijn.

Your mileage may vary, maar ik zou op dit moment niet snel een frontend-project opzetten in iets anders dan JavaScript (eigenlijk TypeScript) – of misschien Blazor. React en Vue zijn twee frameworks die al ongeveer 10 jaar bestaan, stabiel en battle-tested zijn, en zich op grote schaal bewezen hebben, dus dat daar zou mijn voorkeur naar uitgaan. Maar dat betekent absoluut niet dat WebAssembly niet nuttig is…

Wat kan je echt met WebAssembly?

Een van de voordelen die vaak genoemd wordt is de betere performance van WebAssembly ten opzichte van JavaScript. Dit kan zeker nuttig zijn op het moment dat je een computationeel zware webapplicatie hebt voor bijvoorbeeld foto- of video-editing, natuurkundige simulaties, emulatie, etc. Echter, voor veel “simpelere” webapplicaties zal dit vaak niet zijn waar eventuele traagheid vandaan komt. Dit zit hem over het algemeen eerder in API-calls die naar de server gedaan worden, wat niet sneller wordt met WebAssembly.

Iets wat vaak significant makkelijker is in andere talen dan JavaScript is parallelisme. Als je heel veel operaties hebt die op zichzelf niet heel zwaar zijn, kan WebAssembly alsnog betere performance leveren door deze parallel uit te voeren.

Wanneer je een stuk logica geïmplementeerd hebt in een bepaalde taal kan het ook nuttig zijn om deze logica niet opnieuw te hoeven implementeren in JavaScript, maar gewoon je bestaande code in de browser te kunnen gebruiken. Dit is vooral relevant wanneer je stukken logica hebt die niet alleen in de browser, maar ook op een server, mobiele app, of andere plekken hetzelfde moet zijn. Denk hierbij bijvoorbeeld aan een communicatie-protocol, of een encoding/decoding strategie.

In conclusie

WebAssembly is – zoals bijna altijd het geval is – niet de enige tool die je ooit nog nodig gaat hebben, maar het heeft zeker een plek in de frontend-wereld. Zoals het er nu naar uitziet zal WebAssembly niet snel grote delen JavaScript gaan vervangen, maar zullen ze naast elkaar blijven werken. Dat is ook feel van de filosofie: het is gemaakt als aanvulling op JavaScript, niet als vervanging.