Since you are asking about other approaches, I've been doing some interesting and simple custom elements with my Knockout-inspired view engine [0]. I built an open source MPA application with a bunch of them [1]. I even gave a brief presentation on it [2] (each PR starting with #2 is a "slide"; I presented it in a "Presentation" profile for VS Code opening the numbered files in order, with the Live Preview extension side-by-side with a simple git alias to jump to "slide" merge commit based on PR number; I thought it went well to show off Developer Experience).

My biggest advice appears to be: remember that the Shadow DOM is optional.

[0] https://worldmaker.net/butterfloat/guides/web-components/

[1] https://github.com/WorldMaker/jocobookclub/tree/main/src/bf

[2] https://github.com/WorldMaker/butterfloat-presentation/pulls...