Earlier quoted context omitted.
I have written a full OS like GUI in JS proving that it can be tiny and memory efficient. The GUI part of the application is about 2k loc across two JS files plus CSS and includes full file system display and navigation. It’s all vanilla JS and static DOM methods so it’s as fast and memory efficient as the browser allows. It’s amazing how fast the browser can be for this (and tiny) when you aren’t using querySelector…
Curious, what do you write that is 'OS like GUI' that doesn't require querySelectors, DOM and event handlers? How do you handle the nuances of GUI and input handling?
Instead of querySelectors I use things like getElementById, getElementsByClassName, getElementsByTagName, and some custom DOM navigation utilities I wrote for this application like getAncestor, getModalsByModalType, getNodesByNodeType, and so forth.
You don't need any kind of framework or fancy wiring to work with events. You always know what you are working with from within the event handler, because event handlers receive an implicit event object as their first argument. From that there is event.target which returns the element the handler is assigned to or event.currentTarget which returns the element the user interacted with that fired the event after bubbling.
State management is also just as easy.