workerd-yoga

Yoga layout for Cloudflare workerd using a static WebAssembly module.

Problem

The published yoga-layout package currently fails in Workers/workerd with:

WebAssembly.instantiate(): Wasm code generation disallowed by embedder

Workers disallow dynamic Wasm compilation from bytes at runtime. workerd can run Wasm when it is imported as a static module, because the runtime sees the .wasm artifact at bundle time instead of compiling arbitrary bytes inside request handling code.

Install

npm install workerd-yoga

Migration

-import Yoga from "yoga-layout";
+import Yoga from "workerd-yoga";

Root API

import Yoga from "workerd-yoga";

const root = Yoga.Node.create();
const header = Yoga.Node.create();
const body = Yoga.Node.create();

try {
  root.setWidth(320);
  root.setHeight(240);
  root.setFlexDirection(Yoga.FLEX_DIRECTION_COLUMN);

  header.setHeight(48);
  body.setFlexGrow(1);

  root.insertChild(header, 0);
  root.insertChild(body, 1);
  root.calculateLayout(undefined, undefined);

  console.log({
    headerHeight: header.getComputedHeight(),
    bodyTop: body.getComputedTop(),
    bodyHeight: body.getComputedHeight(),
  });
} finally {
  root.freeRecursive();
}

Always free Yoga nodes when finished. freeRecursive() releases the root and inserted descendants.

Explicit loader

The root export loads Yoga for the common case. If you want to control loading explicitly, import loadYoga() from the load subpath:

import { loadYoga } from "workerd-yoga/load";

const Yoga = await loadYoga();

Measure callbacks

Measure callbacks are synchronous, matching Yoga's layout API:

import Yoga from "workerd-yoga";

const root = Yoga.Node.create();
const text = Yoga.Node.create();

try {
  text.setMeasureFunc((width, widthMode, height, heightMode) => {
    void width;
    void widthMode;
    void height;
    void heightMode;
    return { width: 37, height: 19 };
  });

  root.insertChild(text, 0);
  root.calculateLayout(undefined, undefined);

  console.log(text.getComputedWidth(), text.getComputedHeight());
} finally {
  root.freeRecursive();
}

How it works

workerd-yoga vendors the Yoga 3.2.1 Emscripten JavaScript wrapper and imports the official Yoga .wasm file as a static module. In Workers/workerd, that static .wasm import is provided to JavaScript as a WebAssembly.Module. The adapter passes the module through Emscripten's instantiateWasm hook and creates the runtime with new WebAssembly.Instance(...), avoiding runtime byte compilation.

Compatibility

• Yoga version: 3.2.1 only.
• Runtime target: Cloudflare Workers/workerd only.
• Node and browsers are used for development checks where useful, but this package does not promise a production Node or browser runtime.

Artifact provenance

The vendored Wasm artifact is the Yoga 3.2.1 package artifact with:

• Byte length: 71736
• SHA-256: 7ba9c9483c8c38a468e9aef4a95ed72fad8a43594be8e5123eb3bdb6479edf5b

Generation and verification scripts pin and check the downloaded artifact identity.

Stable-only policy and non-goals

This package tracks stable Yoga releases only. It is not a fork for experimental Yoga changes, unstable Emscripten output, alternative layout engines, or runtime-specific behavior beyond adapting the stable Yoga package to workerd static Wasm imports.

Non-goals include:

• Reimplementing Yoga.
• Changing Yoga API semantics.
• Supporting arbitrary Yoga versions at runtime.
• Promising browser or Node production compatibility.

Development

npm run generate:check
npm run check

Focused commands:

npm run lint
npm run fmt:check
npm run build
npm run dist:check
npm run pack:check
npm run types:lint
npm run typecheck
npm run test:node
npm run test:workers
npm run pack:consumer

npm run check is the canonical complete verification command.

Security

Report security vulnerabilities through GitHub private vulnerability reporting. Do not disclose vulnerabilities in public issues.

License

workerd-yoga is an independent project. It is not official Meta, React, or Cloudflare software.

The adapter code is MIT licensed. Yoga is MIT licensed; see LICENSE.yoga for the upstream Yoga license.