[Feature Request] about katex

[rinmyo]

Counld you please integrate the KaTeX server side rendering into Zola? That will be a great performance improvement in the browser side

[Keats]

if there is a cross-platform library sure, see #1073 for a previous try

[rinmyo]

yeah, katex-rs crate has supported windows by using wasm js

[Keats]

Then someone should try to make a PR to integrate it

[crepererum]

In case someone wants to implement this: katex-rs can now also use Duktape for JS execution. It's a single-C-file JS engine which should also build on Windows. So either this or the wasm-based backend should work.

[clegaard]

I would like to give this a shot in the near future.

Rendering an equation using katex-rs and pasting it into a page renders correctly in Firefox. So would this task be a preprocessing step each .md files have their latex expressions replaced by MathML by katex-rs?

Also MathML is, to my surpirse, not supported by Chrome, i.e. it still needs client side rendering by MathJax or similar.
It may still yield some performance benefit in browsers that do not support the standard if MathML is faster to render than Latex.

[crepererum]

I think MathML is coming back to Chrome:

• https://people.igalia.com/fwang/2022-06-igalia-week-shipping-mathml-in-chromium/
• https://chromestatus.com/feature/5240822173794304
• https://caniuse.com/mathml (also note that Safari has MathML support)

So I think emitting MathML might be the better option compared to emitting hacky HTML+CSS, also in terms of a11y.

Note that themes can include a polyfill to render MathML (also partly required for Firefox).

[clegaard]

That's great news!

In terms of accessibility, KaTeX actually emits HTML AND MathML by default, see KaTeX Options:

With the prospect of MathML support landing in Chrome, I think adding an option to replacing all LaTeX with MathML at server-side would be useful:

1. It would allow Firefox to render the expressions correctly today without any client side rendering
2. Chromium browsers would be able to render it in the future

There is the ugly detail that MathJax or similar would still be required to achieve support on the current browser landscape. However, I think a page in the docs showing how to embed MathJax in a template would go a long way towards alleviating the confusion on how to render math.

I would still like some feedback on the best place to implement this functionality. Are there any caveats to matching on a set of known delimiters like $ and $$ and replacing their contents with MathML using KaTeX-rs?

[CGMossa]

This would still be beyond perfect if it was implemented.

I'm giving a talk about Zola soon, and this is on top of features that I thought were present already.

[vilhelmgray]

Looks like pulldown-cmark merged support for math expressions, so that be a path forward for zola.

[aterenin]

Looks like pulldown-cmark merged support for math expressions, so that be a path forward for zola.

It looks like this is landing in 0.11: once that's done, merging this would be extremely helpful - right now I am using a workaround which involves writing math inside code blocks (i.e. `$x=y+z$` and similarly with $$ for display style) so that it does not interfere with markdown italics and the like, then renders it in the user's browser using KaTeX. Matching <span class="math inline"> which is what pulldown-cmark emits would be far more foolproof.

Ideally, I'd like to render server-side. This can be achieved by either:

1. First run zola build, then render KaTeX server-side using some kind of Node script.
2. Adding KaTeX support to Zola (for instance, using the Rust crate for KaTeX as in Katex #1073). This would be much cleaner.

It looks like the main bottleneck for (2) above this was some kind of issue with lack of cross-platform JS support at the time, but there appears to be progress here: xu-cheng/katex-rs#6.

[Keats]

Has anyone tried pulldown-cmark 0.11 with the math support?

[aterenin]

Not yet, but if someone wants to try server-side rendering via a minimal Node script that essentially does a find-replace - not a very smart solution but works great - I have one here: https://github.com/aterenin/academic-paper/blob/4a80380263ff375f7d627f85926c2891489cfa2f/scripts/katex.js.

The main thing that would need to change is to replace the regex <pre class=z-code><code><span class="z-text z-plain">\s*\$\$ with whatever I-suspect-substantially-nicer HTML pulldown-cmark now omits.

[aterenin]

Let me also add one thing: if pulldown-cmark now emits HTML like <span class="math inline">x+y=z</span> as the PR says, this change would make both client-side rendering via KaTeX auto-render extension, and server-side rendering via a quick-and-dirty script like the one above, way, way, way nicer and less issue-prone.

In particular, it would eliminate the need for weird workarounds like putting math inside code-blocks so that Markdown italics don't interfere with TeX and similar. Without any other changes to Zola (whether direct support for server-side KaTeX, or whatever else) this would already be a big improvement for me.

[Keats]

See this as well: https://zola.discourse.group/t/a-simpler-katex-alternative-that-works-today/2156