Strategy

[RyotaUshio]

Reading view

As of Obsidian v1.4.16, in the clean sandbox vault, app.workspace.activeEditor.previewMode.renderer.constructor.postProcessors[3] is the markdown post processor that handles inline/display math (3 will vary depending on situations.).

// from app.js
// sortOrder == 0
            LA.registerPostProcessor((function (e) {
                var t = e.findAll(".math:not(.is-loaded)");
                if (0 !== t.length)
                    return iA.then((function () {
                        for (var e = 0, n = t; e < n.length; e++) {
                            var i = n[e]
                                , r = Ge(i.innerHTML);
                            i.empty();
                            try {
                                var o = oA(r, i.classList.contains("math-block"));
                                i.appendChild(o)
                            } catch (e) {
                                i.appendText(r)
                            }
                            i.addClass("is-loaded"),
                                HA.set(i, r)
                        }
                        return uA()
                    }
                    ))
            }
            ));

This means we can define another markdown post processor that runs before this built-in processor. And if my processor adds is-loaded class to processed elements, the built-in one will not process it.

Live Preview

We can find the following segment in app.js, which looks like a CodeMirror6's WidgetType??

// from app.js
                        t.prototype.render = function (e) {
                            var t = this;
                            iA.then((function () {
                                var n = t
                                    , i = n.math
                                    , r = n.block;
                                e.toggleClass("math-block", r),
                                    e.toggleClass("cm-embed-block", r);
                                var o = e.find(".edit-block-button");
                                e.empty();
                                try {
                                    var a = oA(i, r);
                                    e.appendChild(a)
                                } catch (t) {
                                    e.appendText(i)
                                }
                                o && e.appendChild(o),
                                    uA()
                            }
                            ))
                        }

RenderMath

In both cases, the function oA is renderMath, which is implemented as:

//from app.js
            function oA(e, t) {
                return MathJax.tex2chtml(e, {
                    display: t
                })
            }

[RyotaUshio]

Ended up in somewhat simpler solution.