DEV Community

Cover image for Get out of state management hell with automatic revalidation

Get out of state management hell with automatic revalidation

Daniel Weinmann on January 09, 2024

React Router and Remix introduced automatic revalidation of data after mutations. I believe this is a paradigm shift and boosts productivity like n...
Collapse
 
efpage profile image
Eckehard

But React was created to avoid just these issues?!? You are just back at a point where good old OOP had far better solutions to.

Collapse
 
danielweinmann profile image
Daniel Weinmann

I also miss the good old mental model before all this JS complexity, @efpage! And the productivity we used to have! 🤓

But unfortunately, I want to build better UIs than we could back then. Remix and React Router, with the help of automatic revalidation, are the closest we got so far to feeling like in the good old days while providing 21st-century UIs!

Collapse
 
efpage profile image
Eckehard

Good to hear you know this times. I came relatively late to use web technology and was kind of shocked, how low developers performance was. I had not used a text editor for programming sind Delphi 2.0 was released in 1996.

From what I can see, it is possible to build appealing better UI´s even without the overhead you get from Angular or the React ecosystem. Maybe also, things have changed a bit since the browser war is over. The React ecosystem get´s more and more complex every year, while Javascript has become faster and more mature. Ok, the JS-class model is still a bit limited, but we can adopt some FP-patterns to make our code more reliable.

I started web programming about three years ago, and as I could not find a suitable platform for me, I created my own one. Applying some of the good old principles seems to make sense and I have created some nice projects that work well. Maybe for curiosity, you like to check out.

You find more details on the platform here (Still the old version, a streamlined one is about to be released soon). And this is one of my latest projects. This is is a very typical page, so it seems quite usable for me. Alls frontend and backend was made with DML in a relatively short time without any additional framework.

Thread Thread
 
danielweinmann profile image
Daniel Weinmann

Very cool work! I also come from a Delphi background, and I was also shocked when I moved to a text editor to do web dev in the early 2000s 😱😂 I still miss the productivity we had with Delphi (don't miss the memory leaks, though!)

For websites (more information, less interaction), I think old-school HTML/CSS, maybe enhanced by a little JS and a little server-side code, is 👌🏽

I work with lots of web apps (less information, much more interaction), and for those, I think you should give Remix's tutorial a try and see how it feels: remix.run/docs/en/main/start/quick...

Thread Thread
 
efpage profile image
Eckehard

Thank you for the link, I´ll give it a try. Hope it is a step forward for me.

Anyway, I´ll continue to check out what´s possible with my own library and to grow some community around it. Currently I can say that it´s fun to use (at least for me), I can do a lot with very little code and results are pleasing, so it seems to be worth to continue. But I would love to have a better ecosystem that makes live easier.

Thread Thread
 
efpage profile image
Eckehard

I only had a very short look on Remix, can´t even imagine the value as I never really worked with React. Luckily I´m not a web designer, I just use the browser as a programming platform. So I´m not depending that much on supporting toolboxes (while they are very welcome if they save time) and an ideal workflow.

One of my findings with the people using web technology was, that they often solve one problem by adding another extension that does exactly this, but brings two new problems. Maybe this is what they call a "technology stack" :-) ? Seems this is a bit a root cause to the struggle you describe with React today.

From My view, things now look like this:

  • Hardware
  • OS
  • Browser / DOM
  • HTML/CSS-interpreter
  • Javascript engine
  • React / CSS framework
  • component store
  • React application
  • Redux

If somebody one day will find that the Redux-System lacks some things or causes some issues, should we add another layer ontop?

I know that the web is like this today, But I´m trying to find out, how to make things simpler. My technology "stack" currently is:

  • Hardware
  • OS
  • Browser / DOM
  • Javascript
  • Application

The nice thing about this "stack" is, that it can solve some conecptual issues we inherit from HTML/CSS (e.g. global scoped ID´s).

Anyway, thank your for you advice. I whish you much success with your platform.

Collapse
 
efpage profile image
Eckehard

Hy Daniel,

does it make any sense to think about using Remix without React? On a micro-scale, using DOM-states or stateful web-components works pretty well (think of an input element, that can handle different physical units), but managing routes with vanilla JS might not be the best solution, specially if you think about nested routes. Maybe it´s something I could use Remix for?

On a long term I´m thinking about a solution, where you write a single code and decide later to run it on the client or on the server. Could be a bit "HTMX"-like, but not for HTML, but for Javascript.