{ "@context": "https://schema.org", "@id": "https://webspecification.com/spec/performance/critical-css.jsonld", "@graph": [ { "@type": "TechArticle", "@id": "https://webspecification.com/spec/performance/critical-css/#article", "headline": "Critical CSS and render-blocking resources", "description": "Inline the CSS needed for above-the-fold content and defer the rest. Render-blocking resources in are the single biggest cause of slow first paint.", "url": "https://webspecification.com/spec/performance/critical-css/", "inLanguage": "en", "isPartOf": { "@type": "WebSite", "@id": "https://webspecification.com/#website", "name": "Web Specification Studio", "url": "https://webspecification.com" }, "author": { "@type": "Person", "name": "Web Specification Studio", "url": "https://webspecification.com" }, "publisher": { "@type": "Organization", "@id": "https://webspecification.com/#organization", "name": "Web Specification Studio", "url": "https://webspecification.com" }, "license": "https://creativecommons.org/licenses/by/4.0/", "dateModified": "2026-05-29T09:13:20.000Z", "citation": [ { "@type": "CreativeWork", "name": "web.dev — Extract critical CSS", "url": "https://web.dev/articles/extract-critical-css", "publisher": { "@type": "Organization", "name": "web.dev" } }, { "@type": "CreativeWork", "name": "web.dev — Defer non-critical CSS", "url": "https://web.dev/articles/defer-non-critical-css", "publisher": { "@type": "Organization", "name": "web.dev" } }, { "@type": "CreativeWork", "name": "MDN — Render-blocking resources", "url": "https://developer.mozilla.org/en-US/docs/Glossary/Render_blocking", "publisher": { "@type": "Organization", "name": "MDN" } }, { "@type": "CreativeWork", "name": "Chrome for Developers — Eliminate render-blocking resources", "url": "https://developer.chrome.com/docs/lighthouse/performance/render-blocking-resources", "publisher": { "@type": "Organization", "name": "Google" } } ] }, { "@type": "BreadcrumbList", "@id": "https://webspecification.com/spec/performance/critical-css/#breadcrumb", "itemListElement": [ { "@type": "ListItem", "position": 1, "name": "Home", "item": "https://webspecification.com/" }, { "@type": "ListItem", "position": 2, "name": "Spec", "item": "https://webspecification.com/spec/" }, { "@type": "ListItem", "position": 3, "name": "Performance", "item": "https://webspecification.com/spec/performance/" }, { "@type": "ListItem", "position": 4, "name": "Critical CSS and render-blocking resources", "item": "https://webspecification.com/spec/performance/critical-css/" } ] } ] }