Unfortunately this is another side effect of the broken hiring process in IT. Recruiters are scanning resumes for the hottest buzzwords, hiring managers want people who have experience with whatever is currently hyped, so developers naturally steer towards those technologies.
So a developer may even be aware it doesn't quite make sense to use a single page architecture, but they know that if they have it on their resume it'll help them make more money at the next job.
It's a whole maladaptive signaling phenomenon that arises out of organizations overvaluing the wrong things in hiring.
Some may be aware, but certainly not everyone.
I have to ask... what went so wrong? If you had a time machine, what would you tell your younger self?
It was a mistake because we needed to move fast and figure out if we had something or not. A simple CRUD website (say Ruby on Rails, Elixir/Phoenix, or even straight up Node/Express) would have been faster to build and iterate on.
There was one section of it that would benefit from being able to work while offline, so that could perhaps have been built as a small SPA. But the rest, that was in hindsight a mistake.
1: Google's abandoned webapp toolkit where you get all of the drawbacks of writing Java code with none of the benefits.
Angular everything and everywhere and sprinkle it with Material Design!
I'm learning Clojure at the moment, don't think I would have heard of Google Closure otherwise
A lot of what clojure does, Typescript does it really well with it’s types in jsdocs.
People use SPA frameworks and make SPAs with them and those SPAs end up functioning exactly the same as any Rails/Django/Laravel site except the URL bar doesn't change. MVC is still the way the web is built, except for the people who got bored and wanted to make web development even harder than it already is.
YAGNI.
The problem with that is, blogs are a poor barometer for that sort of thing. Nobody needs to write new blog posts about tried-and-true things that are already plenty well documented. The more solid and stable a technology is, the less incentive there is for anyone to bother writing how-to blogs about it.
For me the major advantage of vuejs over jquery is the way data drives UI
Just build a normal website and let my browser do what it was built to do. The APIs that allow SPAs are great and useful. The Pixlr online photo editor has a good reason to be a SPA, and that works great for it. Your forum/email interface/management API would work better as a normal website.
Good for you with your fast, always-on internet, I guess. Some consumers have to deal with expensive and unreliable 3G internet (that downgrades to 2G occasionally) - an offline-capable email (or management) SPA is indispensable for them. Sure, you could write 4 native offline apps for MacOS, Windows, iOS and Android but that is a bigger investment than targeting browser standards.
Absolutely. This extends well beyond SPAs, too, in my experience. I recently burned part of a month explaining to my senior management chain why you don't just, literally, "do machine learning." Of course, it turns out that the ask was coming from the C-suite, who wanted to put it on a slide somewhere because "everyone is doing machine learning, we need to do machine learning."
[1] https://www.informationweek.com/big-data/ai-machine-learning...
That being said, as someone who has done a lot of infrastructure work, I do like web technologies that can fit into something like serverless and Ruby/Rails really isn't there. Speed, file size, and boot time all become much more important. Or if you can make it work, fully static pages that can live on S3/Cloudfront and any dynamic needs are abstracted away to API gateway/Lambda and pulled in.
I would much rather have an app running inside of Lambda instead of having to manage a load balancer and AWS auto-scaling, or even elastic beanstalk.
So many problems can be dissolved down into people picking the wrong tool for the job.
I've worked at places in all four quadrants of should/shouldn't and do/don't use microservices.
They're GREAT when they're the right fit.
Most websites aren't really a right fit and do fine with a classic webserver->DB setup.
But in reality most work is very simple. Most work does not require new shiny technology. Most work is insanely mundane.
Outside the software business, on companies whose focus is totally unrelated to software, no one cares that much how things work.
They just have a couple of devs, or hire some freelancers do do some stuff, no matter how, it just has to look pretty.
There are clearly good uses for SPAs, but the author is totally correct that most sites are "open, check, close" experiences.
If it's not essentially a web based, desktop app...it's much harder to justify. Real tools. If it's not a tool and the user workflow is "open, check, close"...it's serious overkill.
Sure you can build with php, laravel, django. The promise of SPA is a clean separation of UI from the APIs. The same REST APIs that external customers use is the same API you develop on. See travis-ci as an example. It’s the same api that the mobile apps can use.
This separation allows the api to return very lightweight stateless responses. You can scale much better when there is less state kungfu.
The UI can manage the state in very responsive manner. No round trips, instant 60fps render.
And no JavaScript is not slow. It’s just that people don’t know it well and end up loading megs of bloated libs with a 1000 ad tracking libraries.
Don’t throw the baby with the bathwater.
Most of the time I find the initial delay loading/parsing the js to be more problematic than the often tiny speed increase of subsequent loads.
Furthermore, these days it takes minimal to no tweaking to get server-side rendered pages to load fast enough to barely notice the difference (in particular if the client-side is retrieving and parsing JSON in the background through an API request). Perhaps non-webdevs are even less likely to notice this stuff.
> If done well you can totally run offline.
That's definitely an advantage, but most SPAs I encounter don't offer offline functionality, or it's entirely unnecessary to offer it.
> Sure you can build with php, laravel, django. The promise of SPA is a clean separation of UI from the APIs. The same REST APIs that external customers use is the same API you develop on. See travis-ci as an example. It’s the same api that the mobile apps can use.
In some cases that's definitely an advantage. But it's entirely feasible to build an API-based backend and use that API internally for server-side rendering. If you want an app that plays nice with search engines you have to do this anyways.
> This separation allows the api to return very lightweight stateless responses. You can scale much better when there is less state kungfu.
That doesn't make sense to me. One of the biggest issues I have with SPAs is that you now have to deal with the backend state (DB) and a subset of this state on the client, which dramatically increases complexity (state management, sync, etc.). I rather like the old-fashioned approach where all state remains in the backend, except perhaps for the tiny bits you'd put in a cookie (and I suppose the URL could be considered client-site state too).
> The UI can manage the state in very responsive manner. No round trips, instant 60fps render.
How many apps do you use where you really need anything below say, sub-second rendering? Frameworks like Phoenix and/or caching can be much faster than that even (in the order of microseconds).
> And no JavaScript is not slow. It’s just that people don’t know it well and end up loading megs of bloated libs with a 1000 ad tracking libraries.
Clearly if so many SPAs are bloated Mb-size messes, it's not trivial to solve. And it's a problem you can almost entirely avoid if you keep the rendering on the server. After years of agonizing over bundle sizes, I find it incredibly liberating to not have to think about this anymore (much of the time, anyways).
> Don’t throw the baby with the bathwater.
I do agree that there are plenty of use cases for SPAs, but I also agree with many here who say they're very over-used.
I'll add that there are some interesting initiatives to have 'old-fashioned' applications that also get to be dynamic enough for many if most use cases. Phoenix LiveView [1], for example, takes advantage of very fast server-side rendering, websockets, and sending subsets of the templates as HTML snippets to the client, where morphdom simply diffs the HTML string with the element it's supposed to replace. With great performance.
[1]: https://dockyard.com/blog/2018/12/12/phoenix-liveview-intera...
This may be even meaner, but they usually end up demonstrating they can’t. 99% of them are terrible. Even Google’s latest efforts are a bit on the slow, low-information-density side.
Also, it's hard to realize how much work a SPA actually entails until you get your hands dirty. SPAs generally sound great on paper from a technical standpoint.
SPAs bring back the client-server architecture we had before the web. you build desktop clients that consume server-api's.
server-side html generation now feels like cruft and an awkward way of building applications.
though that doesn't negate the point of SPA which enables building clients that run directly on the users devices and are not hampered by the difficulty of emulating stateful clients on a server.
i am not trying to diss backend frameworks here as bad. any of these would be a good choice for the backend.
the point is that thanks to SPA and CRUD i get to reuse that same backend over and over with little or no modification. (modifications amount to fixing bugs and very rarely adding new features to the API)
my backend development time now is effectively 0!
[0] (i have been working with laravel, django and others (primarily roxen and pike) before, and while i am not a fan of php, i did find laravel pleasant to work with)
I'm not sure what you meant with the rest of your post. There are technical upsides to having zero web client presentation logic implemented on the server at all. But it's just trade-offs.
Maybe you're suggesting with your "grunt work" comment that most complexity for most applications lives in the UI rather than the API? I'd agree. It's why there are upsides to keeping UI implementation off the server.
I just like to avoid the HN cargo cults of "this = good, that = bad" and "the people who do $X are probably incompetent."
And yeah, they're also common in situations where they're not the right solution because either devs want to turn their current employer into the next Google, want to build up the CV to look good when interviewing for Google or have a boss/investors who like shiny things in general.
Citation needed. G-Suite's admin pages are half "modern" SPA monstrosities that suck up my RAM and peg my CPU to render a bunch of whitespace with bits of information strewn around, and ugly but functional regular pages whose performance is killed for being framed inside a SPA frankenapp.
If you're building web applications, it's usually easier to build with components than to think in terms of web controls. If you can separate state slightly from the components even better. This is why react + redux scales well. It makes very little sense in smaller apps, or those that are mostly static. It makes huge sense when you have hundreds or thousands of components, and a lot of application logic and structure.
It isn't just because management wants an SPA... sometimes an SPA is the best option.
Of course each application has different needs, but for large multi-developer UIs, I think a better option is to split your front end into distinct server based pages where you leverage React/GraphQL/SPA/PWA features for great DX within those pages. That way you can keep it fast and potentially limit some of the complexity.
Overall it loads in right around 1s, as I mentioned the splitting for async load on demand doesn't work at the moment, which I had the initial load for a page not using chart.js down to around 115kb gzipped. Part of that also includes the embedded SVG icons as well as the JSS for styling.
It's not paying attention when lodash + underscore, + rambda + momentjs, etc. all get loaded via dependencies... most of that can expressly be avoided with specific smaller frameworks and tooling.
Is Reddit a web app? Is Twitter? Facebook? They all started with server-generated HTML, all kinda feel "document-like", all of them involve scrolling (if that means anything.)
Is the "app" boundary further along the chain, like at Google Docs?
I think instead of trying to come up with definitions to classify things (and probably argue for the meaning of those definitions from the conclusions we want to draw) we should ask,
- Will this help developers?
- Will this make users lives better?
Facebook is probably the least clear one, since they put great effort into eliminating discoverability and accessibility from "outside", i.e. without a Facebook account. They're basically the AOL of today, which was a classic application back then that tried to contain a proprietary "web" of stuff in itself, only accessible if you ran their "browser" application, had an account with them and were logged in, and that "AOL Internet" of course had its own search mechanisms, just like Facebook has its own sophisticated search. However, they're not fully closed-up, they just try really hard to nag you into having an account, which is why I'm inclined to still put them in the "website" camp.
However, all of these web sites surely contain certain parts that are in itself "web apps" and that are pretty much isolated from the basic parts of the site (albeit possibly interacting with it at well-defined points through APIs). I guess that this is a logical result of the large engineering teams that are working constantly on what is basically the same big website - at some point, in order to scale out further, it just becomes economic and practical to effectively isolate certain features into mostly separated "apps".
I run a somewhat popular media site implemented as an endless-scrolling SPA. Clicking on an image or video opens its detail page in a floating modal and changes the URL. I specifically wanted people to be able to link to content this way, and my SPA will load that modal and the media-gallery behind it.
Quickly, SPA just becomes implementation detail. It's the level of user-interaction that dictates your implementation. For example, if you insist on your site being server-rendered with heavy Javascript that takes over, there may be a point where it would've been simpler for you to just implement it all in Javascript (the SPA).
I could've implemented my media site without Javascript. Or maybe just with AJAX that returns HTML. But I know from experience that, while simple upfront, those become more complicated as you try to build more interactive UX and starting wishing your Javascript had more access to the context. At which point a SPA is just another tool for managing client complexity in some other quadrant of the graph. But there's some nuance to the question of whether your site is or should also be in that quadrant.
A more interactive Javascript-heavy UI can improve a lot of aspects of even websites we consider to be a server-side-rendered gold standard like a forum or message board.
For example, look at the right-sidebar scrubber on Flarum that lets you quickly scroll to arbitrary parts of a long forum thread: https://discuss.flarum.org/d/17745-flarum-0-1-0-beta-8-relea...
Or look at how clicking a submission on Reddit's new UI opens it in a floating modal window so that you don't lose track of where you are when you click out of it. It makes opening submissions feel cheaper/faster to me where, in the old UI, I tended to open everything up in a new tab.
There's a more thoughtful consideration that needs to be had here than just "webapp or website?" Else you're back to cargo-culting.
The first could be done easily with anchor links - if the content wasn't loaded dynamically.
And browsers are perfectly able to return you to the same position in the page - unless it's all loaded dynamically.
https://www.talkyard.io/-32/how-hacker-news-can-be-improved-...
All three of these are examples of websites where JavaScript should be entirely optional. With the exception of the realtime chat functionality in reddit and Facebook, there is very little that any of those three platforms couldn't do exclusively with server-side-rendered HTML and CSS. It might be ugly, but it'd be usable. Any client-side scripting should build on top of that and implement the fancier features.
I remember a while back I wrote a blog post where the main topic was "You're not Google (unless you're Google)"[0]. It was related to micro-services but the same thing applies to SPAs too.
[0]: https://nickjanetakis.com/blog/microservices-are-something-y...
I mean for SEO sure, but I usually am not concerned with SEO at all.
Well, if you're destination is just 2 blocks down the road then why not walk? If you just need a simple page and the content doesn't need to be updated often, why not some flat HTML/CSS/JS?
Many times SPA frameworks are used because it's flashy and more exciting than writing basic html and css, but more often than not that's all you need.
I'm not sure what the term for it is, monolith maybe.
I have also witnessed discussions where management admits that they want something done in an SPA so that they can show that work to their investors, as a means of getting funding to do other projects. So basically the same reason, except for managers to impress investors instead of developers to impress potential employers.
Not saying all SPAs are mistakes; some uses clearly are not. But most of them are.