Does MathJax/KaTeX-like math typesetting for the web, but with Typst math syntax, exist?

In the LaTeX world, we have MathJax and KaTeX to beautifully typeset math on the web. I would love to see equivalent projects for the Typst world since I love the simplicity of the Typst math syntax.

For KaTeX, see this discussion I’ve opened there.

5 Likes

well, you can already already sort of do this through HTML export and frames, which will inline an SVG:

#html.frame($ 2 + 2 = 4 - 1 = 3$)
quick mafs

though the text doesn’t seem to be selectable (which is probably easy to fix).

more generally, you could integrate typst with whatever other markup language or framework you’re using. see for example astro-typst.

note that it wouldn’t be practical to use the typst compiler to render math at client-side as it’s several megabytes large. this is a more general opinion, but the much better approach is to either render at server-side (SSR), or statically generate (SSG), which is naturally the approach that typst uses (because it’s a document generator).

i don’t think KaTeX will (or should) be interested in implementing a custom typst parser just to render math. instead, the typst compiler should directly implement better equation output for HTML. but this is probably a ways to go.

given that this seems to be more about the nice syntax than the various other improvements over *TeX, you could use tex2typst to preprocess your typst math into tex math at server-side, then use whatever you want to render this tex code.

1 Like

To add to @cAtte answer, Typst will eventually support HTML equations using MathML Core.
There was a showcase on Discord a few months ago of a package that partly implements HTML math export: akida/mathyml: Convert your equations to MathML - Codeberg.org

4 Likes

AFAIK, ther is no easy generic solution you can just plug in to your website. But there are some things you can try:

Any news on this?

Would be awesome to have a KaTeX version of Typst math that you can just import in the head of you html page and start writing something like

Bla bla $E=mc^2$ Bla bla

and it automatically renders (the js library generates the corresponding DOM elements).

Whilst this isn’t quite the same, progress is being made on MathML Core output for equations in HTML export, see https://github.com/typst/typst/pull/7436. The main prerequisite Add a math IR by mkorje · Pull Request #7435 · typst/typst · GitHub should land very soon.

3 Likes

I just found wypst.

Yeah but this is not scalable. Also any basic thing like e^(i pi)+1=0 can’t be done (not handling parentheses correctly).

What I wonder is what would be needed to create a Kypst or similar (KaTeX-like version of Typst) that can be run client-side. On the one hand the Typst HTML export is getting more solid, meaning the proper CSS is already known, however the Typst compiler is too large for client-side applications.

So I guess it would be either creating a javascript library from scratch that recreates the HTML export of the typst compiler (difficult to mantain, but KaTeX seems to do it with TeX). Or… creating a minimal version of the Typst compiler, only focused on math. How viable would that second option be?

creating a javascript library from scratch that recreates the HTML export of the typst compiler

I agree. Also, I was thinking of using tex2typst’s typst parser to convert typst AST to KaTex AST, but it is a conversion after all.

Or… creating a minimal version of the Typst compiler, only focused on math. How viable would that second option be?

If you mean extracting only the math core from the typst Rust crate, I think that’s what’s done in wypst. Even if only using math evaluation, you have to initialize the whole typst engine. Without rendering, that’s already a few megabytes. Thus, I think until typst allows for a more modular setup, this one is still not the best option.

1 Like