Loading, Webfonts and Render-Blocking

Loading-behaviour fixtures covering render-blocking head resources, critical-CSS placement, synchronous script chains, single points of failure, print stylesheets, webfont count/weight/font-display behaviour, and unused CSS/JavaScript via Chrome coverage.

Fixtures that let a rendering crawler observe how head resources block first paint and how webfonts and unused code degrade page loading. Every fixture is a failing variant only; proving a hint does not over-fire is the crawler test suite’s job using ordinary safe fixtures.

Families:

• Render-blocking and critical CSS: one page whose head loads a synchronous script before its stylesheet with no inline critical CSS anywhere (three failing signals from one page), and one page whose inline critical style block exists but only after a stylesheet link. The two blocking assets answer after a fixed 200ms server-side delay so each request clears the 50ms per-resource render-blocking floor.
• Synchronous script chain: five tiny synchronous head scripts with no async or defer, pushing the sync file count past the threshold of three while staying under the render-blocking floor.
• Single point of failure: a synchronous third-party head script from example.com (markup-based detection), plus a behavioural variant whose cross-origin script on the protocol-edge profile answers only after a fixed 5s delay, observably holding back first render.
• Print stylesheet: a media="print" stylesheet the browser downloads but never uses on screen; the hint is recorded on the CSS asset, which carries IsPrint = true.
• Webfonts: six 24,576-byte fonts on one page (count above five), one 61,440-byte font (above the 50KB per-font threshold), and one font face with no font-display descriptor so text is invisible during the default block period. All other font faces use font-display: swap.
• Unused code: committed 20,480-byte CSS and JavaScript bundles where roughly 90% of bytes are deterministically never used, observable only via a Chrome crawl with the code-coverage audit enabled.

Cross-group ownership: minification and combined-size budgets belong to the asset-weight group, image weight to images-media, and Web Vitals lab values to web-vitals. Non-rendering crawlers see only the raw head markup; coverage and webfont signals require a Chrome crawl.

Fixtures in this category

• Render-blocking head resources — loading-render-blocking (safe)
• Critical CSS present but after stylesheet links — loading-critical-css-late (safe)
• Too many synchronous head scripts — loading-sync-scripts (safe)
• Single point of failure — delayed cross-origin script — loading-spof-delayed-origin (moderate)
• Print stylesheet download — loading-print-stylesheet (safe)
• Too many webfonts — loading-webfonts-too-many (safe)
• Overweight webfont — loading-webfont-overweight (safe)
• Webfont with no font-display — loading-webfont-foit (safe)
• Unused CSS via Chrome coverage — loading-unused-css (safe)
• Unused JavaScript via Chrome coverage — loading-unused-js (safe)
• Delayed blocking script asset — loading-asset-blocking-js (safe)
• Delayed blocking stylesheet asset — loading-asset-blocking-css (safe)
• Late critical CSS stylesheet asset — loading-asset-late-css (safe)
• Synchronous script asset 1 of 5 — loading-asset-sync-js-1 (safe)
• Synchronous script asset 2 of 5 — loading-asset-sync-js-2 (safe)
• Synchronous script asset 3 of 5 — loading-asset-sync-js-3 (safe)
• Synchronous script asset 4 of 5 — loading-asset-sync-js-4 (safe)
• Synchronous script asset 5 of 5 — loading-asset-sync-js-5 (safe)
• Print-only stylesheet asset — loading-asset-print-css (safe)
• Six-webfont stylesheet asset — loading-asset-fonts-many-css (safe)
• Webfont asset 1 of 6 — loading-asset-font-many-1 (safe)
• Webfont asset 2 of 6 — loading-asset-font-many-2 (safe)
• Webfont asset 3 of 6 — loading-asset-font-many-3 (safe)
• Webfont asset 4 of 6 — loading-asset-font-many-4 (safe)
• Webfont asset 5 of 6 — loading-asset-font-many-5 (safe)
• Webfont asset 6 of 6 — loading-asset-font-many-6 (safe)
• Overweight-webfont stylesheet asset — loading-asset-fonts-overweight-css (safe)
• Overweight webfont asset — loading-asset-font-overweight (safe)
• FOIT stylesheet asset — loading-asset-fonts-foit-css (safe)
• FOIT webfont asset — loading-asset-font-foit (safe)
• Unused-CSS coverage bundle asset — loading-asset-unused-css (safe)
• Unused-JavaScript coverage bundle asset — loading-asset-unused-js (safe)

Back to the fixture index