Thursday, 25 February 2021

React, Single Page Apps, and the Browser's back button

I know my question could simply have a "This cannot be done, this defines the purpose of SPA". But...

I navigate to mydomain.com in my REACT web app. This page loads data from the backend and populates elaborate grids. It takes it about 2 seconds to load and render.

Now I click a link on that elaborate page and navigate to mydomain.com/otherPage. When I click the browser's BACK button to return to mydomain.com, it's blank, and has to be rebuilt from scratch as SPA dictates the DOM must be erased and re-built with every page change (at least the page-specific dynamic parts of it, as routes can be inside a fixed layout of header/footer etc). I get that...

Other than migrating to nextJS and using SSR....

Is there any magic solution in REACT to somehow 'retain' the DOM for a page when navigating out of it, so that when you browser-back into it, that page is instantly shown and not rendered from scratch?



from React, Single Page Apps, and the Browser's back button

No comments:

Post a Comment