Typst.ts is a project dedicated to bring the power of typst to the world of JavaScript. In short, it composes ways to compile and render your Typst document typically inside Browser Environment. In the scope of server-side rendering collaborated by server and browser, there would be a data flow like this:
Specifically, it first presents a typst document in three typical forms:
Form1: Renders to SVG at server side and then embeds it as a high-quality vectored image into HTML files statically.
Form2: Preprocesses to a Vector Format artifact at server side and renders it at client side (in browser).
Form3: Compiles document at client side and manipulates a canvas element at client side.
The Form2: Vector Format is developed specially for typst documents, and it has several fancy features:
So with Form2, you can continue rendering the document in different ways:
Example Application: single-file, shiroa and hexo-renderer-typst
A compressed artifact containing data for different theme and screen settings. The bundle size of artifacts is optimized for typst documents.
Example Application: typst-preview
Build a server for compilation with a rust library, streaming the artifact, and render it incrementally.
Example Application: single-file
Run the entire typst directly in browser, like typst.app.
Renderer Plugin for Hexo, a Blog-aware Static Site Generator
Renderer/Component Library for JavaScript, React, and Angular