{"slug": "show-hn-typst-wasm-compile-typst-in-browsers-node-and-serverless-runtimes", "title": "Show HN: Typst-WASM – Compile Typst in browsers, Node, and serverless runtimes", "summary": "Typst-WASM, a WebAssembly-based compiler for the Typst document typesetting system, has been released for browsers, Node.js, and serverless runtimes including Cloudflare Workers and Vercel. The project also introduces a Vite plugin for integrating Typst's HTML output into web applications, enabling server-side rendering and AI agent sandbox usage.", "body_md": "today i am releasing typst-wasm and an experimental version of vite-plugin-typst!\n\nthe goal of this project is to provide a pragmatic promise based API for compiling typst using wasm in as many runtimes as possible.\n\nthe api is consistent across all supported runtimes and closely mirrors what you see in the rust crate. it gives you full control over where and how you load the wasm blobs, which allows you to provide the best possible user experience.\n\nrunning typst in wasm/serverless environments like cloudflare workers or vercel allows you to do SSR, easily offload compilation to the server for low bandwidth devices while reusing code, run typst in sandboxes for AI agents, etc.\n\nhere's an example of the API:\n\n``` await compiler.addFonts( readFile(new URL(import.meta.resolve( \"@typst-wasm/fonts/NewCMMath-Regular.otf\", ))), );\n\nawait compiler.addSource(\"main.typ\", \"= Hello from typst-wasm!\"); const result = await compiler.compile({ main: \"main.typ\", format: \"svg\", });\n\nconsole.log(result.pages[0]?.output); ```\n\nhow does it differ from typst.ts?\n\nthe goals are different! typst-wasm aims to support many runtimes and provide a consistent api without the use of deprecated APIs.\n\n@typst-wasm/vite-plugin-typst\n\nI am also releasing vite-plugin-typst, built on typst-wasm, to provide an easy way to use the new html output in your vite apps! to give you ideas, this is a cool alternative to markdown for content in vite-based websites/blogs!\n\n``` import typstDocument from \"./post.typ?typst=html\";\n\ndocument.querySelector(\"#output\")!.innerHTML = typstDocument.html; ```\n\nlinks and examples for you to look at !\n\n* GitHub: [https://github.com/typst-wasm/typst-wasm](https://github.com/typst-wasm/typst-wasm)\n\n* npm — typst-wasm: [https://www.npmjs.com/package/typst-wasm](https://www.npmjs.com/package/typst-wasm), vite-plugin-typst: [https://www.npmjs.com/package/@typst-wasm/vite-plugin-typst](https://www.npmjs.com/package/@typst-wasm/vite-plugin-typst)\n\n* Docs: [https://typst-wasm.github.io/typst-wasm/](https://typst-wasm.github.io/typst-wasm/)\n\n* example blog: [https://typst-wasm-blog.will-bradshaw50.workers.dev/](https://typst-wasm-blog.will-bradshaw50.workers.dev/)\nsource: [https://github.com/typst-wasm/typst-wasm/tree/main/packages/...](https://github.com/typst-wasm/typst-wasm/tree/main/packages/example-typst-blog)\n\n* example typst-wasm playground with SSR'd typst on cloudflare workers: [https://typst-wasm-playground-cloudflare.will-bradshaw50.wor...](https://typst-wasm-playground-cloudflare.will-bradshaw50.workers.dev/)\nsource: [https://github.com/typst-wasm/typst-wasm/tree/main/packages/...](https://github.com/typst-wasm/typst-wasm/tree/main/packages/example-typst-playground-cloudflare)\n\n* example typst-wasm playground with SSR'd typst on vercel: [https://example-typst-playground-vercel.vercel.app/](https://example-typst-playground-vercel.vercel.app/)\nsource: [https://github.com/typst-wasm/typst-wasm/tree/main/packages/...](https://github.com/typst-wasm/typst-wasm/tree/main/packages/example-typst-playground-vercel)\n\n* simple node example\nsource: [https://github.com/typst-wasm/typst-wasm/tree/main/packages/...](https://github.com/typst-wasm/typst-wasm/tree/main/packages/example-node)\n\n* my own website: [https://w.bradshaw.page/](https://w.bradshaw.page/)\nsource: [https://github.com/wra-bradshaw/personal-website](https://github.com/wra-bradshaw/personal-website)\n\nComments URL: [https://news.ycombinator.com/item?id=48947016](https://news.ycombinator.com/item?id=48947016)\n\nPoints: 1\n\n# Comments: 0", "url": "https://wpnews.pro/news/show-hn-typst-wasm-compile-typst-in-browsers-node-and-serverless-runtimes", "canonical_source": "https://typst-wasm-playground-cloudflare.will-bradshaw50.workers.dev/", "published_at": "2026-07-17 13:12:27+00:00", "updated_at": "2026-07-17 13:20:51.894784+00:00", "lang": "en", "topics": ["developer-tools"], "entities": ["Typst-WASM", "Cloudflare Workers", "Vercel", "Vite"], "alternates": {"html": "https://wpnews.pro/news/show-hn-typst-wasm-compile-typst-in-browsers-node-and-serverless-runtimes", "markdown": "https://wpnews.pro/news/show-hn-typst-wasm-compile-typst-in-browsers-node-and-serverless-runtimes.md", "text": "https://wpnews.pro/news/show-hn-typst-wasm-compile-typst-in-browsers-node-and-serverless-runtimes.txt", "jsonld": "https://wpnews.pro/news/show-hn-typst-wasm-compile-typst-in-browsers-node-and-serverless-runtimes.jsonld"}}