Render-blocking resources
A significant issue that affects First Contentful Paint is HTML render-blocking. As browsers attempt to download and process files, JavaScript, or CSS referenced in the HTML before rendering the page content, resources that are placed early in an HTML document can delay content rendering.
Common render-blocking causes include:
- Custom JavaScript tags placed in the
<head>section - External font references loaded synchronously near the top of the page
- Third-party scripts loaded before essential content
Because these resources force users to wait until all referenced files are downloaded and processed before seeing any content, they increase the First Contentful Paint time.
We recommend you take the following actions to avoid render-blocking resources:
- Move non-critical style or JavaScript code to the end of your HTML document.
- Review all third-party scripts, and move them after your main content whenever possible.