[skydhash]

React is nice as a UI library, the thing is that people keep adding more stuff inside the components, making it look more like an application framework, which it's not good at. It takes discipline to design a good interface between your UI and your business logic (even if it's UI related) and keep it that way. If the local state of your component is becoming too complex, extract it to its own store and link it to the child components that are using it. If you do that, it's relatively easy to handle. I have tried Svelte and Vue and I like them, just because the way to write them don't let you add big processing logic on them. So you have cleaner code. Redux-Toolkit, Next.js,… it's just making things complex for no reason.

I'm using Alpine right now and it's still feel like React (in a conceptual manner), but that's because I've never liked to introduce processing in my own code base, preferring services and other stateful stuff to be outside of my React components.

  function SearchComponent() {
    const [query, setQuery] = useState('')
    const resultList = useItems(query)
    return (
      <>
        <SearchInput value={query} onChange={setQuery} />
        <ResultList items={resultList} />
      <>
    )
  }

I still think that if you don't have a lot of states to manage, and plenty of pages, going Vanilla is better. If there's only one single page, but plenty of interactive elements, I'd go with Svelte just because I like declarative more. But that's a matter of balancing whether I want to interact with a build system or not.