As someone with recent experience using a relatively slow Android phone, it can be absolutely brutal to load some web pages, even ones that only appear to be serving text and images (and a load of trackers/ads presumably). The network is never the bottleneck here.
This problem is compounded by several factors. One is that older/slower phones cannot always use fully-featured browsers such as Firefox for mobile. The app is takes too many resources on its own before even opening up a website. That means turning to a pared-down browser like Firefox Focus, which is ok except for not being able to have extensions. That means no ublock origin, which of course makes the web an even worse experience.
Another issue is that some sites will complain if you are not using a "standard" browser and the site will become unusable for that reason alone.
In these situations, companies frequently try to force an app down your throat instead. And who knows how much space that will take up on a space-limited device or how poorly it will run.
Many companies/sites used to have simplified versions to account for slower devices/connections, but in my experience these are becoming phased out and harder to find. I imagine it's much harder to serve ads and operate a full tracking network to/from every social media company without all the javascript bloat.
Talk about a catch-22 situation. The modern web is useless without adblocking. Especially when you get forever scrolling pages with random ads stuffed in there.
As a web developing illiterate, I wonder how hard would be writing a browser extension that loads a page, does infinite scroll in memory and in background, then while it is still loading the infinite stuff, splits the content in pages and shows them instead, so that the user can go back and forth to page numbers. This wouldn't reduce the network and system load, however navigating the results would be much more friendly.
Problem is, "infinite scroll" often is infinite, meaning it will load an ass load of data in the background and take up a ton of memory, and the user may never even end up looking at that data.
I really hate the load on scroll (especially Google Drive's implementation which is absolute trash, and half the time I'll scroll too fast and it will just miss a bunch of files and I'll have to refresh the page and try again), but a better hack might be an extension that scrolls a page or two ahead for you and stores that in memory. If it was smart enough to infinitely scroll websites that are actually finite (like google drive) that would be amazing though.
In these situations what’s eating up your resources usually isn’t the data being represented but instead the representation.
This is why native apps use recycler views for not just infinite scroll, but anything that can display more rows/columns/items/etc than can fit on screen at once. Recycler views only create just enough cells to fill the screen even if you have tens of thousands of items to represent, and when you scroll they reuse these cells to display the currently relevant segment of data. When used correctly by developers, these are very lightweight and allow 60FPS scrolling of very large lists even on very weak devices.
These are possible to implement in JavaScript in browsers, but implementation quality varies a lot and many web devs just never bother. This is why I think HTML should gain a native recycler widget of its own, because the engineers working on Blink, Gecko, and WebKit are in much better positions to write high quality optimized implementations, plus even if web devs don’t use it directly, many frameworks will.
I find this idea interesting ‘These are possible in JavaScript in browsers, but implementation quality varies a lot and many web devs just never bother.’
Do you have any examples that you consider good implementations? I ask because tables seem to be the biggest offenders of slow components in say Angular / PrimeNG. I am going to a legacy app soon that is being updated (Angular but not PrimeNG). Would like to see if we can build a feature rich table that is more performant than the PrimeNG one that I know looks amazing but is the cause of many headaches.
NOTE: its not Angular or PrimeNG specifically that make the tables slow/hogs, but the amount of DOM elements inside and some of the implementation details that I disagree with (functions that are called withing the HTML being evaluated every tick). Would be great to see if this idea of a ‘recycler widget’ can help us. Cheers.
We do this at Fastmail and, if I say so myself, our implementation is pretty damn good. We’ve had this for over a decade, so it was originally built for much lower powered devices.
Yep, this happens even with nothing but a 10-line vanilla JS file that adds N more items every time the user scrolls to the bottom of the page. Performance degradation increases with every load due to the growing number of DOM elements which eventually exceeds whatever margin is afforded by the machine the browser is running on, causing chug.
Web is not my specialty so I don’t have specific recommendations, but plenty of results turn up when searching for e.g. “angular recycler” or “react recycler”.
There was a proposal for a browser-native virtual scroller: https://wicg.github.io/virtual-scroller/
Apparently it was abandoned (for now?) in favor of content-visibility / CSS containment primitives: https://web.dev/articles/content-visibility
It's also an infinitely worse user experience and prevents you from holding your place in whatever is being scrolled. Are there advantages? Why is infinite scroll used in any context?
1 batch of content = 1 batch of add space = more money.
Each next page click is a moment for you to reflect and notice the waste of time. Simple as that.
Personally I prefer infinite scroll, versus the alternative of finding the "next page" button at the bottom, waiting for the content to load (preloading could help here) and sometimes navigating to the beginning of actual beginning of the content I was viewing. I even used a browser extension that matched "next" buttons from pages and loaded the next page content automatically, but the extension (can't recall its name) is not available anymore.
Granted there are some downsides, such as having the browser keep extra-long pages in its memory, but overall I prefer working infinite scroll mechanisms over paged ones. As far as I see, the ability to remember the current location in the page could be easily implemented by modifying page anchor and parameters accordingly, though personally I've rarely needed it.
Perhaps if there was a standard way (so in the HTML spec) to implement infinite scrolling, it would work correctly in all cases and possibly even allow user to select a paged variant according to their preference.
Not all the paged views work correctly either. In particular systems that show threaded discussions can behave strangely when you select the next page. Worst offender is Slashdot.
You don’t actually need to load everything, just the previous, current, and next pages.
It'll give a nicer experience and will eliminate situation where an element changes location just as you try to tap on it.
The extension just needs to handle GDPR notice and Email subscription overlays.
I just choose not to use it. if I follow a link and there is an ad per paragraph and video starts playing I close the tab. it's rare the page I was about to look at was actually important
I use ublock origin, and on literally more than one occasion (insert doofenshmirtz nickel quote) I've found a site that I quite like, think it's awesome to the point I actually write to the people who create it with suggestions, and then for whatever reason happen to load it without blockers and discover it's halfway useless with all the ads on it.
I fully support people being able to make some money off the useful things they build on the internet, whether it's some random person who built a thing, or the New York Times or even FB or Google, but there has to be a better local maximum than online advertising.
Can you run all your traffic through a self-hosted pihole to avoid such things?
Certainly an option for me. But not a scalable solution for the large number of non-tech people with older devices.
I’d love something like it for all my older devices where I can set it and forget it.
NextDNS is pretty good for this - just change the DNS in your network settings.
You'll also need to add bundles to block dns names ( free fyi)
Wasn’t there an old browser that would render the page on the server and just send down the result or something like that?
The old Opera for mobile did that. I think Chrome had something similar at one point.
Opera!
You're already too rich and too tech aware to qualify as the low end described in the article if you ask that question :)
Maybe so but I also test things in a variety of browsers and devices frequently to try and avoid the problems described in the article.
Having a decent internet experience shouldn't require going through your own self-hosted server.
Absolutely not but then I never thought I’d need a 20,000 entry hosts file either.
Even if you do use a standard browser, companies will force you to use an app by making there website broken (on purpose?).
Random recent example: Nike. Popping useless errors upon checkout in the webshop. Support: "oh, we're so sorry, just try the app, k bye".
Another example of major companies with broken websites more often than not: (European) airline booking websites.
And major companies think this is totally fine and doesn't damage their brand? I mean not being able to create a functioning website with unlimited funds in 2024 is not a bad look?!
Reddit is another example where they've broken the mobile browser experience, to send you to another app. Arguably broken, but in different ways.
Pro-tip: type in old. where the www. used to be and rebbit becomes usable.
But then you get the desktop version of the site. Never mind that Reddit has a mobile-friendly version (whose design Reddit has kept on bungling too).
The i.reddit mobile site sadly seems to have stopped working. At least for me.
try adding .i to the end of the url.
LinkedIn, leaders in deceptive design (though given recent HN on internal situation, a more favorable interpretation may be that they can't handle their own bloat and it shows).
I can show some forgiveness to airlines, because they simply outsource it to some agency somewhere.
But I have zero sympathy for giants, like Slack. If I do a "Request the Desktop Site", then it suddenly works(albeit with lot of scrolling) on my Firefox(iOS), but if I disable the "Request the Desktop Site", then it blocks everything and forces me to download the app from AppStore.
Sadly, the downloaded app looks like an optimized mobile version of the site.
I've got an old MacBook Pro from 2013 that I still keep around because the keyboard is the best Apple ever made. It's not fast by any means, but I haven't encountered any difficulty with websites whatsoever. They're not as snappy as I'd expect on new hardware, but perfectly usable. I do use uBlock Origin, however.
Are these Androids actually less powerful than an 11 year-old, base-spec MacBook?
Yes. Definitely. a Macbook Pro from 2013 has between 4-16GB of memory for one thing. The lowest spec phone in the article (Itel P32) has 1GB. A 2013 Macbook Pro has a 4th gen i5 processor. This phone has a MediaTek MT6580. It's not even in the same ballpark.
This is a bit of an extreme example, but the fact is that a very large number of people in many areas of the world use phones like these.
Additionally, weak Android devices are not necessarily old Android devices. New underpowered Android stuff is sold every day. Cheap tablets are particularly bad about this — I have a Lenovo tablet that I bought maybe a year ago which uses a SoC that benches a bit above a 2015 Apple A9.
$50 android phones are still sold in developing countries and they usually have an MT6580 or UMS312 with 720p screen.
I wrote code to main nokia.com site 10 years ago where it used few ways to detect slow loading of resources and set a flag to disable extra features from the site. This was done because the site had to work in every country and many of the slowest phones sold were from said company.
I also worked for Nokia 13 or so years ago, though not on Nokia.com
Thanks for your work, one of the things that I really liked about Nokia was the passion for performance.
On the flip side: I was on the Meego project and we joked that we had the most expensive clock application ever created, because it kept being completely recreated.
I liked Meego and Maemo, I always felt that they were an expression of the idea that general purpose computing can work in the mobile form factor, which is something that tremendously appeals to me (I wish I still had my N900).
And honestly, that app is going to be a browser shell with a (partially) offline copy of the website in it, 9 times out of 10...
If you're lucky. The main UI may just be a website, but as a native app is has a greater ability to spam you, track you, accidentally introduce security vulnerabilities, etc.