4 ms·

Stuff like filtering search results is very easily accomplished by a MPA with query parameters to a results page. The specific elements that allow you to specif

Stuff like filtering search results is very easily accomplished by a MPA with query parameters to a results page. The specific elements that allow you to specify query parameters often require more interactivity, but this is easy to layer on with a progressive enhancement type approach on top of a fundamentally MPA application.

jasode 3y ago
>Stuff like filtering search results is very easily accomplished by a MPA with query parameters to a results page. But the "MPA to another results page" causing an HTML reload with a flickering blank screen is a jarring UI experience. The issue isn't what's "easy" to implement. Instead, users prefer a fluid and responsive UI. An example of a website that has superfast filters in SPA style instead of "MPA results page" is McMaster-Carr: https://www.mcmaster.com/ https://www.mcmaster.com/ On that website, when the user changes the categories or filters, the results of items instantly change without the jarring disruption and delay of a new page being loaded. There were several previous HN threads about it. Based on the near-universal praise in the comments of those threads, I don't think converting McMaster architecture to your suggested "MPA search results" would be considered an improvement. : + https://news.ycombinator.com/item?id=32976978 https://news.ycombinator.com/item?id=32976978 : Mcmaster.com is the best e-commerce site I've ever used (bedelstein.com) 1402 points by runxel on Sept 25, 2022 | hide | past | favorite | 494 comments + https://news.ycombinator.com/item?id=34306793 https://news.ycombinator.com/item?id=34306793 : McMaster-Carr: A refreshingly fast, thoughtful, and well-organized website(https://www.mcmaster.com/ https://www.mcmaster.com/) 102 points|jer0me|1 year ago|36 comments + https://news.ycombinator.com/item?id=24803857 https://news.ycombinator.com/item?id=24803857 : McMaster-Carr: Beautifully organized and informational industrial product store(https://www.mcmaster.com https://www.mcmaster.com) 40 points|astrocat|3 years ago|27 comments + https://news.ycombinator.com/item?id=34000502 https://news.ycombinator.com/item?id=34000502 : Best ecommerce UX practices from mcmaster.com(https://medusajs.com/blog/9-best-ecommerce-ux-practices-with-examples https://medusajs.com/blog/9-best-ecommerce-ux-practices-with...) 322 points|amoopa|1 year ago|167 comments
- ryanbrunner 3y ago
  > But the "MPA to another results page" causing an HTML reload with a flickering blank screen is a jarring UI experience. Pretty much every modern full stack framework includes approaches to do partial renders and / or DOM morphs of server generated HTML responses, eliminating the full-page refresh effect. www.mcmaster.com seems to utilize this to some degree, actually - while yes there are JSON responses, there are what appear to be HTML partial responses as well that are presumably injected on the page. In any case, everything on that search engine would be trivially accomplished using a server rendered HTML approach without needing to utilize a SPA. It's actually a great example of something that would work great with progressive enhancement - the search bar can start as a simple input that leads to full page search results, the navigation can do a full page refresh if the partial page refresh JS isn't available for some reason. Javascript can make it better without being a requirement. A good rule of thumb is that if an interaction existed at roughly the same fidelity during the Web 2.0 days, it's not something that requires a SPA framework. Typeahead search results and categorized product listings existed and were functional to the level of the site you linked back then.
  - jasode 3y ago
    >partial renders and / or DOM morphs of server generated HTML responses, eliminating the full-page refresh effect. www.mcmaster.com seems to utilize this to some degree, actually - while yes there are JSON responses, there are what appear to be HTML partial responses as well that are presumably injected on the page. Uhm... yes?!? The behavior you listed is exactly why I gave you that McMaster example. So I guess I'm a little confused. In any case, your comment matches up with the wikipedia definition of SPA (https://en.wikipedia.org/wiki/Single-page_application https://en.wikipedia.org/wiki/Single-page_application): >A single-page application (SPA) is a web application or website that interacts with the user by dynamically rewriting the current web page with new data from the web server, instead of the default method of a web browser loading entire new pages. The goal is faster transitions that make the website feel more like a native app. An alternate way of interpreting your reply to me is if you also categorize McMaster's website behavior as a form of "MPA". In other words, you classify McMaster's loading of new HTML fragments and rewriting DOM as "multiple pages". I've not heard others define MPA in this way. >, everything on that search engine would be trivially accomplished using a server rendered HTML approach without needing to utilize a SPA. It's actually a great example of something that would work great with progressive enhancement - the search bar can start as a simple input that leads to full page search results, the navigation can do a full page refresh Yes, we've already agreed about it being technically trivial. The issue is end user's preferred UI experience. Users don't want the "page refresh/reload" even though it's trivial.

jasode 3y ago

>Stuff like filtering search results is very easily accomplished by a MPA with query parameters to a results page. But the "MPA to another results page" causing an HTML reload with a flickering blank screen is a jarring UI experience. The issue isn't what's "easy" to implement. Instead, users prefer a fluid and responsive UI. An example of a website that has superfast filters in SPA style instead of "MPA results page" is McMaster-Carr: https://www.mcmaster.com/ https://www.mcmaster.com/ On that website, when the user changes the categories or filters, the results of items instantly change without the jarring disruption and delay of a new page being loaded. There were several previous HN threads about it. Based on the near-universal praise in the comments of those threads, I don't think converting McMaster architecture to your suggested "MPA search results" would be considered an improvement. : + https://news.ycombinator.com/item?id=32976978 https://news.ycombinator.com/item?id=32976978 : Mcmaster.com is the best e-commerce site I've ever used (bedelstein.com) 1402 points by runxel on Sept 25, 2022 | hide | past | favorite | 494 comments + https://news.ycombinator.com/item?id=34306793 https://news.ycombinator.com/item?id=34306793 : McMaster-Carr: A refreshingly fast, thoughtful, and well-organized website(https://www.mcmaster.com/ https://www.mcmaster.com/) 102 points|jer0me|1 year ago|36 comments + https://news.ycombinator.com/item?id=24803857 https://news.ycombinator.com/item?id=24803857 : McMaster-Carr: Beautifully organized and informational industrial product store(https://www.mcmaster.com https://www.mcmaster.com) 40 points|astrocat|3 years ago|27 comments + https://news.ycombinator.com/item?id=34000502 https://news.ycombinator.com/item?id=34000502 : Best ecommerce UX practices from mcmaster.com(https://medusajs.com/blog/9-best-ecommerce-ux-practices-with-examples https://medusajs.com/blog/9-best-ecommerce-ux-practices-with...) 322 points|amoopa|1 year ago|167 comments

ryanbrunner 3y ago
> But the "MPA to another results page" causing an HTML reload with a flickering blank screen is a jarring UI experience. Pretty much every modern full stack framework includes approaches to do partial renders and / or DOM morphs of server generated HTML responses, eliminating the full-page refresh effect. www.mcmaster.com seems to utilize this to some degree, actually - while yes there are JSON responses, there are what appear to be HTML partial responses as well that are presumably injected on the page. In any case, everything on that search engine would be trivially accomplished using a server rendered HTML approach without needing to utilize a SPA. It's actually a great example of something that would work great with progressive enhancement - the search bar can start as a simple input that leads to full page search results, the navigation can do a full page refresh if the partial page refresh JS isn't available for some reason. Javascript can make it better without being a requirement. A good rule of thumb is that if an interaction existed at roughly the same fidelity during the Web 2.0 days, it's not something that requires a SPA framework. Typeahead search results and categorized product listings existed and were functional to the level of the site you linked back then.
- jasode 3y ago
  >partial renders and / or DOM morphs of server generated HTML responses, eliminating the full-page refresh effect. www.mcmaster.com seems to utilize this to some degree, actually - while yes there are JSON responses, there are what appear to be HTML partial responses as well that are presumably injected on the page. Uhm... yes?!? The behavior you listed is exactly why I gave you that McMaster example. So I guess I'm a little confused. In any case, your comment matches up with the wikipedia definition of SPA (https://en.wikipedia.org/wiki/Single-page_application https://en.wikipedia.org/wiki/Single-page_application): >A single-page application (SPA) is a web application or website that interacts with the user by dynamically rewriting the current web page with new data from the web server, instead of the default method of a web browser loading entire new pages. The goal is faster transitions that make the website feel more like a native app. An alternate way of interpreting your reply to me is if you also categorize McMaster's website behavior as a form of "MPA". In other words, you classify McMaster's loading of new HTML fragments and rewriting DOM as "multiple pages". I've not heard others define MPA in this way. >, everything on that search engine would be trivially accomplished using a server rendered HTML approach without needing to utilize a SPA. It's actually a great example of something that would work great with progressive enhancement - the search bar can start as a simple input that leads to full page search results, the navigation can do a full page refresh Yes, we've already agreed about it being technically trivial. The issue is end user's preferred UI experience. Users don't want the "page refresh/reload" even though it's trivial.