[Feature]: Preview for KaTex (math)

[vsimkus]

Hi Caleb, great plugin! Do you have any plans for adding support for previewing math expressions? This is the main feature missing from this plugin for my use case :)

[CalebJohn]

Thanks! Yes, I do plan on adding katex rendering. The current plan is to include the Joplin renderer in the plugin, and use it to render images, tables, katex and anything else that will benefit.

[SeptemberHX]

This package seems enough for rendering the math: https://github.com/SamyPesse/codemirror-widgets

[CalebJohn]

@SeptemberHX it can be rendered the same as an image. My holdup is that i want to support all Joplin special forms (mermaid, katex, etc.) without doing each individually. Ideally the plugin would also support other plugins, but I'm not sure if that's possible with the plugin system, so might not ever get there.

[SeptemberHX]

I think the image style renderer is not suitable for math because it still shows the ![]() things.

For math, it looks very messy with lots of inline math in a paragraph. I think we need to hide raw katex string and show rendered results instead.

[SeptemberHX]

I successfully rendered katex inline math string to equation in the markdown editor. However, I notice serious performance issues when there are many rendered equations in the editor: It can take about 1 second to show your input. I think the problem maybe caused like https://github.com/codemirror/codemirror5/issues/5873

[CalebJohn]

I think you can render to an image and display that instead. It should perform better.

[SeptemberHX]

I think you can render to an image and display that instead. It should perform better.

Yes, I also think images should help. But unfortunately, I haven't found the solutions to convert katex rendered results to an image. There are some discussions about svg image as katex output in Katex repo, but currently there is no implementation for it.

[CalebJohn]

It looks like you might be able to use a generic tool like html2canvas for this. Although that specific one is in a beta state.

[SeptemberHX]

It seems a good tool. I also check the obsidian's editor since it has already supported live preview markdown editor. It also directly insert the dom elements for rendered math, but it performs much better. Maybe it is related to codemirror 6 and mathjax.

[are-scenic]

@CalebJohn, I am sorry for nagging. I wonder whether there is any progress with the KaTeX-rendering support. (By the way, indeed this plugin is awsome and finally I can get rid of the preview panepain and save some screen space. Thank you for that 😃).