corenominal

Full stack web developer, interested in all the things, but especially the web, code, design, Linux, OS X, PHP, WordPress, JavaScript & robots.

Tagged: bloat

Web Performance of the World’s Top 50 Blogs image/svg+xml

The second fastest site in this test, css-tricks.com, was the site that loaded the fewest elements with only 30 requests. And at the other end of the chart we have tmz.com with a mind-boggling 969 requests. It’s worth mentioning that the Pingdom Full Page Test crashed a few times because of the poor performance of TMZ. Well played, guys.

Haha. Seriously though, there are some interesting stats here, some of the page sizes are bonkers. It’s just a shame that there is no mention of HTTP/2 adoption, it would have been nice to see which blogs are using it, and how they ranked.

The Website Obesity Crisis

Apparently, there is a website obesity crisis (video here) and the average mostly-text site is now 2-3MB in size. To be honest, I can’t say that I’m shocked. Disregarding the advertising and surveillance bloat, which is the main culprit for the ever increasing page sizes, I think the proliferation of modern CSS and JavaScript frameworks have to take some of the blame.

I work with a lot of CSS and JavaScript frameworks and they are all pretty hefty. I would imagine that Twitter’s Bootstrap is probably one of main culprits of the current obesity crisis, and I’m as guilty as the next web designer for using it. The problem is, when you’re faced with a large workload and short deadlines it’s just too damn convenient.

I started using Bootstrap when I started at my current position. The project which I used it on was a replacement to a decaying Intranet. At the time, I figured page weight was irrelevant as the Intranet was served over our local network. To be fair, this is still the case and it’s nice that I don’t have to worry about how big the page sizes are, but the project is an edge case.

The problem is, once you start using a framework like Bootstrap and investing time into it, it is difficult to resist using it for other projects. More so when you apply the external pressures of deadlines and clients. To be honest, I’m pretty sure the client’s don’t care, they’re ignorant about such matters, but I care. So, I’m going to revisit some of the projects where I have used Bootstrap and attempt to remove it.

One site that I won’t have to revisit is this one, because I wrote all the CSS and JavaScript myself. I tested a random page on this site using Chrome’s inspector and it came in at 216KB, which I’m pretty happy with.

Screenshot showing page weight of 216 KB.