NOTE

Turn this into a polished blog post.

This is a blogpost demoing dom bindings with grain which may also turn into a talk at wasmIO

Introduction

Today we will be showing off the state of wabassembly components by building a basic dom application with

WalkThrough

Installation

wasm-tools wit-bindgen grain npm

Resources

Wasi Adapter Web bindings

Setting up our workspace

init vite repo generate our bindings

Building our bindings

We have life

just a simple test to make sure jco and vite are working correctly

A tiny dom library

let’s build a super quick dom library

Payoff

Now that we have a dom library let’s do some basic dom manipulation.

Final Result

Let’s take a look

Where does this leave us

Highlight the fact that this is all preproduction, (Maybe dream about a better world) Even in a pre-production state we just showcased how quickly everything can be set up. (It may take a little bit to understand the tools but things are already awesome) The dom is just the tip of the ice-berg in grain we have already used wit to generate bindings between various different languages and with various different host projects (Maybe mention marcus’s work with the lsp host)

Table Of Contents

TODO

  • Wasi Adapater
  • Wasm Component
  • Wit
    • Interface
    • world
    • import