Runtime performance improvement

[Machy8]

Describe the problem

Caching: The compile() method of the Compiler class is called multiple times, which can be time-consuming. Caching might improve performance.

Reducing DOM operations: The updateCss() should be called on requestAnimationFrame() to batch the changes and update the CSS in a single pass.

Using getElementyByClassName instead of querySelectorAll()

Use of const instead of let and var: it helps avoid re-declarations and re-assignments.

Redraws only when css changed : call callHook() method in the updateCss() method, only call it when the css has been changed.

Inner html vs outerHtml: Use of innerHTML or textContent instead of outerHTML when updating the DOM.

Unused code: Check out for unused initMutationObserver()

Describe the proposed solution

.

Alternatives considered

.

Importance

nice to have

[MilesPernicious]

Ah I didn't see this issue when making my PR #226 226. I can try tackling this if you like!

[Machy8]

Sure, if you want, you can take any point you want (or even any other if you find something you want to improve). I will connect all those PR with this issue. I have planned to solve this issue slowly after releasing the 1.0 version, so there will be no conflicts between our branches as I am not focusing on Runtime now.

Some of those points are not explained well enough though, because it's just a scratch of what I had in my head when I was browsing the Runtime. So feel free to improve literally anything you want :).