What is the minimal subset of MathJax that can do LaTeX to html conversion?

[mwouts]

Hello,

I have been an indirect user of MathJax for a long time, essentially through Jupyter Notebook, so I would like to thank you for the library.

I am also the maintainer of a Python package that displays Python tables as interactive tables using Javascript. I wanted to add support for mathematical content in these tables, so I was looking to use MathJax as a converter. With the help of Copilot I been able to prepare PR mwouts/itables#397, and it works, but at this stage the bundle is way too big (it goes from 0.5MB to 2MB).

I was wondering if you could point me to a minimal example that achieves what I am looking for, that is, a function convertLateXtoHTML(text) that takes a string like "$1+1$" and returns the corresponding HTML maths.

Thank you!

[dpvc]

The SVG output jax uses SVG path elements to generate the characters for the typeset math, and it has data files that give the needed paths for all the characters in the fonts that it uses. That is a lot of data, and that makes the SVG output jax a pretty heavy component when you include it in another package. For example, the webpacked tex-svg-full.js file, which corresponds roughly to what you are using, is just under 2.3MB so your results are consistent with that.

If you were to use the CHTML output jax instead, you could save about 1MB, but tex-chtml-full.js is still 1.3MB, and you would still have to deal with the web fonts as well (though you could use a reference to a CDN for these).

The upshot is, MathJax is a pretty heavy dependency; it includes a lot of things: a TeX-to-MathML processor, an internal MathML implementation, a MathML-to-SVG output render, and all the data for a substantial number of characters and math symbols in normal, italic, bold, and bold-italic forms, plus variants like Fraktur, Script, Calligraphic, Sans-Serif, Monospace, and so on. So that is a lot of information.

As an aside, your current code doesn't handle the CSS that MathJax creates. For SVG output that is not too bad, as it only affects a few things like rules within arrays, link coloring, and error messages, and there is a pretty minimal set of CSS rules that you could include to cover those. For CHTML output, however, the CSS is critical, and is dynamically created, so you would need to make sure you transfer that to the page as well should you want to go with the CHTML output. That can be a bit complicated if you are processing one equation at a time, as the CSS changes depending on the characters that appear in your output and the structures that you use.

[mwouts]

Thank you @dpvc for the detailed response, that is very helpful! If that size is expected then I will see how I can provide an option for the users of my package to build locally a version that will include MathJax. Also thanks for pointing out at the missing CSS, I will keep that in mind!

[dpvc]

In case you stick with the SVG output, the minimal CSS for it is given in many of the examples in the MathJax node demos repository. For example

https://github.com/mathjax/MathJax-demos-node/blob/d9ba8c61e54683efc04d0e11d5812bc974da65db/direct/mml2svg#L84-L92

[mwouts]

Excellent! Thanks for the pointer