So here is why I can calm myself down when this happens to me - let's say we did do that and have plain js website. Over time as we develop several things can happen -
- the js file has grown super large now, so we need to split it up into multiple files - this prompts us to find bundlers and related tools like vite, webpack, skypack, roll-up, etc.
- we have more developers working on it and not everyone adheres to the same rules for code style and standard and things tend to break often - linting, prettier, jest, playwright.
- we keep forgetting what the api server returns sometimes so we need to know beforehand what kind of data we get and it should be easy to understand - typescript, zod, etc.
- we need to reuse certain pieces of js + html combination snippets/code, for example - combo boxes and dialogs, so we need a way to make "components" out of it - react, svelte, solidjs, etc
- we our app now has several views each individually addressable - router packages
- we have to share some data with several pages - redux, mobx, zustand, recoil
So all these frameworks are not for immediate achievement of the website but for eventual maintainability and ease of understanding between multiple developers. At least that's how I understand it and tell myself this when I lose my mind.