My preferred workflow at the moment is to programatically-generate "Content MathML", which lets me focus on the structure of things (akin to Lisp's prefix-form s-expressions), e.g. here's "applying plus to identifier x and identifier y":
<apply>
<csymbol definitionURL="https://openmath.org/cd/arith1#plus">plus</csymbol>
<ci>x</ci>
<ci>y</ci>
</apply>
Browsers can't display Content MathML, so I use XSLT (adapted from [1]) to convert it to "Presentation MathML". The "MathML Core" discussed in this article is a subset of Presentation MathML. Presentation MathML focuses on the layout of symbols, e.g. the above becomes "identifier x followed by operator + followed by identifier y": <mrow><mi>x</mi><mo>+</mo><mi>y</mi></mrow>
This separation also lets me choose different notations, without having to alter the underlying data; e.g. on this page which compares two different notations http://www.chriswarbo.net/projects/units/negative_bar_notati... (if you click the "View Source" link at the bottom, you'll see the same data being piped into `math block` and `math block minus`, which just apply a different stylesheet).One thing I noticed about this site though is that it is laggy - and I have a pretty good system.
[1] https://caniuse.com/mathml