Multi-page web apps

I received this email recently:

Subject: multi-page web apps

Hi Jeremy,

lately I’ve been following you through videos and texts and I’m curious as to why you advocate the use of multi-page web apps and not single-page ones.

Perhaps you can refer me to some sources where your position and reasoning is evident?

Here’s the response I sent…

Hi,

You can find a lot of my reasoning laid out in this (short and free) online book I wrote called Resilient Web Design:

https://resilientwebdesign.com/

The short answer to your question is this: user experience.

The slightly longer answer…

For most use cases, a website (or multi-page app if you prefer) is going to provide the most robust experience for the most number of users. That’s because a user’s web browser takes care of most of the heavy lifting.

Navigating from one page to another? That’s taken care of with links.

Gathering information from a user to process on a server? That’s taken care of with forms.

This frees me up to concentrate on the content and the design without having to reinvent the wheels of links and form fields.

These (let’s call them) multi-page apps are stateless, and for most use cases that’s absolutely fine.

There are some cases where you’d want a state to persist across pages. Let’s say you’re playing a song, or a podcast episode. Ideally you’d want that player to continue seamlessly playing even as the user navigates around the site. In that situation, a single-page app would be a suitable architecture.

But that architecture comes at a cost. Now you’ve got stop the browser doing what it would normally do with links and forms. It’s up to you to recreate that functionality. And you can’t do it with HTML, a robust fault-tolerant declarative language. You need to reimplement all that functionality in JavaScript, a less tolerant, more brittle language.

Then you’ve got to ship all that code to the user before they can use your site. It might be JavaScript code you’ve written yourself or it might be a third-party library designed for building single-page apps. Either way, the user pays a download tax (and a parsing tax, and an execution tax). Whereas with links and forms, all of that functionality is pre-bundled into the user’s web browser.

So that’s my reasoning. At least nine times out of ten, a multi-page approach is leaner, more robust, and simpler.

Like I said, there are times when a single-page approach makes sense—it all comes down to whether state needs to be constantly preserved. But these use cases are the exceptions, not the rule.

That’s why I find the framing of your question a little concerning. It should be inverted. The default approach should be to assume a multi-page approach (which is the way the web works by default). Deciding to take a JavaScript-driven single-page approach should be the exception.

It’s kind of like when people ask, “Why don’t you have children?” Surely the decision to have a child should require deliberation and commitment, rather than the other way around.

When it comes to front-end development, I’m worried that we’ve reached a state where the more complex over-engineered approach is viewed as the default.

I may be committing a fundamental attribution error here, but I think that we’ve reached this point not because of any consideration for users, but rather because of how it makes us developers feel. Perhaps building an old-fashioned website that uses HTML for navigations feels too easy, like it’s beneath us. But building an “app” that requires JavaScript just to render text on a screen feels like real programming.

I hope I’m wrong. I hope that other developers will start to consider user experience first and foremost when making architectural decisions.

Anyway. That’s my answer. User experience.

Cheers,

Jeremy

Have you published a response to this? :

Responses

Cole Peters

@adactio This is awesome, Jeremy; unsurprisingly I wholeheartedly agree. Re: the example you gave of a music or podcast app, we (@enhance_dev) are launching a new demo site next week that addresses that exact use case with an MPA (or what I’d just call ‘a website’, haha). I’d be curious to know what you make of it!

# Posted by Cole Peters on Wednesday, September 13th, 2023 at 3:58pm

Sara Joy ✨

@adactio

I often wonder whether being freed to go back to MPAs where lots of things on the web platform just work as intended without needing to be rerolled in JS will free up some time and energy for creativity.

No wonder people reach for styling frameworks when injecting CSS into websites built in JS frameworks seems so difficult… (Not that it needs to be. But people seem stuck in this mindset)

# Posted by Sara Joy ✨ on Wednesday, September 13th, 2023 at 4:17pm

Cole Peters

@adactio Will definitely be mentioning your article in my announcement post on the Begin blog, so I’ll make sure to ping it ;)

# Posted by Cole Peters on Wednesday, September 13th, 2023 at 4:21pm

Brent Lineberry

I saw two articles yesterday that seemed to balance each other well.

The first, “Some Notes on Local-First Development” by Kyle Mathews (h/t Simon Willison), gives a current-state-of-things for a web application architecture where (as I understand it) the data is read and written locally and then synced with a remote database in the background.

The advantages listed are

  • Simplified state management for developers
  • Built-in support for real-time sync, offline usage, and multiplayer collaborative features
  • Faster (60 FPS) CRUD
  • More robust applications for end-users

I found the idea interesting and reminded me of how our team had once architected a native app to read data from a local database first, and the local database is synced to the remote data source in the background. For native, it felt like a very natural architecture since the expectations are that the app works even without a data connection. Applying this same idea to web applications makes sense.

But then I thought about the cost of the additional client-side code for this.

Later, I saw Jeremy Keith’s “Multi-Page Web Apps” where he argues that “multi-page apps” should be the default and single-page apps the exception, and it felt like a little confirmation that, yes, it is worthwhile considering the burden we put on JavaScript to handle more responsibilities.

Then you’ve got to ship all that code to the user before they can use your site. It might be JavaScript code you’ve written yourself or it might be a third-party library designed for building single-page apps. Either way, the user pays a download tax (and a parsing tax, and an execution tax). Whereas with links and forms, all of that functionality is pre-bundled into the user’s web browser.

Admittedly, data access is not an inherent part of browser functionality, but the download/parsing/execution tax is not trivial.

But then Jeremy wisely caveats use cases for single-page apps:

Like I said, there are times when a single-page approach makes sense—it all comes down to whether state needs to be constantly preserved. But these use cases are the exceptions, not the rule.

So what are the use cases for local-first development? I would think it’s for applications where offline use is crucial or where low-latency data access is critical for success. Kyle gives some guidance at the end of his article:

But in general, I’d still be wary of using local-first outside real-time / multiplayer / offline use cases. Local-first is definitely still bleeding-edge. You will hit unexpected problems. A good community has rapidly developed, but there’ll still be some stretches on the road where you’ll have to solve novel problems.

So real-time, multiplayer, and offline are the scenarios he encourages to consider a local-first approach.

I think local-first is certainly a strategy to keep as an option when the circumstances require it, but not the default. Frameworks aiming to solve this piece are exciting to see and will make it an easier solution to implement when the right time comes.

Torb

Jeremy Keith explaining why multi-page web apps should be the default.

I think that the example app he mentions could be a hybrid SPA/MPA. One that happens to do navigation on the client once it’s loaded (yes, that would be more complex). Pure SPA are very rarely appropriate in my estimation.

# Posted by Torb on Thursday, September 14th, 2023 at 8:30pm

61 Shares

# Shared by Khalid ⚡ on Wednesday, September 13th, 2023 at 3:53pm

# Shared by Jeff Sonstein on Wednesday, September 13th, 2023 at 4:29pm

# Shared by Justin Ferrell on Wednesday, September 13th, 2023 at 4:29pm

# Shared by Brian LeRoux 💚 on Wednesday, September 13th, 2023 at 4:29pm

# Shared by Ashur Cabrera on Wednesday, September 13th, 2023 at 4:29pm

# Shared by Sara Joy ✨ on Wednesday, September 13th, 2023 at 4:29pm

# Shared by michel on Wednesday, September 13th, 2023 at 4:29pm

# Shared by James Nash on Wednesday, September 13th, 2023 at 4:29pm

# Shared by DNKrupinski on Wednesday, September 13th, 2023 at 4:29pm

# Shared by Jeremy Neander on Wednesday, September 13th, 2023 at 4:30pm

# Shared by Morbi on Wednesday, September 13th, 2023 at 4:30pm

# Shared by Leonidas Tsementzis on Wednesday, September 13th, 2023 at 4:30pm

# Shared by roughiain on Wednesday, September 13th, 2023 at 5:00pm

# Shared by Simon MacDonald on Wednesday, September 13th, 2023 at 5:00pm

# Shared by Eric on Wednesday, September 13th, 2023 at 5:00pm

# Shared by Joost van der Borg on Wednesday, September 13th, 2023 at 5:00pm

# Shared by Mario on Wednesday, September 13th, 2023 at 5:32pm

# Shared by Jean-Philippe Sirois on Wednesday, September 13th, 2023 at 5:32pm

# Shared by Cole Robison on Wednesday, September 13th, 2023 at 5:32pm

# Shared by rubenwardy on Wednesday, September 13th, 2023 at 5:33pm

# Shared by Sami Määttä on Wednesday, September 13th, 2023 at 5:33pm

# Shared by Minh Tran on Wednesday, September 13th, 2023 at 5:33pm

# Shared by Ville V. Vanninen on Wednesday, September 13th, 2023 at 5:33pm

# Shared by Ben Myers 🦖 on Wednesday, September 13th, 2023 at 5:33pm

# Shared by Robert Wetzlmayr 🇪🇺 on Wednesday, September 13th, 2023 at 5:59pm

# Shared by Saaste on Wednesday, September 13th, 2023 at 6:00pm

# Shared by Marius Gundersen on Wednesday, September 13th, 2023 at 6:00pm

# Shared by marie destandau - ototoï on Wednesday, September 13th, 2023 at 6:00pm

# Shared by Apple Annie :prami: on Wednesday, September 13th, 2023 at 6:00pm

# Shared by Robb on Wednesday, September 13th, 2023 at 6:31pm

# Shared by ZiyaWild on Wednesday, September 13th, 2023 at 6:31pm

# Shared by Simeon Nedkov on Wednesday, September 13th, 2023 at 6:31pm

# Shared by Šime Vidas on Wednesday, September 13th, 2023 at 7:01pm

# Shared by Chriztian Steinmeier on Wednesday, September 13th, 2023 at 7:01pm

# Shared by Carsten Bach on Wednesday, September 13th, 2023 at 7:31pm

# Shared by Joren on Wednesday, September 13th, 2023 at 7:31pm

# Shared by Manuel Matuzović on Wednesday, September 13th, 2023 at 7:32pm

# Shared by mrtnvh on Wednesday, September 13th, 2023 at 7:58pm

# Shared by Chase Seibert on Wednesday, September 13th, 2023 at 7:58pm

# Shared by akazzop@pouet.chapril.org on Wednesday, September 13th, 2023 at 8:25pm

# Shared by Simon Praetorius on Wednesday, September 13th, 2023 at 8:25pm

# Shared by Jamie Matthews on Wednesday, September 13th, 2023 at 8:25pm

# Shared by Thomas Broyer on Wednesday, September 13th, 2023 at 9:39pm

# Shared by g on Wednesday, September 13th, 2023 at 10:11pm

# Shared by Oblomov on Wednesday, September 13th, 2023 at 10:38pm

# Shared by Valtteri Laitinen on Wednesday, September 13th, 2023 at 10:38pm

# Shared by Anthony Bosio on Thursday, September 14th, 2023 at 12:12am

# Shared by Adam Perfect on Thursday, September 14th, 2023 at 1:07am

# Shared by Mathieu on Thursday, September 14th, 2023 at 1:37am

# Shared by jlebleu@framapiaf.org on Thursday, September 14th, 2023 at 3:43am

# Shared by Tony Mottaz on Thursday, September 14th, 2023 at 4:07am

# Shared by Okko Ojala on Thursday, September 14th, 2023 at 4:40am

# Shared by Martin B on Thursday, September 14th, 2023 at 5:39am

# Shared by Ronnie André Bjørvik Sletta on Thursday, September 14th, 2023 at 5:39am

# Shared by Ange Chierchia on Thursday, September 14th, 2023 at 11:39am

# Shared by thebigreason on Thursday, September 14th, 2023 at 2:13pm

# Shared by Duncan Lock on Thursday, September 14th, 2023 at 10:51pm

# Shared by Chris Taylor on Friday, September 15th, 2023 at 6:34am

# Shared by Åke Järvklo on Friday, September 15th, 2023 at 8:09pm

# Shared by Graham Harper on Saturday, September 16th, 2023 at 9:24am

# Shared by Kolombiken on Saturday, September 16th, 2023 at 2:55pm

66 Likes

# Liked by Khalid ⚡ on Wednesday, September 13th, 2023 at 3:53pm

# Liked by 22 on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Francis 🏴‍☠️ Gulotta on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Ilias :ablobcatbongo: on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Jeff Sonstein on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Justin Ferrell on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Brian LeRoux 💚 on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Lewis LaCook on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Ashur Cabrera on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Paul Hebert on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Sara Joy ✨ on Wednesday, September 13th, 2023 at 4:28pm

# Liked by michel on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Philip Newborough on Wednesday, September 13th, 2023 at 4:28pm

# Liked by liam on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Ethan Marcotte on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Nick F on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Morbi on Wednesday, September 13th, 2023 at 4:28pm

# Liked by Leonidas Tsementzis on Wednesday, September 13th, 2023 at 4:29pm

# Liked by Cole Peters on Wednesday, September 13th, 2023 at 4:29pm

# Liked by Jake Beamer on Wednesday, September 13th, 2023 at 5:00pm

# Liked by Bobby Showalter on Wednesday, September 13th, 2023 at 5:32pm

# Liked by eladnarra on Wednesday, September 13th, 2023 at 5:32pm

# Liked by Jean-Philippe Sirois on Wednesday, September 13th, 2023 at 5:32pm

# Liked by Dave McDermid on Wednesday, September 13th, 2023 at 5:32pm

# Liked by Matthijs Wagemakers on Wednesday, September 13th, 2023 at 5:32pm

# Liked by LinuxUserGD on Wednesday, September 13th, 2023 at 5:32pm

# Liked by Henrik Lundberg on Wednesday, September 13th, 2023 at 5:59pm

# Liked by Robert Wetzlmayr 🇪🇺 on Wednesday, September 13th, 2023 at 5:59pm

# Liked by Marius Gundersen on Wednesday, September 13th, 2023 at 5:59pm

# Liked by Saaste on Wednesday, September 13th, 2023 at 5:59pm

# Liked by Gianni on Wednesday, September 13th, 2023 at 5:59pm

# Liked by marie destandau - ototoï on Wednesday, September 13th, 2023 at 5:59pm

# Liked by Apple Annie :prami: on Wednesday, September 13th, 2023 at 5:59pm

# Liked by Robb on Wednesday, September 13th, 2023 at 6:31pm

# Liked by Simeon Nedkov on Wednesday, September 13th, 2023 at 6:31pm

# Liked by Trevor on Wednesday, September 13th, 2023 at 7:31pm

# Liked by antiorario on Wednesday, September 13th, 2023 at 7:31pm

# Liked by Carsten Bach on Wednesday, September 13th, 2023 at 7:31pm

# Liked by Manuel Matuzović on Wednesday, September 13th, 2023 at 7:31pm

# Liked by Jamie Matthews on Wednesday, September 13th, 2023 at 8:25pm

# Liked by Thomas Broyer on Wednesday, September 13th, 2023 at 9:39pm

# Liked by Avi Schwab on Wednesday, September 13th, 2023 at 10:11pm

# Liked by Jason Neel on Wednesday, September 13th, 2023 at 10:11pm

# Liked by g on Wednesday, September 13th, 2023 at 10:11pm

# Liked by Oblomov on Wednesday, September 13th, 2023 at 10:38pm

# Liked by Gabor Lenard on Wednesday, September 13th, 2023 at 11:04pm

# Liked by Jill on Wednesday, September 13th, 2023 at 11:04pm

# Liked by Timo Tijhof on Thursday, September 14th, 2023 at 12:12am

# Liked by Adam Millerchip on Thursday, September 14th, 2023 at 12:37am

# Liked by Mathieu on Thursday, September 14th, 2023 at 1:37am

# Liked by Mat Janson Blanchet on Thursday, September 14th, 2023 at 2:06am

# Liked by jlebleu@framapiaf.org on Thursday, September 14th, 2023 at 3:43am

# Liked by Okko Ojala on Thursday, September 14th, 2023 at 4:40am

# Liked by Wes on Thursday, September 14th, 2023 at 4:40am

# Liked by Angel Ponce on Thursday, September 14th, 2023 at 5:06am

# Liked by Ronnie André Bjørvik Sletta on Thursday, September 14th, 2023 at 5:39am

# Liked by Tom Kiss on Thursday, September 14th, 2023 at 6:39am

# Liked by Max Smirnov on Thursday, September 14th, 2023 at 6:39am

# Liked by Martín Baldassarre on Thursday, September 14th, 2023 at 11:39am

# Liked by Ange Chierchia on Thursday, September 14th, 2023 at 11:39am

# Liked by Danny van Kooten on Thursday, September 14th, 2023 at 1:41pm

# Liked by Dan on Thursday, September 14th, 2023 at 3:18pm

# Liked by Peter O'Shaughnessy on Thursday, September 14th, 2023 at 6:24pm

# Liked by Chris Taylor on Friday, September 15th, 2023 at 6:34am

# Liked by Graham Harper on Saturday, September 16th, 2023 at 9:24am

# Liked by Cédric Luthi :1up: on Saturday, September 16th, 2023 at 9:06pm

Previously on this day

1 year ago I wrote That was dConstruct 2022

The last ever dConstruct.

2 years ago I wrote Stakeholders of styling

Are you writing instructions in CSS …or are you writing suggestions?

9 years ago I wrote Other days, other voices

The power of the spoken word, recorded.

11 years ago I wrote Blame

The victim.

12 years ago I wrote The country songs of distant Earth

Greetings from Nashville, or possibly space.

20 years ago I wrote Booktown

The first time I visited Dan in Baltimore, the town motto emblazoned on benches was “The City That Reads”. The last time I was there, the motto had been changed to the more bomabastic “The Greatest City In America” because, apparen

21 years ago I wrote Cthuugle Ph'nglui Search Fhtagn!

A search engine for all things Lovecraftian.