top | item 36415676

(no title)

artellectual | 2 years ago

I recently converted an entire React / TypeScript frontend to LiveView (will open-source the project soon). I've gone much faster with LiveView. Something which use to take me 4-5 weeks to build with React / TypeScript now takes 4-5 days.

The main reason for that is, the LiveView test framework is super simple to work with. I didn't write any tests when I was doing React / TypeScript just because it seemed so cumbersome to setup. Having a test suite that works out of the box made me write more tests for my front-end.

Not having to build API endpoints for my react components is also a huge accelerator in productivity.

In the end I ended up writing less code, with more polished / well tested front-end.

You can watch the video of what I built with LiveView here https://instellar.app

discuss

order

agos|2 years ago

can you go more in detail of what was difficult in React / Typescript but an order of magnitude easier in LiveView?

artellectual|2 years ago

With React / TypeScript, even the setup of the test suite as I mentioned is painful, which one do you use? playwright? that one is going to be slow and cumbersome, LiveView's built in test suite does the same thing and is much more lightweight and fast. If not playwright which do you use? Jest? Vitest? this is the problem with JS community, too many choice on things that in the end don't matter to the end user.

Also the fact that you have to setup API endpoints for your data, with liveview, you have direct access to the data. You can load any state with a function call instead of having to develop a separate endpoint for your frontend, handle hydration etc... You need real-time updates? It's done out of the box, you don't have to think about it. With react, that stuff is just ALOT to do.

I ended up removing a lot of controllers from my codebase that was there just to service the react front-end. Having those controllers do not service as the "API" of the app. Specs for front-end apis and core APIs are usually quite different based on my experience.

The easiest way I can explain it is LiveView is the least friction between thought and output. React / TypeScript just gets in the way because of all the choice and abstractions you have to build for it.

Don't get me wrong, React still has it's place, there are things I would still use react for, like if I need to render something visually rich, like a flow diagram (reactflow.dev), or video component, or make something like Figma, or a calendar / gantt chart, but for most front-end UIs (95%) you just don't need React.