Skip to content

How to minimise main-thread work

Speed1 min readFixes check main-thread-work

Parsing, compiling and running JavaScript, plus styling and layout, all happen on one thread. Less script and simpler CSS keep it free for interaction.

Step by step, with screenshots: DOM size: why 3,000 nodes is a problem and how to shrink a page →

Check your own site

Runs this check and the other 192, free, in about 45 seconds.

Or run only this check with the free Unused CSS/JS checker.

What it is

Main-thread work is the total time the browser's main thread spends processing your page: parsing HTML and CSS, calculating styles and layout, painting, and above all parsing, compiling and running JavaScript. The main thread is also where clicks and taps are handled, so while it is busy the page cannot respond.

Lighthouse reports this as "Minimize main-thread work", broken down into categories such as script evaluation and style and layout, and getReport asks for under 2 s in a throttled mobile test. Above that, most of the time is usually script evaluation, which points to large bundles or heavy third-party tags and shows up as poor Total Blocking Time and Interaction to Next Paint.

What a passing site looks like

  • Main-thread work: passeswarning · −2 ptseffort L

Main-thread work

Why it matters. This is the total time the browser spent parsing, compiling and running your page's code. While it works, it cannot respond to the visitor.

How to fix it.
  1. Reduce JavaScript first: it dominates this number on almost every site.
  2. Cut style and layout work by simplifying CSS selectors and DOM size.

Questions people ask

How do I fix "Minimize main-thread work"?

Look at the category breakdown first. If script evaluation dominates, ship less JavaScript: remove unused plugins and tags, defer non-essential scripts and split large bundles. If style and layout dominates, reduce the DOM size and avoid CSS that forces the whole page to recalculate. High rendering and painting costs usually come from large animated areas or heavy effects such as blur filters.

How do I minimize main-thread work in WordPress?

Most of the work comes from plugin and theme JavaScript. Deactivate what you do not use, stop page builders and sliders loading on pages without them, and delay chat, social and marketing scripts until the visitor interacts with a performance plugin. A lighter theme and fewer nested builder sections also cut style and layout time. Run a new mobile report after each change.

What does script evaluation mean in main-thread work?

It is the time the browser spends running JavaScript after downloading and compiling it, including all the code that runs as the page starts. It is usually the largest share of main-thread work. High script evaluation means the page runs a lot of code up front, often from frameworks, sliders, analytics or ad tags; removing or delaying that code lowers it.

How do I minimize main-thread work on Shopify?

Most main-thread work on Shopify comes from apps and the theme. Remove apps you no longer use and check that their code left the theme, turn off app embeds on pages that do not need them, and prefer a current Online Store 2.0 theme that uses little JavaScript. Review, chat and upsell widgets are frequent heavy hitters.

Filed under Speed & Core Web Vitals. Copy is generated from the same catalogue that scores every report, so what you read here is what the report says.