3 ms·

When is a SPA quick? I still have yet to see this claim EVER be true.

kkirsche 4y ago
Define what quick means to you. They can be extremely good at responsiveness and background updates once the bundle has been loaded
sibit 4y ago
I've spent the last 2 years building B2B SPAs and, like everything in software, they can be fast or slow depending on how you build the app and what tools you use. I usually leverage lit-html, esmodules, and the dynamic import syntax. If you only fetch the business logic and views when you need them you can have an app that renders in seconds with an initial payload of ~15kb. I usually also set up a service worker to prefetch and cache the rest of the site while cache busting specific files on subsequent visits. Personally I use SPAs for offline support and MPAs for "portals" and brochure/marketing websites or blogs.
- treis 4y ago
  >that renders in seconds That's really long.
  - sibit 4y ago
    Oh geese, I didn't realize that I forgot to add "on slow-3g". We usually aim for <1s FCP & <2s LCP. If it's ever above 5s on slow-3g we set aside time to optimize/refactor. Since our SPAs are offline-first the return visits (usually 3-5 times a day based on the customer) is on the scale of milliseconds.
    - treis 4y ago
      Even still. A 3g connection is a bit under half a MB a second. That's a lot of data for something that is mostly text.
      - sibit 4y ago
        I feel like we're just spinning in circles trying to define "fast" and what speeds are "acceptable" when the main point was: > SPAs for offline support and MPAs for everything else You could build MPAs that offer offline support (and I have) but I find that you spend a lot of time writing the same render logic twice. Things might be different now with Next/Nuxt but when you're using PHP or C# it sucks to write the view render logic twice.
steve_adams_86 4y ago
Prefetching content means you can literally load a new page instantly without rendering anything but the new content. It is inherently faster once the initial page has loaded, and the JS no longer needs to be all that large to accomplish it. Like any technology, using it in the right place helps. This is great for documentation where the template and content slots are super consistent, for example. There are places it’s not a great choice. It isn’t inherently worse, though.
- rcxdude 4y ago
  This is the theory, and yet in practice my experience is almost always the opposite: MPAs load and render quickly and are responsive during use, SPAs are slow to load and render and often chug substantially. Some of the better SPA manage to beat mediocre MPA implementations, but it's not super common. I don't know how it so frequently gets screwed up so badly, but it's a really consistent trend (and this is across fast desktops with a good internet connection to mobile devices with not-so-great signal). For example, hacker news is way, way more usable to me than new reddit (which actually renders my browser unusable on a high end machine after some use).
  - hinkley 4y ago
    The impedance mismatch always seems to boil down to the fact that we have been told umpteen million times that most people end up on your website with a nearly completely evicted cache, and we (or at least, the people who resist) don't seem to believe it. This is pretty much the default and a given for everyone who visits your site... except you. As the author, you likely use your application more than most users, you use it on a work machine (which has a smaller, more niche browser history), and you use it with the sort of network connection that software developers demand: you know, excessive. We see what we expect to see, what we want to see, and most of us don't challenge that, or only do it perfunctorily. And if someone else does? Well that's just crazy talk. See? Everything is fine.
- tatersolid 4y ago
  Our B2B SaaS apps are SPA and preload static assets in the background on the login screen, including the top 90% of used js, templates, and icons (simple to find via http log analysis). This improves the end-user perception of performance dramatically. Accessibility with said SPAs is still a pain though. Even when you use correct semantic elements instead of DIV soup, the DOM usable by screen readers changes “out-of-order” frequently in SPAs, requiring lots of extra work to ensure an accessible experience.
robertoandred 4y ago
https://reactjs.org/docs/getting-started.html https://reactjs.org/docs/getting-started.html is a fast SPA
- exodust 4y ago
  It's just text.

Define what quick means to you. They can be extremely good at responsiveness and background updates once the bundle has been loaded

sibit 4y ago

I've spent the last 2 years building B2B SPAs and, like everything in software, they can be fast or slow depending on how you build the app and what tools you use. I usually leverage lit-html, esmodules, and the dynamic import syntax. If you only fetch the business logic and views when you need them you can have an app that renders in seconds with an initial payload of ~15kb. I usually also set up a service worker to prefetch and cache the rest of the site while cache busting specific files on subsequent visits. Personally I use SPAs for offline support and MPAs for "portals" and brochure/marketing websites or blogs.

treis 4y ago
>that renders in seconds That's really long.
- sibit 4y ago
  Oh geese, I didn't realize that I forgot to add "on slow-3g". We usually aim for <1s FCP & <2s LCP. If it's ever above 5s on slow-3g we set aside time to optimize/refactor. Since our SPAs are offline-first the return visits (usually 3-5 times a day based on the customer) is on the scale of milliseconds.
  - treis 4y ago
    Even still. A 3g connection is a bit under half a MB a second. That's a lot of data for something that is mostly text.
    - sibit 4y ago
      I feel like we're just spinning in circles trying to define "fast" and what speeds are "acceptable" when the main point was: > SPAs for offline support and MPAs for everything else You could build MPAs that offer offline support (and I have) but I find that you spend a lot of time writing the same render logic twice. Things might be different now with Next/Nuxt but when you're using PHP or C# it sucks to write the view render logic twice.

steve_adams_86 4y ago

Prefetching content means you can literally load a new page instantly without rendering anything but the new content. It is inherently faster once the initial page has loaded, and the JS no longer needs to be all that large to accomplish it. Like any technology, using it in the right place helps. This is great for documentation where the template and content slots are super consistent, for example. There are places it’s not a great choice. It isn’t inherently worse, though.

rcxdude 4y ago
This is the theory, and yet in practice my experience is almost always the opposite: MPAs load and render quickly and are responsive during use, SPAs are slow to load and render and often chug substantially. Some of the better SPA manage to beat mediocre MPA implementations, but it's not super common. I don't know how it so frequently gets screwed up so badly, but it's a really consistent trend (and this is across fast desktops with a good internet connection to mobile devices with not-so-great signal). For example, hacker news is way, way more usable to me than new reddit (which actually renders my browser unusable on a high end machine after some use).
- hinkley 4y ago
  The impedance mismatch always seems to boil down to the fact that we have been told umpteen million times that most people end up on your website with a nearly completely evicted cache, and we (or at least, the people who resist) don't seem to believe it. This is pretty much the default and a given for everyone who visits your site... except you. As the author, you likely use your application more than most users, you use it on a work machine (which has a smaller, more niche browser history), and you use it with the sort of network connection that software developers demand: you know, excessive. We see what we expect to see, what we want to see, and most of us don't challenge that, or only do it perfunctorily. And if someone else does? Well that's just crazy talk. See? Everything is fine.
tatersolid 4y ago
Our B2B SaaS apps are SPA and preload static assets in the background on the login screen, including the top 90% of used js, templates, and icons (simple to find via http log analysis). This improves the end-user perception of performance dramatically. Accessibility with said SPAs is still a pain though. Even when you use correct semantic elements instead of DIV soup, the DOM usable by screen readers changes “out-of-order” frequently in SPAs, requiring lots of extra work to ensure an accessible experience.

robertoandred 4y ago

https://reactjs.org/docs/getting-started.html https://reactjs.org/docs/getting-started.html is a fast SPA

exodust 4y ago
It's just text.