Remix.run Logo
j45 19 hours ago

React is great at solving complex problems.

Not all problems are complex to begin with, and having a complex tool as default otherwise adds complexity to the project and also inflexibility to iterate quickly.

This is in addition to having to maintain a relatively brittle ecosystem from past feature as well as future features but that can be true for more than one area of JavaScript or other technologies.

Looking for the next curve to emerge out of the current generation of web app building.

wk_end 18 hours ago | parent | next [-]

I think (at least part of) the reason why React has been so successful is that is scales so well: it's actually a relatively simple tool that works well for small problems. Pair it with a Vite template or something and you can be up-and-running in minutes. But it continues working pretty well as your app gets bigger, too.

But where React fails is actually in more complex scenarios. Prop drilling becomes tedious or intractable, so now we have all these different ways to manage state (Context, Redux, MobX, Recoil, Zustand, Jotai...). Your re-rendering gets slow, so now you need to start sprinkling React.memo() all over the place and adding reselect (or re-reselect!) queries and restructuring or denormalizing your store data, but then it turns out some of your props are objects that are regenerating each render cycle, so you need to memoize those too, and you end up on a wild goose chase there. Or your engineers were sloppy and accidentally put some side-effects into your components, so you've got subtle bugs you're not sure how to fix. And there's a lot of complexity or even unanswered questions around things like robustly fetching data your component needs, and maybe React Router answers them but then you end up down a whole other rabbit hole, especially when a new version of React Router comes out and breaks everything.

solarkraft 18 hours ago | parent | next [-]

The amazing thing about React to me is that millions of dollars keep flowing into improving its DX further. They have spent a lot of time building React Compiler (https://react.dev/learn/react-compiler/introduction) which does all the memoization for you! This severely lightens the performance concerns.

paulhebert 17 hours ago | parent [-]

Sure, but Svelte and Vue have had these compilation features built-in for ages without all that money flowing in.

The react team resisted these features because they went against their “it’s just a library” philosophy. They’re only copying them now because of how obviously useful they are in the other frameworks.

useEffect, useMemo, useCallback etc. add a ton of complexity and make it easy to write buggy code. I used to work at an agency so I’ve done projects with React/Svelte/Vue/Lit/Stencil/Angular/etc. I found the React projects had lots more performance issues, confusing bugs, etc. than Vue or Svelte.

I agree with the article. React is popular because it was groundbreaking and now is the default, but it’s far from the best

j45 8 hours ago | parent [-]

Vue and Svelte both feel like down stream evolutions in their own respective ways (and likely overlapping).

branko_d 11 hours ago | parent | prev | next [-]

I think React can be approached a little like JavaScript at this point: just use the good parts!

In my case that means using it as a rendering library and component composer, but not for managing state or side-effects.

stack_framer 11 hours ago | parent | next [-]

This is exactly how I feel. I gave hooks a real, exclusive try for two years after they were introduced (2018-2020). I didn't like them—at all—so I went back to only using React as a UI library. I'm lucky enough now to work at a place where nobody else likes hooks either.

j45 8 hours ago | parent [-]

Appreciate the tips.

j45 8 hours ago | parent | prev [-]

Agreed. Like too much javascript, keeping in mind what it takes to get something running vs keeping it running is a consideration.

There are some fantastic rendering tools in React like Remotion.

boredtofears 11 hours ago | parent | prev [-]

I had problems with prop drilling on early projects but since Context has been around it hasn't been an issue. Never bothered with all these state management libraries, any time someone on my team has tried to sell me on it they've never made a strong case for it over simple proper react state management. useEffect took a little getting used to - it becomes much less problematic when you learn which scenarios to use it in (fewer than you initially think). I've had to use React.memo() at times, but it's usually done in a simple optimization pass not unlike something I'd do in a backend framework.

The only time I am even aware of these problems is when I stick my head into the javascript frontend framework "scene" where everyone acts like each one of these are dealbreakers and they happen constantly all the time.

Life is actually pretty easy as a React dev, it's a well polished and at this point battle tested framework. I wish the other tools in my dev stack were as easy to deal with.

throwaway-0001 19 hours ago | parent | prev | next [-]

And the moment you need to increase complexity in your app, you need to add back react.

mickael-kerjean 15 hours ago | parent | next [-]

I'm a counter example of your claim. Migrating away from React did made the complexity of my app a lot more manageable and unlocked new business opportunities that would have been impossible with React without following the JIRA route of making the software worse for 99% of users because 1% of those needed something. The project in question is Filestash (https://github.com/mickael-kerjean/filestash), what made me switch are those 2 reasons:

- Performance ceiling. Past the point where you have used all the react specific optimisation tricks (useMemo, etc...), React just gets in the way, once you start to optimise things to reduce the memory footprint, optimise for 60FPS, dig into heap snapshots and allocation traces, your life starts to become miserable where you need a complete understanding of not only your app but also the inner working of React, and the intersection of both React with your app. At that point, you either accept the ceiling or rewrite everything to vanilla JS and have complete control over every piece of the code you are shipping to the client

- Extensibility. I am now shipping plugins which patch frontend on the fly without any build step. In practice, after a plugin author packaged their plugin (as a zip file containing a manifest), the patches are applied in real time by the server without a prior frontend build system (open up the demo instance with the network tab open to see this working from: https://demo.filestash.app/). This powers themes with icons swaps, new behaviors (e.g. a "recall" button for files in Glacier), and other things plugin authors come up with that that makes the app far more customizable and opened for new niches without falling onto the JIRA trap

throwaway-0001 11 hours ago | parent [-]

https://github.com/mickael-kerjean/filestash/blob/master/pub...

All using plain strings, what happens when you do a typo? Will your app will silently break or you’ll have a compile time error? that’s a huge draw back - in react I can get a compile time error for a typo most of the time

mickael-kerjean 5 hours ago | parent [-]

> using plain strings, what happens when you do a typo?

The tests fails

> Will your app will silently break or you’ll have a compile time error?

There is no silent error. In practice, there are a couple fail safes:

- using both eslint and tsc: https://github.com/mickael-kerjean/filestash/blob/master/pub...

- the code is full of runtime assertions: https://github.com/mickael-kerjean/filestash/blob/1d1bad001b...

- unhandled error (like most assertion) will interrupt everything to show a scary looking screen: https://github.com/mickael-kerjean/filestash/blob/1d1bad001b...

- controlled error which are part of the regular error handling will stop the flow showing a screen like this: https://demo.filestash.app/?error=test

j45 19 hours ago | parent | prev [-]

Maybe, maybe not. It's not the only sponge, unless it's the only sponge I know.

FpUser 14 hours ago | parent | prev | next [-]

>"React is great at solving complex problems."

The only thing it is great for is creating complex problems out of simple things.

j45 8 hours ago | parent [-]

Haha.

I won't disagree with that - I have seen it used well and not well as well.

Or people asking for "quick tweaks" not understanding that may not be a possibility depending on the programming that may have gone wild too soon.

sfn42 18 hours ago | parent | prev [-]

React is totally fine for solving simple problems.

I'd classify pretty much all frontend web development I do as simple. It's pretty much just boring internal websites, I definitely don't need react for them. Could have made the same thing with any other frontend framework, could have made it server-side rendered. React is totally fine for that. The backend is generally more exciting than the frontend. React is totally fine.

The main problem I see is that most other developers are really ass at their jobs and just overcomplicate everything. I've seen very simple apps have a super complex React codebase, and due to the complexity they're always full of bugs. It's much more rare that I see an elegantly simple React app, or any other app for that matter. Everyone just always overcomplicates everything.

Using React doesn't in any way require you to make it complex. You can make React apps dead simple. And if you are comfortable working with react you'll already know all the solutions to all the problems which makes your job extremely easy. You can breeze through and make the entire simple app in a few days if you know what you're doing. Or you can pick up some new fancy tool, hey let's try Svelte. And now instead of a few days we're gonna spend a few weeks and end up with a codebase that reflects our Svelte experience. And hey look it's time to onboard a new team member - hey guy, we have these three apps - this one's made with Angular because one dimwit wanted to learn that, here's a Svelte app we made last year and lastly here's a HTMX app we made when that was hot. Good luck learning 3 new technologies you'll probably never use again!