Delivering WordPress in 7kb

Minimizing requests, using system fonts and using vector images are what makes this great because it makes the page loads so fast. Does 7kb really make much of a difference?

Interesting work. I wrote a bit about optimizing WP here: https://hackernoon.com/dont-brake-for-fonts-3-web-performanc...

The most interesting thing I learned is that the number of HTTP requests (not just the total file size) really affected page load times. So for example, WordPress has profile pictures called 'Gravatars' that can be shown alongside comments. By default, your browser will make HTTP requests to fetch all the Gravatars before showing the headline of your post! So we lazy-loaded them instead.

And we used the same plugin shown in this article (Autoptimize) to combine multiple CSS files. You can take this to an extreme by just putting the CSS inline too (but too much markup might make the page slower on mobile).

(And the most powerful tool we used was Cloudflare 'Rocket Loader', which defers all JavaScript execution until after the page first renders. But lately we're finding that it conflicts with the events or listeners in some plugin scripts, causing their JS to not execute at all.)

As a developer I'm not too happy about the trend I've seen in the past couple years of 'monolithic' WordPress themes with tons of JS and other code, because making even simple changes to them can get extremely complicated. I think they caught on for two reasons (1) they often have interactive 'builders' that come with widgets you can drag and drop (contact forms, slideshows, etc.) and (2) The whole design trend of things that change as you scroll--'parallax' elements and dynamically-resizing headers, etc.

This is great, for those of us putting document structure first in the name of accessibility I think this going green idea is a natural fit to 'why bother'. Previously my goal had been to score highly on the metrics of Lighthouse and get increased conversion rate, particularly when the reader has 'lie-fi' or feeble 2/3G connection. I genuinely had not thought that going green was also a good reason for the things I have been trying to do. Accessibility is something that is hard to explain to people, they think it means high contrast and MASSIVE fonts. But it is not that and those that do such things have given a bad name to the cause. Going green is a much easier starting point for that conversation.

I think that there is far more that can be shaved off. The SVG logo can be placed in the CSS as a data url so it only gets downloaded just the once. Currently it is in the file and weighs in at 1.19Kb. If this is drawn with more elegant SVG rather than what Inkscape churns out then it could be easier to edit and a lot smaller. There is no need to use three decimal places for the points and since there are no fonts in the SVG there is no need to bloat it out with any styles.

As well as serving via NGINX there is also mod_pagespeed to remove whitespace, comments and create src_sets for any blog images. In this way a client project based on this theme need not lose all gains as soon as an image is uploaded.

I also think the classless methodology has to be considered as the way to go with a pure document and all decorative chintz done in CSS with pseudo elements and more advanced selectors.

CSS Grid also reduces CSS size significantly and would help here. Block based layouts are fine for people that have been hacking away with margins and floats and padding things since IE6 but are absurd for newcomers to learn. CSS Grid is more maintainable as well as lighter on the download.

Not so sure about the menu being a separate page, a web page should be part of a 'book' and navigation with proper HTML5 markup for it is important for accessibility.

The motivation for this is superb and it is a lot more easy to explain to clients than accessibility. Page speed and conversion rate can be hard enough to get buy in with as it is, going green might be an easier sell.

If one really wanted to, couldn't they eliminate menu access from the user's history?