Modern web bloat means some pages load 21MB of data - entry-level phones can't run some simple web pages, and some sites are harder to render than PUBG

azenyr , 2 months ago

Thats mostly because of the overload quantity of ads, trackers, plugins, integrations, etc all websites have now. Using an adblocker halves your bandwidth usage. If you have a data cap, an adblocker is a must.

And then, optimization. As an Angular developer, knowing many websites nowadays are Angular or similar, the lack of optimization is a big problem. Most don’t even use lazy loading, not to mention managing the module imports into different components. They import everything into the main component and don’t do lazy loading leading you to websites that have 20-40MB (!!!) of initial load (when you open the website). This is so common that I think junior angular devs will slowly just kill angular popularity and give it a bad look. Takes work to optimize Angular, and many devs don’t care enough and just rush it. And then there are companies that don’t understand that web frameworks need optimization and just underpay devs or rush the dev time.

Please don’t use Angular (or similar complex web frameworks like Vue or React) if you don’t know how to correctly optimize it, or don’t have time or care for it. And don’t overload your pages with ads and integrations. You are ruining the web.

TechNerdWizard42 , 2 months ago

npm install everything --force

NorthCountryHermit , 2 months ago

I’d hazard a guess and say it all stems from advancements in tech. There was a need to get the most out of something because of limited resources. Now that everyone’s got some fairly serious hardware (yes, even the cheap shit), there’s rarely that urge to optimize.

Rather than optimize each new technology as it comes along and gets adopted, it seems as though the mantra is “fuck it, add it to the pile”. And it snowballs. As developers feel the need to optimize less, the lessons get passed down to the next generation, and so on.

So we’re left with apps/end-user stuff that appear to have been on the opposite of a diet.

electricprism , 2 months ago

Gemini

SomethingBurger , 2 months ago

Capricorn

electricprism , 2 months ago

You made me look, alas, no dice to a web thingy.

Shh it’s a secret geminiprotocol.net

ChallengeApathy , 2 months ago

More reason to use Brave, keep JS disabled by default and just re-enable on a site-by-site basis.

Blemgo , 2 months ago

Ignoring the shady practices of Brave Software, this doesn’t really solve the problem. Sites will still use way too much scripting to be flashy, and that will continue to be a problem for everyone, because some of these sites willbe needed for some and will require all scripts to function properly.

What might help more in the long run is complain to the site owners that their site, despite you having an up to date browser, does not work on your phone. Sure, some of those complaints will fall on deaf ears, but even some changing means progress.

LiveLM , 2 months ago (edited 2 months ago)

You see, stuff like this is why I never understood the wave of “Android Go” and “Lite/Go” apps a couple of years ago.
On my old low end phone, the native Twitter app ran infinitely better than the Web based “Twitter Lite”. This applied to almost every “Lite” app compared to their regular versions.
I feel like whoever started that “Webapps are great for low end” concept never actually tried to run a modern Webapp on a slow phone.

Edit: My comment is focused mostly on the push of Webapps on low end phones. I’m sure there are great, proper “Lite Apps”, and I quite like the idea of Android Go, I just think the implementation missed the mark and that a lot of companies pushed out a crappy, poorly thought out webview just to cash in the “Lite” trend without caring about the end user.

dRLY , 2 months ago

I only ever used the lite version of FB Messenger. Shit was much better than the full version, especially without all the bloated “features” that I didn’t use at best and being annoying/battery drains at worst. Was noticeably snappier on both my old and new phones. Fortunately most of my friends started using Discord and/or Signal with better features (and one less Meta app to have running).

I think that the idea of having smaller and less demanding versions of lots of apps is a good idea. As so many apps are just not optimized and bloated. Just being coded to rely on higher specs to make up for said lack of effort in cleaning up stuff. The ads on ads on ads being part of the issue as well. Which is only getting worse with the close buttons not loading unless shit has been however many seconds. Seems that the “hit box” for the close buttons is getting smaller and smaller to guaranty the ads are clicked on and then open another app or a browser. Though optimizations and better coding won’t fix dirty underhanded grifts.

LiveLM , 2 months ago

I think that the idea of having smaller and less demanding versions of lots of apps is a good idea.

I think that too!
I’m just not sure Webapps are the way to go about this over native, smaller, leaner apps.

mods_are_assholes , 2 months ago

Every justification made for webapps are transparent lies to get access to more user data.

I am so fucking tired of corporations lying with no consequences to the detriment of their customers.

ForgotAboutDre , 2 months ago

The lite apps also take up less user storage. Which was a big issue for lower end phones at that time. Once you ran out of storage people struggled to install new apps. Even with external SD cards, as it wasn’t an easy concept for some people to get over.

SkunkWorkz , 2 months ago

Of course an app that is compiled ahead of time to run natively on the cpu would run faster than a web app that compiles it bloated JavaScript code on the fly.

The web app versions was to avoid having to download large apps, not to be faster. They are slow because the companies tried to have feature parity with the native app and also stuffed it with tracker software. Web apps are supposed to barebones.

KingThrillgore , 2 months ago

I ended up using a static site generator for my personal site because I fucking hate JS and frameworks and WebComponents. The front page is 646 KB and it loads in 4 seconds. I’d love for it to be 1 second or less, but the fonts are a factor.

And I shrunk the shit out of that background too with pngcrush so miss me with that.

TCB13 , 2 months ago

My front page is 613KB with Wordpress. Moral of the story, you don’t have to use a static website generator to have light things.

https://lemmy.world/pictrs/image/c8528ce8-ba0e-4fb6-9845-b67b05267936.png

Harbinger01173430 , 2 months ago

Can I achieve the same with vue.js or flutter? I need to learn this

TCB13 , 2 months ago

And how do you plan to manage your posts, database etc. and render stuff in those? You still need some backend solution like Wordpress, you can use vue as a frontend library for it… or vanilla JS, or jQuery…

Harbinger01173430 , 2 months ago

Ah, for that I’ll just dump some fast API or flask thing. Vue or flutter will just handle the front end

TCB13 , 2 months ago

So… you are aware that FastAPI and Flask will always be significantly slower than Wordpress… because Python, always running processes etc.?

You’re building a simple website / blog just use Wordpress, it will output most of the pages into plan simple and fast HTML, then add a few pieces of vanilla JS or Vue (if you’re into that) to make things “fluffier”. Why bother with constant XHR requests when you’re just serving simple text pages?

With Wordpress you’ll also get all the management, roles, permissions, backend for “free” and you can always, like sane people, cache the output of the most visited pages. Wordpress also provides a RESTful API if required.

Harbinger01173430 , 2 months ago

No I mean, I wanna make a full project but without bloating the front end website

fuzzzerd , 2 months ago

Yes. You can. I have a personal site that is using nuxt static site mode and it renders extremely fast and clean output.

fuzzzerd , 2 months ago

Check out 250kb.club all performance sites focused on speed and small size.

fuzzzerd , 2 months ago

Or maybe the 512kb.club a more reasonable balance between 250 club and the 1mb club.

Also with a view: jankfree.org for a similar focus on performance.

flying_sheep , 2 months ago

I have a pixel 6 and notice some lag in scrolling. Could it be that you don’t use srcsets but instead huge screenshots no matter the device screen?

bufalo1973 , 2 months ago

The fonts can be loaded from another file that ends in the cache, lowering load time next time.

autokludge , 2 months ago

Haven’t done this type of optimizing in a long time, I had a quick look at the network graph for your front page (F12 dev tools in desktop browser), my understanding is it looks like you are getting blocked from loading additional resources (fonts + background) until your style sheets are fully read --pink line is document loaded i believe.

It may be worthwhile to experiment with adding some preload links to the html template? or output? like below and assessing if it makes things faster for you.

<link rel=“preload” as=“image” href=“https://volcanolair.co/img/bg1-ultracompressed.webp” fetchpriority=“high”>

<link rel=“preload” as=“font” href=“https://volcanolair.co/fonts/Inter-Regular.woff2”>

<link rel=“preload” as=“font” href=“https://volcanolair.co/fonts/Inter-Bold.woff2”>

https://programming.dev/pictrs/image/8bf72575-dafd-4aff-8896-700a4ce4e176.png___

JasonDJ , 2 months ago (edited 2 months ago)

I love all your replies.

You wouldn’t get these responses from stackoverflow.

This isn’t even a programming or development community…it’s a general interest one.

You didn’t even ask for help.

KingThrillgore , 2 months ago

I gotta say I came in here to flex and I learned so much. I am going to roll some of these changes really soon once I find out where to best add them to my Hugo template. I’m going to reply to some of them below to clarify some things:

It may be worthwhile to experiment with adding some preload links to the html template? or output? like below and assessing if it makes things faster for you.

This is the most interesting because I didn’t even know this was possible with HTML5, so I want to add this right away.

I have a pixel 6 and notice some lag in scrolling. Could it be that you don’t use srcsets but instead huge screenshots no matter the device screen?

The background is a large image in the CSS via background-image, I don’t know how easy it would be to change it to a srcset but I will give it a shot

The fonts can be loaded from another file that ends in the cache, lowering load time next time.

At the very least they need to load last because they are the largest burden

TopRamenBinLaden , 2 months ago

Not that you’d want to because you hate JS and web components and all that, and there’s nothing wrong with your website, but NextJS supports Static Site generation.

So, JS and frameworks and webcomponents can get the job done for simple stuff nowadays. My portfolio page has a load time of 631 ms using the SSG built into NextJS, and its really similar to your website.

ShortFuse , 2 months ago

The entire Material Design framework in JS and Web Components in 80kb

clshortfuse.github.io/…/buttons.html

JS and Web Components are not the problem. Poor design is.

sugar_in_your_tea , 2 months ago

Loaded pretty much instantaneously on my phone (a second at most). Then again, I block third party fonts.

veniasilente , 2 months ago

, but the fonts are a factor.

I’m not sure if the possibility is there depending on your use case (eg.: you are exporting the fonts) nor if the cost of doing it would be worth the shot, but you can send minified versions variants of fonts, too.

phoenixz , 2 months ago

Honestly, 4 seconds is really slow, especially with static HTML. I built my first companies’ site myself, it includes a video on the front page and jquery, is built by PHP, and on descent Internet connections the front page will load in slightly over a second, other pages dip under that.

There are loads of tweaks you can make to -any- site, and total amount of bytes really isn’t the only speed factor here.

mindbleach , 2 months ago

See also The Website Obesity Crisis, nearly a decade ago.

Here’s an article on GigaOm from 2012 titled “The Growing Epidemic of Page Bloat”. It warns that the average web page is over a megabyte in size.

The article itself is 1.8 megabytes long.

The problem with picking any particular size as a threshold is that it encourages us to define deviancy down. Today’s egregiously bloated site becomes tomorrow’s typical page, and next year’s elegantly slim design.

The author links their tweet saying “your website should not exceed in file size the major works of Russian literature.” At the time, that page on Twitter was 900 KB. Today it is 11 MB.

sugar_in_your_tea , 2 months ago

And a lot of that is tracking nonsense.

I work on a full blown web app, and we’re about 11 MB (will look into trimming the fat). We have features like PDF report generation, 2D drawing, and fairly heavy algorithms relevant to our industry. We have thousands of Typescript files, and something like 500k+ lines of code. We also have lots of SVGs for icons, canvas stickers, etc.

So after all that, we’re about the size of an average Twitter/X page. Those are not the same order of complexity…

mindbleach , 2 months ago

And a lot of that is tracking nonsense.

That’s in the slides. It’s one of my favorites:

https://static.pinboard.in/ob/thumbs/ob.041.thumb.png

sramder , 2 months ago

Wet Ass Pussy is clearly the answer.

InFerNo , 2 months ago

I have a WAP phone, and to my surprise google loads

sramder , 2 months ago

I’m delighted. I wonder if they still employ one lone engineer with the title “WAP Architect” :-)

faintbeep , 2 months ago

I always think it’s unfair to compare things to video games. Video games are so inefficient they had to invent a separate processor with hundreds of cores just to run them. Of course they end up running well.

If cheap phones had a 128-core JavaScript Processing Unit, websites would probably run fast too.

faintbeep , 2 months ago

deleted_by_author

Jesus_666 , 2 months ago

Then again, those 100 MB are usually mostly assets I want to look at or listen to. Certain websites contain 100 kB of text and pictures I want to look at and load 2 MB of JavaScript frameworks that add nothing to the usability of the site. Bonus points for automatically streaming a 20 MB video I don’t want to watch while I look for one sentence’s worth of information.

AnAngryAlpaca , 2 months ago

• I have a limited amount of bandwith on my mobile plan
• if i know a game download is large i go home where i have broadband; i dont download large files over mobile internet
• a text-only website can be rather small with only a few KB. It’s only when you get ““Designers”” that things start to bloat, because the system fonts are not good enough and 2MB in extra fonts no sane visitor will ever notice must be downloaded.
• the marketing department REALLY needs those 10 extra trackers and analytics scripts that take 5s to load, even if they last looked at the visitor stats back in 2021 and the login has long been forgotten.
• the CEO wanted that animated AI powered talking gorilla widget he had seen on a local tradeshow where the customers can ask product or website questions (spoiler: they dont!), which ads a few more Megabytes to each pageload even before you even use it.

zalgotext , 2 months ago

Imagine that, people don’t mind when they have to wait 10-15 minutes every once in a while for their game to update, but they do mind waiting 15-30 seconds every time they navigate to a new webpage.

ZILtoid1991 , 2 months ago

Video game developer here. A lot of anti-optimiation sentiment are just excuses and/or part of some dumb trend.

Oh no, compiled languages require you to choose between variable types! Better use Javascript.

Why should we develop a proper portable app environment when we have Electron? It can even run in browsers. Imagine if you didn’t had to go to your pops to install the word processor, instead he just types in wordprocessor dot app into the browser?

What if code was so easy to understand you didn’t had to document it, and each macroblock of a function instead were a named function, so they’d be automatically documented?

And this is just the tip of the iceberg. I’m currently writing my own scripting VM, as most others have their own limitations, and would introduce a barely usable build system to my game engine (which are their own can of worms). Code as data is a very useful feature, but having to include DLL files as scripts would be very complicated due to platform differences, although also very fast. Issue comes when people treat scripting languages as full-fledged programming languages, and even scaring away beginners from compiled languages, because you have to compile them, you have to choose a type, etc.

ICastFist , 2 months ago

The real irony is that you can make games entirely with Javascript (no backend server needed) and I wouldn’t be surprised if some of those games, even with 3D rendering via three.js or babylonjs, performed better than certain websites

sugar_in_your_tea , 2 months ago

I just want to point out that interpreted languages don’t have to be slow. For example, LuaJIT is competitive with Java in terms of performance, and not that much slower than C. Likewise, PyPy is almost always consistently faster than CPython, and Python 3.13 will have a JIT. I’ve also used numba to improve performance in Python (got close enough to naive Rust to not be worth adding Rust to our pipeline).

If you want scripting languages to be fast, there are options, so the decision should instead be made based on the benefits of each. For example:

• scripting languages - generally better edit/reload experience, write once, run anywhere an interpreter exists
• compiled languages - catch common errors before running, lots of fixes for various platforms

I’m super interested in Rust because it catches way more common errors than most compiled languages, so you’re getting a lot more value for that compile step. My day job is Python + Javascript, though I have nearly 10 years with Go and most of my personal projects use Rust these days, so I feel like I’m fairly experienced here.

just excuses and/or part of some dumb trend

I agree. There are good reasons to prefer scripting languages to compiled languages and vice versa, but most people don’t seem to decide based on those reasons, they often decide based on what’s easier to hire for, what they’re familiar with, or what’s already being used.

I’m super excited about Rust gaining traction because it’s basically the best case for a compiled language I’ve seen. Maybe it’ll revise the trend toward higher level languages and encourage a bit more provable correctness.

chellomere , 2 months ago

separate processor with hundreds of cores

Well, graphics rendering is very suited for parallelism. That’s why GPUs were invented.

Most other tasks are not. Most of the cores in a 128-core JPU would end up being unused. Also why JPU? It’s not like it’s significantly different from a normal CPU task.

HKayn , 2 months ago

I don’t think the person you replied to actually knows what they’re talking about.

turkishdelight , 2 months ago

Browsing the internet without uBlockbOrigin is bad for your health.

kalpol , 2 months ago

Raymond Hill is a hero of our times. Not even kidding.

ltxrtquq , 2 months ago

googles the name

Raymond Earl Hill was an American tenor saxophonist and singer, best known as a member of Ike Turner’s Kings of Rhythm in the 1950s.

Well, I mean we all have our own ideas about the world.

kalpol , 2 months ago

True, true

herrvogel , 2 months ago

Ad blockers don’t protect you against dumbass frontend devs who serve 5mb png files to be stuffed into 600x400 boxes.

TheAnonymouseJoker , 2 months ago (edited 2 months ago)

You can set a limit in uBO settings to prevent loading of files/elements above x KB in size. You will just see a red dotted blank space for elements comically large, and they will load if you click them, if needed.

Edit: here is what you need to change

https://lemmy.ml/pictrs/image/c26f1c99-837f-4823-acf8-35454353a1e2.jpeg

sugar_in_your_tea , 2 months ago

Thanks kind stranger, I didn’t realize this was configurable.

mindbleach , 2 months ago

Shit, I might use that on a desktop with broadband.

Black_Gulaman , 2 months ago

Is 50kb enough or should I go higher.

Also. Thanks!

TheAnonymouseJoker , 2 months ago

Estimating the general acceptable size for images or GIFs helps here. Images usually cap under 600-700 KB, while GIFs can go over 1-2 MB. Experiment with the number, or set it at 1200 KB maybe.

Black_Gulaman , 2 months ago

Thank you, this helps a lot

sugar_in_your_tea , 2 months ago

I have mine at 50kb, and most things load, but I do get some images that don’t. Just play with it and increase it until the frequency you need to tap pictures to render them doesn’t piss you off anymore.

Black_Gulaman , 2 months ago

Thank you.

ColdWater , 2 months ago

I especially hated wallpaper website that load full size pictures on previews grids

mods_are_assholes , 2 months ago

No but the good blockers give you the power to disable elements on a case by case basis.

Removing the background image for fandom wiki articles makes them load 3x faster.

delirious_owl , 2 months ago

mod_pagespeed does

ICastFist , 2 months ago

B-B-BUT STORAGE’S CHEAP, BRAH!!!11! INTERNET’S FAST!!!11 CPUS ARE POWERFUL11!

humbletightband , 2 months ago

Sorry, not everyone speaks rich and not everyone speaks poor

Harbinger01173430 , 2 months ago

Me, with my cheap Motorola: you guys have internet problems?

DestroyMegacorps , 2 months ago

And thats why i believe that ublock origin is needed for modern web browsing

sugar_in_your_tea , 2 months ago

Yup. If websites respected me, I’d respect them back and not need uBlock Origin.

mods_are_assholes , 2 months ago

No corporate website respects you in the slightest, they are just greedy for your metrics.

sugar_in_your_tea , 2 months ago

Yup, hence why uBlock Origin stays on.

mods_are_assholes , 2 months ago

Agreed.

People seem to forget that in the past you didn’t run a constant antivirus on your computer constantly, and would just occasionally run a scan if suspicious activity happened. At least until malicious web activity became so bad and everyone HAD to run antivirus.

We are approaching that point for web blockers.

_number8_ , 2 months ago

if you watch steve jobs’ 2007 iphone keynote it’s incredibly depressing now. he brags about how the iphone can load full, rich webpages instead of awful mobile versions; he loads the NYT website and gets the whole lush landscape desktop version, and taps to zoom in on certain elements. i used to be such a dork and so into tech in high school, it seemed so promising and wondrous.

i bet jobs could’ve yelled at spez about the API changes and gotten him to relent

MeThisGuy , 2 months ago

the guy that was convinced apples could cure his cancer?

deweydecibel , 2 months ago

i bet jobs could’ve yelled at spez about the API changes and gotten him to relent

Why would Jobs care? Reddit’s app goes through the app store, Apple gets a cut of any premium users buy on it.

And why would Spez relent to Jobs? Everything Spez is doing is to get maximum payout from the IPO and then cash out. He doesn’t give a shit about the actual site anymore.

mindbleach , 2 months ago

“Full rich webpages” on a 2007 iPhone meant bare HTML and a kilobyte of Javascript. Anything fancy would be in Flash because JS was slow as balls, and the iPhone never ran Flash.

chiisana , 2 months ago

the iPhone never ran Flash.

Ruffle has (recently, for me) entered the chat.

Not that this negates the performance concerns, but just that Flash on iPhone is becoming a possibility.

mindbleach , 2 months ago

If we’re counting now and into the future, the EU has coerced them to finally tolerate other browsers.

… not that I’m aware of any current browser with Flash support.

chiisana , 2 months ago

Ruffle gives it support, no EU good-intention-poor-implementation regulation required. The demo link I shared above works with any browser, built in Safari included.

mindbleach , 2 months ago

Oh I know, I was just suggesting more-direct support was possible. Genuine stupid coverage for a long-dead plugin.

Maybe someone could coerce Dolphin browser from Android to iOS.

I do have to say, Ruffle is the most boringly-named of the “let’s do Flash in JS” projects. The first big one was named Gordon, in an obvious pun. The follow-up was named Shumway, in a less-obvious pun. About ALF.

chiisana , 2 months ago

Speaking of historical Flash support, I actually forgot the old Puffin Browser which I’ve bought back in 2011, and apparently is still around. They run a browser on their server and you get a VNC-like client to access that instance. So by no means native support, but it was super functional at least back in the days — haven’t used it for years since I stopped buying iPads as my use case are better suited for the Mac and the iPhone instead.

mindbleach , 2 months ago

That is dedication I absolutely would not match. I bought Android for software freedom and mmmight have watched some pivotal Homestuck animations on a Droid 2 Global.

Even now, please don’t give Apple money.

chiisana , 2 months ago

Everyone has different preferences and priorities.

I just spent an obscene amount of time yesterday and overnight, losing sleep in the process, in order to get our media server back online and running after what was supposed to be an automated system update that botched the entire storage array… all that just so the little one can listen to the music we’ve vetted and she likes.

That is an experience I do not want on my phone and computer. My personal computer and phone are mission critical — as in, they’re what’s enabling me to make money and put food on the table. I cannot tolerate downtimes. The fact that everything I need just works together, bundled with a much higher degree focus on privacy than everything else on the market makes it a no brainer for me to just keep buying Apple devices one after another.

Some people may prefer the tinkering and tweaks and customizations. Others might want to play emulated games or triple A titles. Not me. Give me the walled garden and lock it down. I don’t want anything that could make it remotely unstable.

mindbleach , 2 months ago

That is an experience I do not want on my phone and computer.

Instead, a total absence of control. If something borks up you’re just hosed. Possibly no way to do a thing in the first place, to later get borked.

As I’ve told many defenders of Apple’s downright criminal restrictions - Android works the same way, if you don’t fuck with it. My first phone? Absolutely I ran custom ROMs and installed whatever from wherever. My current phone is stock. Most people’s are.

The ability to fuck with things is crucial. Actually fucking with things is optional.

chiisana , 2 months ago

Days since last issue for me on Apple products: 15 years – I started Apple product pairing about 15 years ago with the iPhone 3G and the unibody aluminum MacBook a little earlier, and I don’t have memory of them doing me wrong.

Compare that to my servers: Days since last issue: 1 0 day – I started using Linux close to 25 years ago, starting with RedHat Linux 6 where GNOME was the big hot new thing. While I wouldn’t consider myself an expert, a relatively benign system update shouldn’t have botched the system for me the way it had yesterday. This was not the first time, and it will not be the last time… and how do I know it won’t be the last? My other server, hosted in the cloud by Oracle in the San Jose region lost power, went offline for several hours; the block storage attached to the VM did not get unmounted properly, which in turn did not get remounted properly, so when the system came back, it couldn’t get everything back up and running automatically, and required some manual intervention before I can get back on my Lemmy instance.

For whatever reason, this just seems to be par for the course on anything that’s not locked down. Yet, the scary boogieman of “if it something borks you’re hosed” seems to be the norm. Track record kind of speaks for itself here, at least for me, this model works. I’m more than happy with the security and stability on things that I use to keep the lights on.

PS: Also getting fond memories of deploying Deep Freeze on Windows 3.11 Workstations so users cannot mess it up. Before doing that, going through to re-image problematic machines was a daily job, after locking everything down so the systems cannot be messed with? Monthly, just so we can deploy updates. Recurring theme much?

ItsAFake , 2 months ago

When ever I used to have issues with my internet I used to use news.com.au as a test to see if the issue was fixed, if that site loaded than anything would.