Earth Notes: On Website Technicals (2020-03)
Updated 2024-06-07.2020-03-31: Even Lazier
I am still expecting that Firefox 75 mainline will emerge in about a week, with its strong loading=lazy in place. (FF75 basically starts loading a lazy image only when just in the viewport.) That may cover ~7% of browsers; Edge may be just ahead of Firefox in usage, and be built on Chromium, but I don't think that lazy loading is on by default.
To this end I have tuned a few more things to take more advantage of laziness, eg non-lazily loading at most three desktop body images (was four), and only allowing preload of the first audio or video if both are on a page.
(2020-04-01: further reduced max lazy-loaded body images to two.)
(2020-04-07 am: now preventing video/audio preload if far enough below the fold that it may never be seen or used.)
(2020-04-07 pm: yes, Firefox 75 is out with loading=lazy working as on beta, much more aggressively than Chrome!)
I have also started emitting information to allow computation of the entire (passive, ie no user action) page weight, assuming no lazy loading. I then expect to use that to provide warnings for over-heavy pages.
2020-03-18: Coronavirus Stuff
I put myself in 'self-isolation' at home hast week because I was feeling grotty. The rest of my family were dragged into 'lockdown' with me on Monday as the rules changed for sharing a house with someone possibly infected, ie me. The kids were looking forward to getting back to school on Friday, which they will, but then all schools in England are basically shutting on Friday afternoon.
(I am still hoping to get out of the house for a walk for the first time in well over a week on Friday too.)
Happily, Radbot progress can continue with everyone working from home, though the face-to-face stuff is good and I will be pleased when we can resume it. (There are only a few things that we need to do other than at home.)
So I may get more time to work on this site!
2020-03-22: I have stopped any featuring of the 'holiday' page for now.
2020-03-14: Turning Down Ads Again
Ads still comprise a huge chunk of the weight of each page on which they are shown, indeed often the vast majority of it. So I have turned them down another notch on desktop pages, reducing the maximum shown on any one page in general, and limiting that still further (nominally to one) for all but the most popular pages.
The aim is to continue to earn some revenue, but with classier ads and less average burden on visitors.
2020-03-22: My attempts to turn down ad load were being largely ignored or overridden by AutoAds, so I have already turned them off even for desktop EOU pages for now. In any case I suspect that what the world needs right now is not more ads.
2020-03-11: Aggressive Lazy Coming Down The Pipe
I have just tried the current Firefox Beta (75.0b2) and it is clearly responding to loading=lazy. Firefox is much more aggressively lazy, and therefore likely more bandwidth efficient, than Chrome. Firefox 75 beta is apparently not loading lazy images until they just enter the viewport (vs thousands of pixels below it à la Chrome 80). That seems acceptable, though appears to create some jank of its own.
The validator vnu.jar_20.3.16 emerged today as a full release! Hurrah, and thanks to sideshowbarker!
2020-03-08: Performance Micro-optimisations
I have made a couple of very small optimisations which will likely only affect a few edge cases, especially on slower/mobile browsers, but at least should not make anything worse!
First, I have put the src attribute last in the img tag so that all the other attributes, especially decoding, are available early for when the image data is inlined and thus the src text value is large (many hundreds of bytes). My intention is to slightly improve processing and rendering of such inlined images, and any other images with a tag that crosses a packet/IO boundary.
Second, I tweaked the trailing Share42 social media buttons script at the very end of the body. It was marked async, and is now defer in the hope of allowing the DOM to be interactive (etc) a tiny bit sooner. Note: this does seem to push DOM Content Loaded back from lining up with DOM Interactive until the JS is loaded. I will see if anything complains, such as MachMetrics.
I am not expecting miracles from either change!
2020-03-14: I spotted a couple of places where I was still putting something that might be important to layout (in particular a style=width:100%) after an inlined large src attribute. Now fixed.