Runtimes

takumi-js has two backends and picks one for you. Import render or ImageResponse. It detects the runtime, loads the right binding, and sets it up. You just install the package for your target.

Node.js

@takumi-rs/core runs on Node.js. It's a native binary with multithreading, and the fastest backend. takumi-js loads it on every Node process. On Node it's required: if it fails to load, Takumi throws instead of falling back.

Some bundlers try to trace into the native binary. On Next.js, mark it external:

const config = {
  serverExternalPackages: ["@takumi-rs/core"],
};

export default config;

Edge & browser

For Cloudflare Workers, Vercel Edge, Deno, and the browser, install the WebAssembly binding:

npm i @takumi-rs/wasm@beta

takumi-js detects these runtimes and loads the WASM binding for you. It runs the async init too. Your render code is the same as on Node.

On WASM, WebP is always lossless. The quality and lossless options are native-only. See Output Formats.

Choosing a binding by hand

To skip detection, import a backend directly. takumi-js/node is @takumi-rs/core. takumi-js/wasm is @takumi-rs/wasm. If you import WASM yourself, call init before the first render:

import init, { Renderer } from "takumi-js/wasm";

await init();
const renderer = new Renderer();