search

fast-reflexes / better-react-mathjax

MIT License
132 stars 16 forks source link

Render MathJax in the backend (SSR) #33

Open fast-reflexes opened 2 years ago

fast-reflexes commented 2 years ago

There has been discussion around this earlier and now it seems NextJS 13 is supporting serverside components. This makes it more interesting to look into using the MathJax library itself to generate MathJax n the serverside and then not downloading MathJax in the frontend at all.

pkra commented 2 years ago

Just to avoid people finding the wrong resource: https://docs.mathjax.org/en/latest/server/start.html links to official examples.

A common problem is that some client-side features are lost when rendering server-side, e.g., the mathjax menu (and everything it enables) depends on client-side rendering and there's currently no hydration solution (besides re-rendering).

You can do a lot of things server-side however (e.g., generate descriptions for accessibility) and it's sometimes easier to just build your own for these missing features (e.g., copy&paste for sources).

fast-reflexes commented 2 years ago

Good points. And I know accessibility is a very important concern of the Mathjax creators so definitely worth to thread lightly here.

pkra commented 2 years ago

I personally prefer SSR and have built (with help from the MathJax team) a lightweight helper that makes expressions explorable on the client (see the last examples on github pages). While it's naturally possible to do this on the client, too, I suspect most people would prefer the standard client-side MathJax experience.

Given how MathJax works the full experience invariably needs re-rendering - which might still be done efficiently (e.g., via an instant.page or quicklink kind of approach).