Article pages were shifting during load. Lighthouse reported CLS 0.303, where anything
above 0.1 counts as poor.
My ops agent wrote the cause into its log:
Article pages CLS 0.303, caused by
.prose img
missingwidth
/height
.
Fixing requires fetching intrinsic dimensions for 125 images — separate task.
That diagnosis looks entirely correct. Images without declared dimensions give the browser
nothing to reserve space with, so content jumps when they load. It's the canonical cause of
layout shift; every article about CLS leads with it.
When I sat down to fix it the next day, I did one thing first: I counted how many images were actually missing dimensions.
The answer was 4. The other 155 already had them.
Not in the physics — image dimensions genuinely do affect CLS. It went wrong by applying a familiar cause without checking the scene.
The real problem: those 155 images had dimensions, and the dimensions were wrong.
These posts were written in 2017. The HTML looks like this:
<img src="https://i.imgur.com/KXKbv0d.jpg" width="500" height="500">
The author meant "display this at 500×500." They did not mean "this image is 500×500."
The image is actually 1361×738.
So here's the sequence:
width="500" height="500"
, reserves a square based on that 1:1 ratioWrong dimensions are worse than no dimensions. Without them, the browser knows it doesn't
know. With wrong ones, it confidently reserves the wrong space.
I fetched intrinsic dimensions for all 119 unique image URLs and compared:
145 of 159 were wrong. 91%.
If the log had said "cause unknown," I'd have investigated.
Instead it gave me something plausible, specific, and immediately actionable. Following it,
I'd have added dimensions to those 4 images, watched CLS barely move, and started suspecting
something else entirely — continuing to search from an already-misled starting point.
A wrong diagnosis costs more than no diagnosis, because it consumes the attention you would otherwise have spent doubting.
The shape of the mistake is worth naming: it treated the common cause as this case's cause.
Missing dimensions genuinely is the most likely explanation for CLS, so it was a good guess.
The failure wasn't the guess. It was not spending one command to test the guess before committing to it.
That command takes under ten seconds:
grep -o '<img[^>]*>' *.md | grep -vc 'width='
Worth stating plainly, because it reads that way if I don't.
The same system wrote that log, and in the same pass it got a lot right: it recorded the exact
CLS figure, identified the affected selector, filed the work as its own task, and left a note in
the status file saying "new articles must always carry real width/height so this doesn't accumulate again."
That preventive note was correct. The diagnosis was wrong. Both came from the same thinking.
People do this constantly. A familiar symptom triggers the most common cause, and subsequent
observations get bent toward it. The difference is that a system writes its guess down as a confident single line, files it, and tomorrow you read that line as an established fact.
1. Measure before fixing.
Not the severity — I already had that (CLS 0.303). Measure whether the cause I assume actually holds here. It's usually one command. Ten seconds would have redirected this entire task.
2. Separate "measured" from "inferred" in the log.
CLS 0.303
and selector .prose img
were measured. because they lack width/height
was
inferred. They sat on the same line and read as equally reliable the next morning. Inferences
now have to be labelled as inferences.
3. When corrected, amend the original diagnosis explicitly.
The log now says "the original diagnosis was wrong" rather than quietly swapping in the right
answer. Next time I need to know more than the correct answer — I need to know how I got it wrong.
There's a tail to this.
After replacing every declared size with the real one, one page went from 0.303 to 0.212.
Not zero.
Another round of digging: that 0.212 was manufactured by the local environment. The images
are on imgur, imgur's hotlink protection rejects a localhost referer, the images fail, the
browser renders alt text at a different size, and the layout shifts again.
Measured in production: 0.
So the same number got explained once by a wrong diagnosis and produced once by a wrong
environment. Both times I nearly acted on it.