# Scripts loading > Source: Analyzes all scripts on the page, showing their loading strategy and identifying potential performance issues. Scripts are often the biggest cause of main thread blocking and delayed rendering. This snippet helps you audit which scripts are blocking the critical rendering path. ### Why this matters Render-blocking scripts in `` without `async` or `defer` pause HTML parsing while they download and execute. This delays First Contentful Paint (FCP) and Largest Contentful Paint (LCP). Even a single blocking script can add hundreds of milliseconds to your load time, especially on slower connections. ### How scripts affect HTML parsing Interactive demo: [Interactive timeline of how a normal, async, and defer script each affect HTML parsing, downloading, and execution](https://webperf-snippets.net/demos/script-loading-timeline.html). Switch between \', "font-family: monospace; color: #22c55e;"); console.log(""); console.log("%cFor independent scripts (analytics, ads):", "font-weight: bold;"); console.log('%c', "font-family: monospace; color: #22c55e;"); console.log(""); console.log("%cFor ES modules:", "font-weight: bold;"); console.log('%c', "font-family: monospace; color: #22c55e;"); console.log(""); console.log("%cFor critical inline scripts:", "font-weight: bold;"); console.log('%c', "font-family: monospace; color: #22c55e;"); logOwnDomainsHint(thirdPartyScripts.length); console.groupEnd(); console.groupEnd(); const agentRating = blockingInHead.length === 0 ? "good" : (blockingInHead.length <= 2 && thirdPartyBlocking.length === 0) ? "needs-improvement" : "poor"; // The list keeps the 50 scripts to look at first (render-blocking, then third-party, then the largest); count and details cover all of them const MAX_ITEMS = 50; const rankedScripts = [...scripts].sort( (a, b) => Number(b.isBlocking) - Number(a.isBlocking) || Number(a.firstParty) - Number(b.firstParty) || b.size - a.size ); return { script: "Script-Loading", status: "ok", count: scripts.length, corsLimitedAnalysis: scripts.some((s) => !s.sizeKnown), rating: agentRating, details: { totalSizeBytes: totalSize, sizeUnknownCount: scripts.filter((s) => !s.sizeKnown).length, byStrategy: { blocking: blocking.length, async: asyncScripts.length, defer: deferScripts.length, module: moduleScripts.length, }, byParty: { firstParty: firstPartyScripts.length, thirdParty: thirdPartyScripts.length, }, thirdPartyBlockingCount: thirdPartyBlocking.length, }, items: rankedScripts.slice(0, MAX_ITEMS).map((s) => ({ url: s.src, shortName: s.shortSrc, strategy: s.strategy, location: s.inHead ? "head" : "body", party: s.firstParty ? "first" : "third", sizeBytes: s.size, sizeKnown: s.sizeKnown, durationMs: Math.round(s.duration), })), issues: [ ...issues.map((i) => ({ severity: i.severity, message: i.message })), ...(scripts.some((s) => !s.sizeKnown) ? [{ severity: "info", message: `${scripts.filter((s) => !s.sizeKnown).length} script(s) have an unknown size (missing Timing-Allow-Origin); total size is a lower bound` }] : []), ], }; })(); ``` ### Understanding the results ### Summary section - Total scripts (external and inline) - Breakdown by loading strategy - Overall rating based on blocking scripts ### Loading strategy legend - 🔴 **Blocking**: Stops HTML parsing (bad for performance) - **Async**: Downloads in parallel, executes when ready - **Defer**: Downloads in parallel, executes after parsing - **Module**: ES module (deferred by default) ### Details table | Column | Description | | -------- | ------------------------------------------------------------------------------------------------------------------------ | | Script | Filename | | Strategy | Loading strategy with indicator | | Location | head or body | | Party | 1st (your domain) or 3rd (external) | | Size | Transfer size; unknown for cross-origin scripts without `Timing-Allow-Origin` (`sizeKnown: false` in the returned items) | | Duration | Time to load | ### Issues detected | Issue | Severity | Why It Matters | | -------------------------------- | -------- | -------------------------------------- | | Blocking scripts in `` | Error | Delays all content below | | Third-party blocking scripts | Error | External dependency blocking your page | | Large blocking scripts (> 50 KB) | Warning | Significant parsing delay | ### Script loading decision tree Diagram: Decision tree for script loading: critical tiny scripts are inlined, other critical scripts go at the end of body or are preloaded, non-critical scripts use defer when order matters and async otherwise > **Note:** Scripts are first party when they share the page's root domain. A site's own CDN on a different root domain, such as `bbci.co.uk` for `bbc.co.uk`, is reported as a third party, because the comparison uses root domains only. To count those domains as first party, list them in the `OWN_DOMAINS` constant at the top of the snippet, for example `const OWN_DOMAINS = ["bbci.co.uk", "bbc.co.uk"];`. Entries can be domains or URLs. While the list is empty and the page has third-party resources, the snippet prints a reminder in the console. ### Browser support | Feature | Chrome | Edge | Firefox | Safari | | --------------------------------------------------------------------------------------------------------------------------- | :----: | :--: | :-----: | :----: | | [PerformanceResourceTiming.transferSize](https://developer.mozilla.org/docs/Web/API/PerformanceResourceTiming/transferSize) | ✅ 54 | ✅ 17 | ✅ 45 | ✅ 16.4 | | [Document.scripts](https://developer.mozilla.org/docs/Web/API/Document/scripts) | ✅ 36 | ✅ 12 | ✅ 61 | ✅ 10.1 | | All of the above | ✅ 54 | ✅ 17 | ✅ 61 | ✅ 16.4 | Source: [MDN browser compatibility data](https://github.com/mdn/browser-compat-data), version 8.1.4. ### Further reading - [Efficiently load JavaScript](https://web.dev/articles/efficiently-load-third-party-javascript) | web.dev - [Script loading strategies](https://developer.chrome.com/docs/lighthouse/performance/render-blocking-resources) | Chrome Developers - [JavaScript modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) | MDN - [async vs defer](https://javascript.info/script-async-defer) | javascript.info