| > But it boggles the mind that apparently a large chunk of "developers" cannot see the insanity in writing XML to generate JavaScript which generates HTML and CSS because they want to write `<Button variant="primary">Save</Button>` rather than... `<button class="primary">Save</button>`. I'm wondering if some of the disconnect here is that you don't have personal experience with this type of development, so you might not see what pain points it solves. The first thing I would mention is that components encapsulate function and styling. Buttons don't illustrate this well because they're trivial. But you can imagine a `<DatePicker>` that takes a `variant` property ("range" or "single"), `month` and `year` properties, and perhaps a property called `annotations` which accepts an array of special dates and their categories (`[{date: "2026-07-04", code: "premium_rate"}, {date: "2027-07-07", code: "sold_out"} ...]`). The end result is an interactive picker that shows the desired span, with certain dates unselectable and others marked with special color codes or symbols. You're going to have a very unpleasant time implementing that with globally scoped CSS classes. And this isn't a string sent over the wire. The "document" that the browser renders is changing continuously as you interact with it. If you were to open Chrome Devtools and look at the subtree of the DOM containing the date picker, you would see elements appearing and disappearing, gaining or losing classes and attributes, in real time as you select/deselect/skip forward/etc. That's what makes it work, rather than being a static drawing of a calendar. I personally do not like the Javascript frontend ecosystem. It's hacks on top of hacks on top of hacks. But, do you know another way to deploy software that's cross-platform and basically free of gatekeepers? Sometimes we just have to do weird things because they're really useful. |
One way is what I call the "Modular MVC pattern" that involves pure js routing and manual DOM manipulation without using any framework at all. You handle complexity in two ways: by modularizing the "controller" parts into multiple js modules for each route, and "view" parts into multiple HTML partials - and using the event bus pattern if your app gets too complex (as alternative to modern reactive frameworks like react/vue).
Shameless plug: I've tried to implement this exact pattern with limited success in Abhyasa Quiz App[1], a side project.
[1]: https://abhyasa.pages.dev/