CSS, JavaScript and third-party scripts
How code slows a page down, and how to load less of it, later, or not at all: render-blocking files, long tasks and outside tags.
After images, code is what slows most pages down. CSS can hold the first paint back. JavaScript can keep the browser too busy to answer a tap. Tags and widgets from other companies add both. These guides show how to find which files do the damage and how to load them smarter.
If the first paint is slow, start with critical CSS and render-blocking resources and defer, async and modules.
If taps feel slow, read reduce main-thread work and break up long tasks, then use how to fix INP.
If the page carries too much code, see reduce unused code, bundle size and code splitting and remove jQuery.
If other companies' tags are the problem, read third-party scripts. For ways to load work earlier or later, see resource hints and speculation rules. For sites built with a JavaScript framework, read about hydration.
Guides in this topic 15 guides
- Critical CSS and render-blocking resources explained
CSS and JavaScript can stop a page from showing. What render-blocking means, how critical CSS, defer and async fix it, and the trade-offs of each.
- Third-party scripts: how to find and fix the slow ones
Chat, ads, analytics, tag managers and embeds run code you did not write. How to list them, measure what each costs, and remove, delay or replace them.
- defer, async and module scripts: how scripts load
How the browser loads scripts by default, what async, defer and type module change, which events wait for which, and how to choose for each script.
- Reduce unused JavaScript and CSS: a practical guide
Pages ship code they never use. How to find unused JavaScript and CSS with the Coverage tool, what Lighthouse flags, and how to remove, split or delay it.
- Resource hints: preload, preconnect, prefetch and more
How preload, preconnect, prefetch, fetchpriority and Early Hints tell the browser what to load first, and how to use each one without causing harm.
- Break up long tasks to keep a page responsive
A long task freezes the page for 50 milliseconds or more. How to find them, and how to split them with yielding, time-boxed loops, priorities and workers.
- Reduce main-thread work: where the time goes
The main thread parses, styles, lays out, paints and runs scripts. How to see where its time goes, what Lighthouse flags, and the fix for each kind of work.
- DOM size and rendering: when a page has too much
A large DOM slows every style and layout update. What Lighthouse flags, how to measure yours, and how to cut the cost with less markup and content-visibility.
- CSS performance: size, selectors and rendering cost
CSS blocks the first paint and also drives style, layout and paint work. How its size, loading, selectors and animations affect speed, and what to fix first.
- JavaScript bundle size and code splitting
Large bundles delay loading and block taps. How to see what is in yours, remove what is not needed, and split the rest so each page loads only its own code.
- Remove jQuery and other legacy libraries
jQuery and similar libraries still load on many pages. What they cost, how to find out whether you need them, and how to replace them with browser features.
- Web workers: moving heavy work off the main thread
A web worker runs JavaScript on a separate thread so heavy jobs cannot freeze the page. What to move, how to do it, the limits, and when it is not worth it.
- Service workers and speed: caching, and what it costs
A service worker can make repeat visits fast and pages work offline, but it adds startup time and the risk of stale pages. How it works and when it is worth it.
- Speculation rules: load the next page before the click
Speculation rules tell the browser which page a visitor will open next so it can load it early. How prefetch and prerender differ, and how to use both safely.
- Hydration and speed in React and Next.js
A server-rendered React page can look ready and still ignore taps. How hydration works, what it costs, and how Server Components, streaming and splitting help.
Start here
Free website audit
Live Google data for any public page: mobile and desktop.
Mobile + desktop · Lighthouse lab test · Real-user Chrome data when Google has it
Rather have this done for you? Speed optimization · Book a call