Comment by lucideer

I like React.

I also hate React for many reasons, but I mostly like it because I genuinely believe React is the only front-end system I've used that got the fundamentals correct - they've just gotten many other trivial-but-still-annoying things wrong.

The fundamentals:

- no magic: this is a trend that the JS community has picked up I think from Ruby or maybe just Rails, but having a framework pick things up automatically depending on how you've placed them (directory structure, DSL files without explicit exports, etc.) means you need to learn each framework's magic independently & upgrade paths are harder when magic changes. React is just javascript - components are stored in variables, your app container is a native dom primitive & you need to call the render explicitly. This makes your entry points clear & idiomatic, & ensures your framework stands the test of time.

- composable (& somewhat fungible) primitives: React components are JS objects, there's certainly some elements of the underlying lifecycle implementation that's abstracted away once they're passed to the rendered, but at definition time they're just objects - they can be passed around, inspected, manipulated & ultimately they're not abstracted away & hidden from the dev.

- modular DSL: I'm suspicious of DSLs in general but if you're going to create a DSL, JSX is a masterclass in how to do it. 100% independent of React - you can use JSX without React or React without JSX. This modularity has lead to JSX getting broad high-quality third-party tooling support that all other front-end frameworks lack.

- imperative DSL. This is a bonus but the design of JSX is ingenious. Declarative systems are the dominant trend: everyone wants to create a well-defined strictly static language to define their front-end, but that design goal doesn't match reality. JSX isn't declarative: it's an extension of javascript, tags are function calls, attributes are params. This makes it incredibly expressive - I could write my backend in JSX if I wanted to (could be a fun experiment).

The bad:

- class-based components. This is less of a React problem & more of an ECMA problem but shoehorning Java-style classical inheritance models into javascript was always a bad idea & React was the main proponent of this style when it was popular. Thankfully we've moved past this phase & modern React no longer does this.

- lifecycle methods: these were tied to class components so were always going to end up becoming deprecated when classes went away but they also had other annoying fundamental issues - too complex to go into in detail here but their operation was highly abstracted which made debugging really painful

- hooks: the modern replacement for much of the lifecycle method functionally isn't much better. Thankfully hooks are mainly used for state management, which has always been an "added extra" in the React world (see e.g. flux), so you can minimise your hook usage & avoid a lot of friction if you're clever & careful.