Mål, nøglebegreber og brugssager

Har du undret dig over WASMs nøglekoncepter og Use cases? Hvis ikke, har vi dækket dig.

WebAssembly (WASM) er et nyt sprog på lavt niveau, der lader dig fjerne blokeringen af ​​native-lignende ydeevne på nettet.

I WebAssembly for begyndere – del 1 introducerede vi WASM fra et begynderperspektiv ved at dække dets definition og begrænsninger. Derudover gennemgik vi WebAssembly-funktioner, WASM-køreplan og hvordan JavaScript fungerer med WebAssembly, og ikke imod det.

Dette indlæg vil udforske WebAssembly ved at diskutere WASM-mål, nøglekoncepter og use cases. Vi vil også tage et kig på nogle af dets spændende projekter.

Lad os komme igang.

WebAssembly mål

For at forstå WebAssembly nøglebegreber skal vi først se på dets mål. Disse mål omfatter:

  • Evne til at drage fordel af tilgængelig hardware ved at bruge indlæsningstid og størrelseseffektivt binært format som et kompileringsmål. Med enkle ord bruger WASM et abstrakt syntakstræ (AST) i binært format, der understøtter kompilering og udførelse ved naturlig hastighed. Ved at bruge tilgangen kan WASM udføre på forskellige enheder, herunder IoT, web og mobil.
  • WASM’s mål er ikke at ændre eller ændre den eksisterende webplatform. Med denne tilgang kan WebAssembly godt integreres med det nuværende og tidligere web. Det gør det også muligt for WebAssembly at arbejde problemfrit med JavaScript, herunder eksekvering ved siden af ​​eller foretage synkrone opkald fra JavaScript.
  • At arbejde problemfrit med tilladelsessikkerhedspolitikker og samme oprindelse.
  • Sørg for, at udviklere kan designe deres løsninger til at understøtte ikke-browserindlejringer.
  • Til sidst giver udviklere værktøjerne til at arbejde effektivt med WebAssembly-kildekoden ved at levere et menneskeligt redigerbart tekstformat.
  10 Open Source Load Balancer til HA og forbedret ydeevne

WebAssembly nøglebegreber

Inde i emhætten følger WebAssembly følgende trin:

  • Først skal du skrive kode i et statisk skrevet sprog med definerede typer.
  • Når du er færdig, genererer du et præ-kompileret WASM-modul og fører koden ind i motorkompileren.
  • Ovenstående trin sikrer, at WASM springer parsing over og gør koden klar til at blive gengivet i webbrowseren.

Nøglekoncepterne bag WebAssembly kører i webbrowseren inkluderer:

  • Hukommelse: Hukommelsen i WebAssembly administreres og skrives af dens hukommelsesadgangsinstruktioner på lavt niveau. Teknisk set er det en ArrayBuffer, der kan ændres størrelse, og den indeholder en række hukommelsesbytes.
  • Modul: Modulet i WebAssembly er en kompileret eksekverbar computerkode. På grund af dens statsløse form kompilerer webbrowseren modulet og deler det mellem Windows og Workers. Modulet lagrer og erklærer også import og eksport, ud over at rumme funktioner, tabeller, typer, globaler og hukommelse.
  • Tabel: En tabel består af alle referencer og funktioner ved hjælp af et array, der kan ændres. Dette fjerner behovet for at gemme rå bytes i hukommelsen.
  • Forekomst: I WASM er en forekomst et modul under kørsel, med alle tilstande parret. Disse tilstande inkluderer tabel, hukommelse og andre importerede værdisæt.

WASM nøglekoncepter

Som webudvikler kan du bruge JavaScript API til at kalde og definere moduler, tabeller, forekomster og tabeller. Desuden bruger du JavaScript til at kalde WASM-eksporter synkront inden for JavaScript-funktionerne. Derfor spiller JavaScript godt sammen med WebAssembly, da du kan bruge WASM til at skrive højtydende applikationer i webbrowseren.

WASM objekter

Når du arbejder med WebAssembly, skal du holde styr på otte WASM-objekter. Disse objekter omfatter:

  • WebAssembly.Global – Det globale objekt er en global variabel instans. Det er tilgængeligt af både WebAssembly.Module og JavaScript.
  • WebAssembly.Module – Her indeholder modulobjektet den statsløse WASM-kode. Koden er prækompileret.
  • WebAssemly.Instance – WebAssembly.Instance er den eksekverbare, stateful instans af WebAssembly.Module.
  • WebAssembly.Table – Table-objektet indeholder funktionsreferencer og fungerer som en JavaScript-indpakning.
  • WebAssembly.CompileError – CompileError-objektet indeholder alle fejl under validering og afkodning.
  • WebAssembly.RuntimeError – Her viser RuntimeError-objektet alle runtime-fejl.
  • WebAssembly.LinkError – LinkError-objektet indeholder fejl, der finder sted under instansiering af modulet.
  11 bedste proxybrowsere til online privatliv

WASM Use-Cases og projekter

Vi ved allerede, at WebAssembly tilbyder native-lignende ydeevne i webbrowseren. Men for virkelig at forstå, hvor du kan bruge det, skal du se på dets use cases. Lad os nedenfor liste nogle få af WASM-brugstilfældene.

WebAssembly use cases spænder både i og uden for browseren. For eksempel, hvis du vil bruge WASM i en browser, kan du gøre en masse ting, herunder:

  • Video- eller lydredigering, såsom ffmpegwasm-projektet.
  • Videospil i webbrowseren, såsom disse højtydende spil.
  • Videnskabelig visualisering og simulering
  • Platformemulering/simulering såsom DOSBox, MAME osv.
  • Kryptering
  • Fjernskrivebord
  • Udviklerværktøj

Brug Cases

Fra et generelt synspunkt omfatter WebAssemblys overbevisende use cases

  • Evnen til at skrive hurtigere kode kan drage fordel af den underliggende hardware.
  • Derudover kan du også lave komprimering på klientsiden, hvilket resulterer i bedre indlæsningstid og båndbreddebesparelser. Så du bruger klientens CPU eller underliggende hardware til at komprimere og udkomprimere, og derefter bruge serverens ressourcer.
  • Derudover kan du bruge forskellige programmeringssprog til at skrive kode til nettet, bortset fra blot at bruge JavaScript. For eksempel kan du bruge Rust, C og C++ til at skrive højtydende kode til visse aspekter af dine webapplikationer.
  Sådan installeres drivere i Ubuntu

Projekter

Hvis vi går over til eksempler fra den virkelige verden, er følgende projekter værd at nævne.

  • Figma forbedrede sin webapp-ydeevne med WebAssembly-brug. De reducerede indlæsningstiden under app-initialisering, hele designgengivelsen og endda download af en designfil. Som vi diskuterede tidligere, er WebAssembly også fantastisk til komprimering. Figma implementerede WASM for at forbedre downloadstørrelsen, hvilket reducerede dem betydeligt.
  • Pyodide: Et andet spændende WASM-projekt er Pyodide-projektet, som blev frigivet fra Mozilla. Det gør det muligt for forskere at kompilere Python videnskabelige stack til WebAssembly, inklusive NumPy, SciPy, Scikit-learn osv., til browseren. Det tilbyder en gennemsigtig objektkonvertering mellem Python og JavaScript. Endelig giver det også udviklere mulighed for at bruge web-API’er ved hjælp af Python.
  • Brazor WebAssembly: Brazor WebAssembly-rammen giver udviklere mulighed for at bygge enkeltside, klientside og interaktive webapps med .NET. Du kan hoste disse apps til browseren med den WebAssembly-baserede .NET runtime. Her får du som udvikler adgang til browserfunktionalitet i din .NET-kode ved hjælp af WebAssemblys JavaScript API’er.

Kilde: Figma

Andre mange kendte og værdige projekter bruger WebAssembly. Disse er Binaryen, Cheerp, Forest, Grain og andre.

Afsluttende tanker

WebAssembly er ikke ligefrem begyndervenlig. Men ved at studere dens use cases og nøglekoncepter kan du tydeligt forstå dens kapacitet.

Med spændende projekter på markedet er det det bedste tidspunkt at lære WebAssembly, især hvis du er i webudvikling. WASM’s evne til at arbejde uden for browseren gør den også til et fremragende valg til præstationsorienteret udvikling.

Nydt at læse artiklen? Hvad med at dele med verden?