doxa-maps/internal/check-grid-image-loading.mjs
Doxa Maps 2c397d25ef Source comments state design history and measurements as facts, without quoting or naming anyone
Comments in library/ and internal/ that quoted a person, attributed a decision to one, used first person,
named fleet agents or carried private host names now state the same technical fact in neutral words:
poster-render (including the comments it writes into generated posters), packet-render, the poster and
research scripts, PosterWall, DataTable, the legends, the layouts and the gates. The network-policy note
states the policy itself. Behaviour is unchanged: a few printed gate messages and reason labels drop an
agent name, the poster-render integrity pin follows its comment-only edit, and series.json changes only in
its _meta and _why notes. The historical poster design snapshots (library/scripts/posters/snapshots/),
which nothing reads, are removed.
2026-10-01 00:37:17 +00:00

71 lines
3.8 KiB
JavaScript

#!/usr/bin/env node
/**
* check-grid-image-loading — the people-group cards must not fetch 24 photos during boot.
*
* THE MEASUREMENT (SR-LOAD on 21ebb4f26): a cold load of Simple Research downloaded 24
* people-group photos, 5.3 MB, DURING BOOT — competing with the map engine and the API data on the
* same connection. Nothing was wrong with any single image; there was simply no instruction about
* WHEN to fetch them, so the browser fetched them all at once.
*
* ★ WHY A GATE AND NOT JUST THE FIX. This component is being MERGED with the regions list right now
* (a settled decision, built by the regions plugin), and a merge rewrites markup. Four attributes on
* one <img> are exactly the kind of thing that survives a review and not a rewrite — and losing them
* is invisible: the page still works, it just costs 5.3 MB again on every cold load.
*
* ★ AND IT ASSERTS THE FIRST ROW IS EAGER, which is the half a naive "add loading=lazy everywhere"
* would get wrong. Lazy-loading what the reader is already looking at trades a visible flash of empty
* cards for bytes nobody saves.
*
* Exit 0 pass · 1 fail.
*/
import { readFileSync } from 'node:fs'
import { resolve, dirname, join } from 'node:path'
import { fileURLToPath } from 'node:url'
const ROOT = resolve(dirname(fileURLToPath(import.meta.url)), '..')
const TAG = 'GRID-IMAGE-LOADING'
const F = 'plugin-designs/people-groups-grid/people-groups-grid.vue'
const fails = []
const src = readFileSync(join(ROOT, F), 'utf8')
const m = src.match(/<img\b[^>]*class="uupg__image"[^>]*>/s)
if (!m) {
fails.push(`${F}: the card image element was not found — it was renamed or restructured, and this `
+ 'gate would pass while checking nothing. Re-point it before trusting a green run.')
} else {
const tag = m[0]
if (!/:loading=/.test(tag)) {
fails.push('the card image has no loading attribute, so every photo is fetched during boot — '
+ 'a cold load measured 24 of them, 5.3 MB, competing with the map and the API data.')
}
if (!/decoding="async"/.test(tag)) fails.push('the card image does not decode off the main thread (decoding="async").')
if (!/\bwidth=/.test(tag) || !/\bheight=/.test(tag)) {
fails.push('the card image states no intrinsic size, so the box is unreserved before the '
+ 'stylesheet applies. (.uupg__image\'s aspect-ratio holds it afterwards; these cover the gap.)')
}
if (!/:fetchpriority=/.test(tag)) fails.push('off-screen images are not de-prioritised (fetchpriority).')
// ★ the first row must be EAGER — a bare loading="lazy" would pass every check above and be wrong.
if (/loading="lazy"/.test(tag) && !/:loading=/.test(tag)) {
fails.push('the card image is UNCONDITIONALLY lazy, so the row the reader is already looking at '
+ 'loads late. The first row must stay eager.')
}
if (!/EAGER_IMAGES/.test(tag)) {
fails.push('the eager/lazy split is not keyed on EAGER_IMAGES, so nothing ties it to the column count.')
}
}
// and the constant must exist and be a plausible first-row ceiling
const c = src.match(/const EAGER_IMAGES\s*=\s*(\d+)/)
if (!c) fails.push('EAGER_IMAGES is gone; the first-row exemption has no source.')
else if (Number(c[1]) < 3 || Number(c[1]) > 8) {
fails.push(`EAGER_IMAGES is ${c[1]} — the grid is repeat(auto-fill, minmax(240px, 1fr)), 1 column on a `
+ 'phone and 3-5 on a desktop, so a first-row ceiling outside 3..8 is either short (a visible '
+ 'lazy-load in view) or so generous it undoes the saving.')
}
if (fails.length) {
console.error(`${TAG}: FAIL`)
for (const f of fails) console.error(` ✗ ${f}`)
process.exit(1)
}
console.log(`${TAG}: PASS — card photos past the first row load lazily, at low priority, decoded off the main `
+ 'thread, with their box reserved; the first row stays eager.')