DOMless Highlighting

Our current syntax highlighting strategy uses the classic technique of generating a bunch of <span>s, which are styled in different ways. In practice, the highlighters (which can be optimised further, by up to 8x) take around 10ms to process a large file, and then a much larger portion of time is spent creating the DOM for the spans afterwards. While this is improved by using Laminar's splitIndex to reuse spans when edits are made (and this helps make faster interactive editing for the WACC code box), this does not help with the initial overheads when new content comes in (such as the assembly highlighting or when loading a file).

Instead, we might consider piping our tokenising results into https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_Highlight_API. This would allow us to dynamically assign CSS highlights to a single (static) <pre> node, which would massively reduce the DOM work required. However, this API is currently not supported by Firefox, so the current system would have to be retained as a fallback (increasing the data stored within the Span class). There is also no Laminar support for this natively, so it would involve a bit of manual javascript-esque code within the highlighting system (oh well).