imgtune 0.1.0 → 0.3.0

package/dist/replay.js

@@ -0,0 +1,20 @@
+// Replay of recorded pages (development tooling, not a user option). With IMGTUNE_REPLAY_HAR=<dir> set, a scan serves each
+// page from the HAR that scripts/record-sites.mjs recorded for it (one per URL and viewport), so reruns need no network.
+// A request the HAR does not hold is aborted. Unset, nothing changes.
+import { createHash } from "node:crypto";
+import { existsSync } from "node:fs";
+import { join } from "node:path";
+/** The file-name key of a page URL. */
+export function harKey(url) {
+    return createHash("sha1").update(url).digest("hex").slice(0, 12);
+}
+/** The HAR file of a page at a viewport, or undefined when replay is off. Throws when replay is on and the HAR is missing. */
+export function replayHarPath(pageUrl, viewport, env = process.env) {
+    const dir = env.IMGTUNE_REPLAY_HAR;
+    if (dir === undefined || dir === "")
+        return undefined;
+    const file = join(dir, `${harKey(pageUrl)}-${viewport}.har`);
+    if (!existsSync(file))
+        throw new Error(`no recorded HAR for ${pageUrl} at ${viewport} in ${dir}`);
+    return file;
+}

package/dist/resources/audio.js

@@ -0,0 +1,248 @@
+// Audio analyzer: the audio files a page loads (mp3, wav, ogg, m4a, aac, flac, opus). Each file is probed with the system
+// ffprobe; a WAV or FLAC, a lossy file over 128 kbps stereo (64 kbps mono) and a stereo file whose channels are the same
+// get a re-encode to Opus. The saving is measured on a 10 s sample, extrapolated to the whole file and labelled an
+// estimate. A file that the page downloads on load (autoplay or preload="auto") also gets the lazy-loading fix. Without
+// ffmpeg, the analyzer reports the bytes and the extension only. It never throws.
+import { createHash } from "node:crypto";
+import { mkdtemp, rm, writeFile } from "node:fs/promises";
+import { tmpdir } from "node:os";
+import { extname, join } from "node:path";
+import { probeAudio, probeFfmpeg, runFfmpeg } from "../ffmpeg.js";
+import { heavyValue } from "./cache.js";
+/** File extensions treated as audio when the content type is not audio/*. */
+const AUDIO_EXTS = new Set(["mp3", "wav", "ogg", "oga", "m4a", "aac", "flac", "opus"]);
+/** Adaptive-stream pieces (HLS, DASH): out of scope, the bytes of one segment say nothing about the stream. */
+const SEGMENT_PATH = /(^|\/)(hls|dash|segments?|chunks?)(\/|$)|\.(ts|m4s|m3u8)$/i;
+const LOSSLESS_EXTS = new Set(["wav", "flac", "aif", "aiff"]);
+const LOSSLESS_CODEC = /^(pcm_|flac|alac|wavpack|ape|tta)/;
+/** The length of the sample the re-encodes are measured on, in seconds. */
+export const SAMPLE_S = 10;
+/** The re-encode targets: Opus 96 kbps stereo, Opus 64 kbps mono; AAC 128 kbps as the fallback. */
+export const OPUS_STEREO_KBPS = 96;
+export const OPUS_MONO_KBPS = 64;
+export const AAC_KBPS = 128;
+export const AAC_MONO_KBPS = 64;
+/** Bitrates above which a file is re-encoded: 128 kbps stereo, 64 kbps mono. */
+const STEREO_LIMIT_KBPS = 128;
+const MONO_LIMIT_KBPS = 64;
+/** A re-encode is reported only when it saves this much, absolutely and as a share of the bytes per view. */
+export const MIN_SAVING_BYTES = 5 * 1024;
+export const MIN_SAVING_SHARE = 0.1;
+/** Side-to-mid energy ratio under which a stereo file counts as one channel (-40 dB). */
+const NEAR_MONO_RATIO = 1e-4;
+const PROBE_TIMEOUT_MS = 10_000;
+const ENCODE_TIMEOUT_MS = 30_000;
+function hashUrl(url) {
+    return createHash("sha1").update(url).digest("hex").slice(0, 12);
+}
+function fileName(url) {
+    try {
+        const name = decodeURIComponent(new URL(url).pathname.split("/").pop() ?? "");
+        return name || "audio";
+    }
+    catch {
+        return "audio";
+    }
+}
+function extOf(url) {
+    try {
+        return extname(new URL(url).pathname).slice(1).toLowerCase();
+    }
+    catch {
+        return "";
+    }
+}
+function formatBytes(n) {
+    if (n < 1024)
+        return `${Math.round(n)} B`;
+    if (n < 1024 * 1024)
+        return `${Math.round(n / 1024)} KB`;
+    return `${(n / (1024 * 1024)).toFixed(1)} MB`;
+}
+function isAudioRecord(r) {
+    if (SEGMENT_PATH.test(new URL(r.url).pathname))
+        return false;
+    return r.contentType.startsWith("audio/") || AUDIO_EXTS.has(extOf(r.url));
+}
+/** Encodes the first `sampleS` seconds of `file`; the encoded length in bytes, or undefined when ffmpeg fails. */
+async function encodedSampleBytes(file, o) {
+    const codecArgs = o.codec === "opus"
+        ? ["-c:a", "libopus", "-b:a", `${o.kbps}k`, "-f", "ogg"]
+        : ["-c:a", "aac", "-b:a", `${o.kbps}k`, "-f", "adts"];
+    const r = await runFfmpeg(["-i", file, "-t", String(o.sampleS), "-vn", "-ac", o.mono ? "1" : "2", ...codecArgs, "pipe:1"], { timeoutMs: ENCODE_TIMEOUT_MS });
+    return r.code === 0 && r.stdout.length > 0 ? r.stdout.length : undefined;
+}
+/** True when the two channels of the first SAMPLE_S seconds are the same signal (the side is 40 dB below the mid). */
+async function isNearMono(file) {
+    const r = await runFfmpeg(["-i", file, "-t", String(SAMPLE_S), "-vn", "-ac", "2", "-ar", "16000", "-f", "f32le", "pipe:1"], { timeoutMs: ENCODE_TIMEOUT_MS });
+    if (r.code !== 0 || r.stdout.length < 8)
+        return false;
+    const copy = r.stdout.buffer.slice(r.stdout.byteOffset, r.stdout.byteOffset + r.stdout.byteLength);
+    const samples = new Float32Array(copy, 0, Math.floor(copy.byteLength / 4));
+    let mid = 0;
+    let side = 0;
+    for (let i = 0; i + 1 < samples.length; i += 2) {
+        const m = (samples[i] + samples[i + 1]) / 2;
+        const s = (samples[i] - samples[i + 1]) / 2;
+        mid += m * m;
+        side += s * s;
+    }
+    return mid > 0 && side / mid < NEAR_MONO_RATIO;
+}
+/** The finding for a file that could not be probed (no ffmpeg, no body, or an unreadable file): bytes only. */
+function unprobedFinding(r, eager, selector, reason) {
+    const name = fileName(r.url);
+    return {
+        id: `audio:${hashUrl(r.url)}`,
+        kind: "audio",
+        url: r.url,
+        bytes: r.bytes,
+        savedBytes: 0,
+        estimate: true,
+        title: `audio ${name}: ${formatBytes(r.bytes)} per view${eager ? ", fetched on load" : ""}; ${reason}`,
+        fix: ["install ffmpeg to measure the re-encode (ffmpeg enables the full hints)"],
+        details: { fetchedBytes: r.bytes, eager, reason },
+        ...(selector !== undefined ? { locator: { selector } } : {}),
+    };
+}
+async function analyzeOne(r, ctx, ffmpegOk) {
+    const el = ctx.audio.find((a) => a.src === r.url);
+    const eager = el !== undefined && (el.autoplay || el.preload === "auto");
+    const selector = el?.selector;
+    if (!r.body)
+        return unprobedFinding(r, eager, selector, "no body in the scan (over 20 MB or not captured), not probed");
+    if (!ffmpegOk)
+        return unprobedFinding(r, eager, selector, "ffmpeg not found, bitrate not measured");
+    const dir = await mkdtemp(join(tmpdir(), "imgtune-audio-"));
+    try {
+        const ext = extOf(r.url) || "bin";
+        const file = join(dir, `in.${ext}`);
+        await writeFile(file, r.body);
+        const probe = await probeAudio(file, PROBE_TIMEOUT_MS);
+        if (!probe)
+            return unprobedFinding(r, eager, selector, "ffprobe could not read it");
+        const name = fileName(r.url);
+        const stereo = probe.channels >= 2;
+        const bitrate = probe.bitrate ?? (probe.durationS > 0 ? (r.bytes * 8) / probe.durationS : undefined);
+        const kbps = bitrate === undefined ? undefined : Math.round(bitrate / 1000);
+        // The whole file: the container's bitrate times the length, when both are given (a partial fetch then shows).
+        const fullBytes = probe.bitrate !== undefined && probe.durationS > 0
+            ? Math.max(r.bytes, Math.round((probe.bitrate * probe.durationS) / 8))
+            : r.bytes;
+        const perView = eager ? fullBytes : r.bytes;
+        const lossless = LOSSLESS_EXTS.has(ext) || LOSSLESS_CODEC.test(probe.codec);
+        const overLimit = kbps !== undefined && kbps > (stereo ? STEREO_LIMIT_KBPS : MONO_LIMIT_KBPS);
+        const nearMono = stereo ? await isNearMono(file) : false;
+        const wantsReencode = lossless || overLimit || nearMono;
+        const mono = !stereo || nearMono;
+        const kbpsTarget = mono ? OPUS_MONO_KBPS : OPUS_STEREO_KBPS;
+        const details = {
+            codec: probe.codec,
+            channels: probe.channels,
+            sampleRate: probe.sampleRate,
+            durationS: probe.durationS,
+            bitrateKbps: kbps,
+            lossless,
+            nearMono,
+            fetchedBytes: r.bytes,
+            fullBytes,
+            eager,
+            preload: el?.preload,
+            autoplay: el?.autoplay ?? false,
+        };
+        let encodedFull;
+        let aacFull;
+        let saved = 0;
+        let reportReencode = false;
+        if (wantsReencode && probe.durationS > 0 && fullBytes > 0) {
+            const sampleS = Math.min(SAMPLE_S, probe.durationS);
+            // The sample encodes are heavy and depend on the file and the settings: once per run, and not once the budget is spent
+            // (then no re-encode is claimed for the file).
+            const sampleKey = `audio:${hashUrl(r.url)}:${r.bytes}:${mono ? 1 : 0}:${sampleS}`;
+            const opusSample = await heavyValue(`${sampleKey}:opus:${kbpsTarget}`, () => encodedSampleBytes(file, { codec: "opus", mono, kbps: kbpsTarget, sampleS }));
+            const aacKbps = mono ? AAC_MONO_KBPS : AAC_KBPS;
+            const aacSample = await heavyValue(`${sampleKey}:aac:${aacKbps}`, () => encodedSampleBytes(file, { codec: "aac", mono, kbps: aacKbps, sampleS }));
+            if (opusSample !== undefined) {
+                encodedFull = Math.round((opusSample * probe.durationS) / sampleS);
+                aacFull = aacSample === undefined ? undefined : Math.round((aacSample * probe.durationS) / sampleS);
+                const encodedPerView = Math.round(encodedFull * (perView / fullBytes));
+                saved = perView - encodedPerView;
+                reportReencode = saved >= Math.max(MIN_SAVING_BYTES, MIN_SAVING_SHARE * perView);
+                details.opusFullBytes = encodedFull;
+                details.aacFullBytes = aacFull;
+                details.targetKbps = kbpsTarget;
+                details.targetChannels = mono ? 1 : 2;
+            }
+        }
+        if (!reportReencode && !eager)
+            return undefined;
+        const channelsArg = mono ? " -ac 1" : "";
+        const fix = [];
+        if (reportReencode && encodedFull !== undefined) {
+            fix.push(`re-encode to Opus: ffmpeg -i ${name} -vn${channelsArg} -c:a libopus -b:a ${kbpsTarget}k out.webm ` +
+                `(expected ~${formatBytes(encodedFull)} for the whole file)`);
+            if (aacFull !== undefined) {
+                fix.push(`or AAC for older Safari: ffmpeg -i ${name} -vn${channelsArg} -c:a aac -b:a ${mono ? AAC_MONO_KBPS : AAC_KBPS}k -movflags +faststart out.m4a ` +
+                    `(expected ~${formatBytes(aacFull)})`);
+            }
+        }
+        if (eager) {
+            fix.push(`lazy load: <audio preload="none"> (or drop autoplay) so the file is fetched on play, not on load; ` +
+                `saves ${formatBytes(fullBytes)} per view on load`);
+        }
+        const eagerNote = eager ? ", fetched on load" : "";
+        const channelsNote = nearMono ? "stereo with identical channels" : stereo ? "stereo" : "mono";
+        const savedBytes = reportReencode ? saved : fullBytes;
+        return {
+            id: `audio:${hashUrl(r.url)}`,
+            kind: "audio",
+            url: r.url,
+            bytes: perView,
+            savedBytes,
+            estimate: true,
+            title: `audio ${name}: ${probe.codec}${kbps === undefined ? "" : ` ${kbps} kbps`} ${channelsNote}, ` +
+                `${formatBytes(perView)} per view${eagerNote}` +
+                (reportReencode && encodedFull !== undefined ? `; Opus ${kbpsTarget}k ~${formatBytes(encodedFull)}` : ""),
+            fix,
+            details,
+            ...(selector !== undefined ? { locator: { selector } } : {}),
+        };
+    }
+    finally {
+        await rm(dir, { recursive: true, force: true });
+    }
+}
+export const analyzer = {
+    kind: "audio",
+    wants(r) {
+        try {
+            return isAudioRecord(r);
+        }
+        catch {
+            return false;
+        }
+    },
+    async analyze(records, ctx) {
+        try {
+            const caps = await probeFfmpeg();
+            const ffmpegOk = caps.ffmpeg && caps.ffprobe;
+            const out = [];
+            for (const r of records) {
+                try {
+                    if (!isAudioRecord(r))
+                        continue;
+                    const f = await analyzeOne(r, ctx, ffmpegOk);
+                    if (f)
+                        out.push(f);
+                }
+                catch {
+                    // One unreadable file does not drop the others.
+                }
+            }
+            return out;
+        }
+        catch {
+            return [];
+        }
+    },
+};

package/dist/resources/brotli.js

@@ -0,0 +1,22 @@
+import { brotliCompressSync, constants } from "node:zlib";
+/** Bodies up to this size are compressed at brotli quality 11; bigger ones at quality 9 and the figure is an estimate. */
+export const BROTLI_FULL_MAX = 512 * 1024;
+/** Brotli size of a buffer, the wire size an origin with brotli would send. */
+export function brotliSize(buf) {
+    const full = buf.length <= BROTLI_FULL_MAX;
+    const out = brotliCompressSync(buf, {
+        params: {
+            [constants.BROTLI_PARAM_QUALITY]: full ? 11 : 9,
+            [constants.BROTLI_PARAM_SIZE_HINT]: buf.length,
+        },
+    });
+    return { bytes: out.length, estimate: !full };
+}
+/**
+ * Brotli size of a buffer at quality 5: about 20 times faster than quality 11, for the analyzers that compare two sizes of
+ * the same kind (the rounded and the served JSON), where the ratio is what the finding reports. Always an estimate.
+ */
+export function brotliSizeFast(buf) {
+    const out = brotliCompressSync(buf, { params: { [constants.BROTLI_PARAM_QUALITY]: 5, [constants.BROTLI_PARAM_SIZE_HINT]: buf.length } });
+    return { bytes: out.length, estimate: true };
+}

package/dist/resources/cache.js

@@ -0,0 +1,59 @@
+// The resource analyzers' heavy work, shared across the run. A heavy step (a brotli-11 encode, a WOFF2 encode, a re-encode, an
+// SVGO run, a sample encode) asks for its value by a key that holds the content (a digest), so a resource that two viewports
+// or two pages load is computed once. The values are kept in the run's memo (in process) and in the result cache (across
+// runs, when the cache is on). The run's resource budget (--resource-time) bounds the time spent computing them: once it is
+// spent, a step that is not already known is not computed, and the caller reports the item as not measured.
+import { createHash } from "node:crypto";
+import { AsyncLocalStorage } from "node:async_hooks";
+import { measure } from "../timing.js";
+/** The default time budget of the heavy resource work per run, in milliseconds (the spec: 60 s total). */
+export const DEFAULT_RESOURCE_BUDGET_MS = 60_000;
+/** A fresh run state with the given budget (default DEFAULT_RESOURCE_BUDGET_MS). */
+export function newResourceRun(budgetMs = DEFAULT_RESOURCE_BUDGET_MS) {
+    return { budgetMs, spentMs: 0, memo: new Map() };
+}
+const scopes = new AsyncLocalStorage();
+/** Runs `fn` with the run's state (a fresh one when none is given) and the run's result cache (undefined: no disk cache). */
+export function withResourceScope(cache, fn, run = newResourceRun()) {
+    return scopes.run({ cache, run }, fn);
+}
+/**
+ * The value for `key`: memoised for the run, read from the result cache, else computed (and stored). Undefined only when the
+ * value is not known and the budget is spent (`budgeted` true); `compute` is then not run. Never throws by itself.
+ */
+export async function heavyValue(key, compute, budgeted = true) {
+    const scope = scopes.getStore();
+    const run = scope?.run ?? newResourceRun();
+    const fullKey = `resources:v1:${key}`;
+    const known = run.memo.get(fullKey);
+    if (known !== undefined)
+        return (await known);
+    if (budgeted && run.spentMs >= run.budgetMs)
+        return undefined;
+    const pending = (async () => {
+        const stored = scope?.cache ? await scope.cache.getJson(fullKey) : undefined;
+        if (stored !== undefined)
+            return stored;
+        const start = performance.now();
+        const value = await measure("resources heavy", compute);
+        run.spentMs += performance.now() - start;
+        await scope?.cache?.putJson(fullKey, value);
+        return value;
+    })();
+    run.memo.set(fullKey, pending);
+    try {
+        return await pending;
+    }
+    catch (error) {
+        run.memo.delete(fullKey);
+        throw error;
+    }
+}
+/** The value for `key` with no budget (always computed once per run). The cheap steps use this. */
+export function cachedValue(key, compute) {
+    return heavyValue(key, compute, false);
+}
+/** A short digest of a buffer or text, for cache keys. */
+export function digestOf(data) {
+    return createHash("sha256").update(data).digest("hex");
+}

package/dist/resources/capture.js

@@ -0,0 +1,225 @@
+import { isFirstParty } from "../third-party.js";
+import { ANALYZERS } from "./index.js";
+/** A body larger than this is never kept (the record keeps its bytes): see ResourceRecord.body. */
+export const RESOURCE_BODY_MAX = 20 * 1024 * 1024;
+/** The content type without parameters, lower-cased ("text/css; charset=utf-8" is "text/css"). */
+export function contentTypeOf(header) {
+    return (header ?? "").split(";")[0].trim().toLowerCase();
+}
+/** The content encoding the server applied, lower-cased ("br", "gzip", ...), or undefined for an identity body. */
+export function contentEncodingOf(header) {
+    const value = (header ?? "").split(",")[0].trim().toLowerCase();
+    return value === "" || value === "identity" ? undefined : value;
+}
+/** Whether any registered analyzer wants a response with this record (decided before its body is read). */
+export function anyAnalyzerWants(record) {
+    return ANALYZERS.some((analyzer) => analyzer.wants(record));
+}
+/**
+ * The record of a response. Its bytes are the Content-Length header when the response has one, so a record whose body is still
+ * streaming at the settle keeps its size (and its analyses can use the size alone); readResourceBody replaces it with the
+ * measured size once the body is read.
+ */
+export function resourceRecordOf(response, pageUrl, viewport, contentType) {
+    const headers = response.headers();
+    const declared = Number(headers["content-length"]);
+    return {
+        url: response.url(),
+        pageUrl,
+        viewport,
+        resourceType: response.request().resourceType(),
+        contentType: contentTypeOf(contentType),
+        contentEncoding: contentEncodingOf(headers["content-encoding"]),
+        bytes: Number.isFinite(declared) && declared >= 0 ? declared : 0,
+        status: response.status(),
+        thirdParty: !isFirstParty(pageUrl, response.url()),
+    };
+}
+/**
+ * Settles a resource record once its response has finished: the bytes (the encoded size the browser counted, else the
+ * Content-Length), and the decoded body when an analyzer wants it and it is within RESOURCE_BODY_MAX.
+ */
+/** How long a scan waits for the resource bodies of a page view before it moves on (a body still streaming is fetched again by the phase). */
+export const RESOURCE_BODY_SETTLE_MS = 1500;
+export async function readResourceBody(record, response) {
+    await response.finished().catch(() => null);
+    let encoded = 0;
+    try {
+        encoded = (await response.request().sizes()).responseBodySize;
+    }
+    catch {
+        encoded = 0;
+    }
+    const length = Number(response.headers()["content-length"]);
+    record.bytes = encoded > 0 ? encoded : Number.isFinite(length) && length >= 0 ? length : 0;
+    if (record.bytes > RESOURCE_BODY_MAX || !anyAnalyzerWants(record))
+        return;
+    const body = await response.body().catch(() => undefined);
+    if (body === undefined)
+        return;
+    // Playwright's headers can lack a Content-Encoding the server sent (seen on an SVG served as br): a body that decodes
+    // to more than the browser counted on the wire was encoded, so it is not a candidate for compression.
+    // A wire size under half the decoded body is a compressed response whose Content-Encoding Playwright did not report. A wire
+    // size near the body is an uncompressed one (the reported size of a replayed or cached response can differ a little, and
+    // must not turn it into "compressed": that dropped the findings of uncompressed JSON on two real sites).
+    if (record.contentEncoding === undefined && encoded > 0 && encoded * 2 < body.length)
+        record.contentEncoding = "unknown";
+    record.bytes = body.length;
+    if (body.length <= RESOURCE_BODY_MAX)
+        record.body = body;
+}
+/** What the page shows, read in one page.evaluate after the scroll (see types.ts PageContext). Never throws. */
+export async function readPageContext(page) {
+    return page
+        .evaluate(() => {
+        const TEXT_MAX = 200_000;
+        const MAX_TEXT_ELEMENTS = 6000;
+        const unquote = (value) => value.trim().replace(/^["']|["']$/g, "").toLowerCase();
+        const selectorOf = (el) => {
+            const id = /^[A-Za-z][\w-]*$/.test(el.id) ? `#${el.id}` : "";
+            const cls = Array.from(el.classList).slice(0, 2).map((c) => `.${c}`).join("");
+            return `${el.tagName.toLowerCase()}${id}${cls}`;
+        };
+        const rectOf = (el) => {
+            const r = el.getBoundingClientRect();
+            return { width: Math.round(r.width), height: Math.round(r.height) };
+        };
+        // The visible text, capped.
+        const text = (document.body?.innerText ?? "").slice(0, TEXT_MAX);
+        // Font faces the rendered text uses: the first family of each text-bearing element's computed font stack.
+        const usedKeys = new Set();
+        const usedFonts = [];
+        let scanned = 0;
+        for (const el of Array.from(document.body?.querySelectorAll("*") ?? [])) {
+            if (scanned >= MAX_TEXT_ELEMENTS)
+                break;
+            const hasText = Array.from(el.childNodes).some((n) => n.nodeType === Node.TEXT_NODE && (n.textContent ?? "").trim() !== "");
+            if (!hasText)
+                continue;
+            scanned++;
+            const style = getComputedStyle(el);
+            const family = unquote(style.fontFamily.split(",")[0] ?? "");
+            const weight = Number(style.fontWeight) || 400;
+            const fontStyle = style.fontStyle === "normal" ? "normal" : style.fontStyle;
+            const key = `${family}|${weight}|${fontStyle}`;
+            if (family !== "" && !usedKeys.has(key)) {
+                usedKeys.add(key);
+                usedFonts.push({ family, weight, style: fontStyle });
+            }
+        }
+        const faceRules = new Map();
+        for (const sheet of Array.from(document.styleSheets)) {
+            let rules;
+            try {
+                rules = sheet.cssRules;
+            }
+            catch {
+                continue;
+            }
+            for (const rule of Array.from(rules)) {
+                if (!(rule instanceof CSSFontFaceRule))
+                    continue;
+                const family = unquote(rule.style.getPropertyValue("font-family"));
+                const weight = rule.style.getPropertyValue("font-weight") || "400";
+                const fontStyle = rule.style.getPropertyValue("font-style") || "normal";
+                const src = rule.style.getPropertyValue("src");
+                const match = /url\(\s*["']?([^"')]+)["']?\s*\)/.exec(src);
+                const info = {
+                    url: match ? new URL(match[1], sheet.href ?? document.baseURI).href : undefined,
+                    unicodeRange: rule.style.getPropertyValue("unicode-range") || undefined,
+                };
+                faceRules.set(`${family}|${weight}|${fontStyle}`, info);
+            }
+        }
+        const fontFaces = [];
+        document.fonts.forEach((face) => {
+            const family = unquote(face.family);
+            const info = faceRules.get(`${family}|${face.weight}|${face.style}`);
+            fontFaces.push({
+                family,
+                weight: face.weight,
+                style: face.style,
+                status: face.status,
+                ...(info?.url !== undefined ? { url: info.url } : {}),
+                ...(info?.unicodeRange !== undefined ? { unicodeRange: info.unicodeRange } : {}),
+            });
+        });
+        const icons = Array.from(document.querySelectorAll("link[rel*='icon']"))
+            .filter((link) => link.href !== "")
+            .map((link) => ({
+            rel: link.rel,
+            href: link.href,
+            ...(link.getAttribute("sizes") ? { sizes: link.getAttribute("sizes") } : {}),
+            ...(link.type ? { type: link.type } : {}),
+        }));
+        const audio = Array.from(document.querySelectorAll("audio")).map((el) => ({
+            src: el.currentSrc || el.src || el.querySelector("source")?.src || "",
+            autoplay: el.autoplay,
+            loop: el.loop,
+            preload: el.preload,
+            muted: el.muted,
+            selector: selectorOf(el),
+        }));
+        const lottie = Array.from(document.querySelectorAll("lottie-player, dotlottie-player, dotlottie-wc, [data-animation-path], [data-lottie-src]")).map((el) => {
+            const src = el.getAttribute("src") ?? el.getAttribute("data-animation-path") ?? el.getAttribute("data-lottie-src") ?? undefined;
+            return { ...(src ? { src: new URL(src, document.baseURI).href } : {}), selector: selectorOf(el), ...rectOf(el) };
+        });
+        const models = Array.from(document.querySelectorAll("model-viewer")).map((el) => {
+            const src = el.getAttribute("src") ?? undefined;
+            return { ...(src ? { src: new URL(src, document.baseURI).href } : {}), selector: selectorOf(el), ...rectOf(el) };
+        });
+        return { text, usedFonts, fontFaces, icons, audio, lottie, models };
+    })
+        .catch(() => undefined);
+}
+/**
+ * The @font-face rules of a stylesheet's text, with each src URL made absolute against the sheet's URL. Used for the
+ * sheets the browser's CSSOM does not show (cross-origin ones), read from the captured CSS response bodies.
+ */
+export function fontFaceRulesOf(css, cssUrl) {
+    const out = [];
+    for (const match of css.matchAll(/@font-face\s*\{([^}]*)\}/gi)) {
+        const body = match[1];
+        const prop = (name) => {
+            const found = new RegExp(`(?:^|[;\\s])${name}\\s*:\\s*([^;]+)`, "i").exec(body);
+            return found ? found[1].trim() : undefined;
+        };
+        const src = /url\(\s*["']?([^"')]+)["']?\s*\)/i.exec(prop("src") ?? "");
+        if (!src)
+            continue;
+        let url;
+        try {
+            url = new URL(src[1], cssUrl).href;
+        }
+        catch {
+            continue;
+        }
+        out.push({
+            family: (prop("font-family") ?? "").replace(/["']/g, "").trim().toLowerCase(),
+            weight: prop("font-weight") ?? "normal",
+            style: prop("font-style") ?? "normal",
+            unicodeRange: prop("unicode-range"),
+            url,
+        });
+    }
+    return out;
+}
+const normalWeight = (w) => (w === "normal" ? "400" : w === "bold" ? "700" : w.replace(/\s+/g, " ").trim());
+/**
+ * The faces of a page with the URL and unicode-range the rules declare, where the page's own face (from the CSSOM) has
+ * none: matched by family, weight and style, and by unicode-range when several rules share them. A face no rule matches
+ * is returned as it is.
+ */
+export function completeFontFaces(faces, rules) {
+    return faces.map((face) => {
+        if (face.url !== undefined)
+            return face;
+        const family = face.family.replace(/["']/g, "").trim().toLowerCase();
+        const same = rules.filter((r) => r.family === family && normalWeight(r.weight) === normalWeight(face.weight) && r.style.split(" ")[0] === face.style.split(" ")[0]);
+        const rangeOf = (r) => (r ?? "").replace(/\s+/g, "").toUpperCase();
+        const pick = same.find((r) => rangeOf(r.unicodeRange) === rangeOf(face.unicodeRange)) ?? same[0];
+        if (pick === undefined)
+            return face;
+        return { ...face, url: pick.url, ...(face.unicodeRange === undefined && pick.unicodeRange !== undefined ? { unicodeRange: pick.unicodeRange } : {}) };
+    });
+}