One thing that SPAs promise to get rid of is the extra page loads and loosing focus or "in-place updates". SPA is not the only antidote here. With the "age of efficiency" and sustainability, we care more about fast, lean and light sites. Don't we? Let's look at one pattern that I am using across pages that works quite well to "fix" what MPAs can't do: "in-place updates".

A Bit of Context

The page below shows the challenges that an SPA solves and that I will show how to solve them in an MPA as well, without all the SPA overhead. On this page it is the scroll position, when you filter the content or click on a link, a form submits and the page reloads and (normally) the scroll position is lost, even though the content is the same, just filtered or a <dialog> on top of the current page.

if ('scrollRestoration' in history) { // Disable scroll position restoration when BACK button was clicked. history.scrollRestoration = 'manual'; }

// Sad to need the code below, but in FF JS won't run after history.back() otherwise. // See https://stackoverflow.com/a/2638357 ... better solutions welcome window.onunload = function() {};