DEV Community

Discussion on: Is 0kb of JavaScript in your Future?

Collapse
 
mwcampbell profile image
Matt Campbell

From the section on islands:

The tradeoff is these are multi-page (server-routed) apps.

And that's not even all bad. One of the ways that SPAs currently have to reinvent the browser poorly is that for accessibility, they have to signal to screen reader users that the page has loaded, by having a hidden ARIA live region with text like "navigated to [page name]". The browser and screen reader can do this better, with a user experience that the screen reader controls, e.g. automatically starting to read the new page and/or playing a screen-reader-supplied sound effect. That's why I continue to develop MPAs.

Collapse
 
grahamthedev profile image
GrahamTheDev • Edited

And ironically you believe due to these frameworks misguiding you that is the way to handle SPA navigation.

The answer is actually focus management once the page has loaded on to the page <h1>. The below answer is not perfectly well explained but it should give you an idea of the recommended way to handle page loads on a SPA.

You will need to see how to do the following in React, but the principles for AJAX page loading carry across to all SPAs.

The only difference between this and what you asked for is you don't announce "document loaded" instead you focus the <h1> on the page as that…

Now if we go back to MPA here is the recommended way to handle them....

πŸ€·β€β™‚οΈ

I mean, it is all done for you basically! No history API, no focus management, no weird loading state feedback for slow loading pages, if the users connection drops out they know about it....all amazing stuff!

Collapse
 
ryansolid profile image
Ryan Carniato • Edited

Yeah some elements of SPA (especially around navigation) require some emulation of browser behavior. Suspense Transitions in Concurrent Mode are basically emulating the way the browser holds on the current page while preparing to load the next in the background. Also considerations around focus and scroll position.

I've definitely had some experience with ARIA Live working in a media heavy site. Slideshows and Carousels had to do the same things. You will find people doing this though since there are some things you can do with a SPA that you don't get in MPA. But I do think people discount MPAs much too soon.