The Website Obesity Crisis
For the first time in the history of the Internet, the computers people use to get online are getting slower, smaller, and harder to interact with. Nobody minds the change because the mobile web is so incredibly useful in our daily lives. But while our devices have been getting slimmer, our websites are getting huge. Why is it so easy to blow out a data plan with a few injudicious taps of the finger? What is driving the bloat when everyone claims to hate it? And why do more capable browsers and faster networks only seem to make the problem worse?
It’s time for some tough talk about frameworks, surveillance, advertising, animation, and phones that get hot to the touch when you check the weather.
Beautiful websites come in all shapes and sizes, this is not to shame anyone and that’s not what he’s here to talk about. He watches online video, uses big js image galleries…
What he’s worried about is sites that just keep getting bigger.
One year’s bloated web page is next year’s normal. We should anchor to something. Maciej recommends your text-based code should not exceed the weight of masters of Russian literature.
A 400 word article on medium is, in text weight, longer than Dostoyevsky’s Crime and Punishment.
War and Peace is about 3 megs.
Maciej shows us a web page on the Yorkshire Evening Post that – somehow – clocks in at 40 megs. (Audible gasp from the audience)
Everybody is aware that there is a problem.
Facebook has proposed Instant Articles, where just your content is posted within Facebook’s UI… but they announced it on a 6 meg site which links to a 40 meg video. Their internet.org site has a 16 meg video just for decoration. So do they really care about connectivity? Would you want to load that site on a slow, expensive connection?
When you travel you find places – like rural Australia or New Zealand – where internet data is treated like rare expensive brandy. You can have more but really you want how much?
Google has announced Accelerated Mobile Pages Project… the page repeatedly downloads a 3 meg video. Maciej and Jeremy Keith had an interaction on twitter and were told “limited resources and outsourcing” were to blame. Maciej recreated a tiny flat version with images of Howard Taft, but Google haven’t used it…
The Taft test: if your images look better with images of Howard Taft, perhaps you don’t need them?
All of the massive sites mentioned can be easily changed to load in under a second. This is not out of our reach.
The only honest measure of page load is from the moment you enter the URL, to the moment you finish closing the last ad. There are many ways people essentially cheat when they report on page speed, apparently loading time and so on – don’t fold in the wingmirrors to make a Humvee more efficient, don’t drive the Humvee.
Ideal web pyramid:
- JS – just a little
- CSS – go on, have a treat
- Images – a little is ok
- Markup – you need this…
- At the bottom – text worth reading, have plenty
The real pyramid has a tiny bit of text, vast amounts of crap, topped with surveillance.
Melissa Kaulfuss @MelissaKaulfuss
The healthy web pyramid vs the reality by @baconmeteor#wd15
There is a problem where investors are pumping money into marketing companies… more than they’re getting back. Eventually the hundreds upon hundreds of ad companies must eat other or go bust. They will do all kinds of things on the way out… more and more tracking.
Advertisers are tracking people even when people have ad blockers and surf incognito.
Advertisers say micropayments are dead – yet we are making micropayments all the time, the cost of data goes to telcos. If a share of that went to publishers they probably wouldn’t need the ads.
We don’t need to abandon ads, but we should go back to “dumb ads”. Remember ads that didn’t track the user paid for everything for decades…!
Enough about ads.
What about fat assets… things that are just oversized.
The accidental 3 meg image displayed at a small size – you don’t notice unless you happen to load it on a slow mobile connection. Or the hero image that is beautiful but hasn’t been minified. Or an animated gif run in a little promo spot in the footer.
Chickenshit Minimalism – the illusion of simplicity backed by megabytes of cruft. (see Maciej’s full post of the same name)
Not everything has to be minimal. Some information density is ok if you are trying to get work done with lots of data. You don’t need acres of whitespace when you’ve made the key information too small to read.
Then we have the tension between mobile and desktop – because the interface isn’t sure if you are using a tiny pointer or you are “slapping the screen with a big fat meat stylus”.
Heavy clouds…
It used to be hard to host a website at really large scale, as you had to source and maintain hardware. Then Amazon offered cloud hosting… suddenly you could rent massive space, although it might occasionally be unavailable (that’s just a fact of life with hosted services).
But devs love this stuff. We love complexity, it’s a challenge. We use everything, kinda because we can. So we get overkill. Layers and layers of complexity in cloud hosting, JS got faster so we started rendering everything in it.
“What’s in your stack?” – “Oh, I have this… incredibly inefficient workflow…” – @baconmeteor #wd15
You can take the profit out of your business with hosting costs.
Giant tool chains & big stacks might mean you pay all your revenue to AWS #wd15 @baconmeteor
No matter what we say about web bloat, it never gets fixed.
There are two futures Maciej can see:
One is the Minecraft future, where everything’s a bit blocky but you make stuff and have lots of fun with basic building blocks. A playful and contributory web where you are expected to add something creative.
The other is the Call of Duty future, where everything is beautifully produced by a team of experts. Everything looks the same despite all the investment. You have to play a very specific way and you don’t get to choose a different way, you can only choose not to play at all.
We should shake off the advertising overlords. We should lighten the load. We can choose to stand together. We can choose a better future for the web.
