Minimize Main-thread Work

What is Main-thread Work?

Earlier in this guide we discussed some tips on how to avoid long main-thread tasks. The main thread is what handles most of the processing. Its purpose is to parse the HTML to build the DOM, analyze the CSS and apply the styles, as well as execute JavaScript. So, the main thread has a lot going on during the initial phase as the page is loading. As a user, you may also experience that brief amount of time when a page will not respond to any input or action. That is because the main thread also handles user events. The performance threshold within Lighthouse is four seconds. Any main thread task that lasts longer than that will prompt the “Minimize main-thread work” message. The longer the main thread takes to process, the longer it takes for the page to become interactive, or time to interactive, or TTI.

How to Minimize Main-thread Work

The main-thread is made up of different components, so each one should be optimized independently of the other. Scripts are typically the first item that should be reviewed as the browser will take the most time on these scripts. Optimizations like deferring, or lazy loading, any non-essential or third-party scripts can help offload that from the main-thread work so the page can begin rendering. Additionally, we already talked about JavaScript, CSS, and HTML minification and compression, but these can also be implemented to optimize files even further. Other performance-enhancing techniques include using web workers, which can help assist with moving JavaScript off the main-thread and processing it separately to offer a more balanced approach. The goal of minimizing the main-thread work is to process the most critical aspects of your page as quickly as possible so the user is not left waiting.



Lighthouse is an open-source tool that is used to run an audit against your web pages and provides scores and suggestions for improving page performance, accessibility, SEO, and more.


PageSpeed Terms

PageSpeed Insights is a tool created by Google that reports on the performance of a page on both mobile and desktop devices, and provides suggestions on how that page may be improved.



YSlow is an open-source website analysis tool that can be used to identify web page performance issues. Learn more about the YSlow to enhance your web pages and the user experience.