Third-Party Resources Not Deferred
Priority: Critical
Impact: Negative
What issues it may cause
Blocking Resources: Third-party scripts can block the main thread, delaying the rendering of the webpage. Since the browser has to download, parse, and execute these scripts before continuing with rendering, this can significantly slow down the initial load time.
Delayed Interactivity: Heavy or slow-loading third-party scripts can delay the time it takes for a page to become interactive, frustrating users who have to wait longer to engage with the content.
CPU and Memory Usage: Third-party scripts can consume significant CPU and memory resources, especially on lower-powered devices. This can lead to slowdowns and a degraded experience for the user as their device struggles to handle the load.
How do you fix it
Deferring Loading: Use techniques like lazy loading or setting the async or defer attributes for scripts that are not essential for the initial render.
Facades: Implement third-party facades to load third-party resources only when necessary, such as when a user scrolls to a certain part of the page or interacts with a specific element.
Code Splitting: Split the code to load only essential parts upfront and defer the rest.Learn more about deferring third-parties.
What is the positive impact
Faster Page Load Times: By deferring the loading of non-essential third-party resources, the critical rendering path is shorter, leading to quicker page loads.
Improved User Experience: Users can start interacting with the primary content of the page faster, improving their overall experience.
- Better SEO: Improved load times and user engagement can positively impact search engine rankings.
How to fetch the data for this report template
You will need to run a crawl for report template to generate report. When report has been generated and you have crawl id you can fetch data for the report using the following query:
- Query
- Variables
- cURL
query GetReportForCrawl($crawlId: ObjectID!, $reportTemplateCode: String!) {
getCrawl(id: $crawlId) {
reportsByCode(
input: {
reportTypeCodes: Basic
reportTemplateCodes: [$reportTemplateCode]
}
) {
rows {
nodes {
... on CrawlSiteSpeedAuditOpportunities {
opportunityDigest
element
title
auditId
exampleUrl
wastedSecsAvg
urlCount
wastedSecsSum
gaPageviewsSum
savingsScoreSum
}
}
}
}
}
}
{"crawlId":"TjAwNUNyYXdsNDAwMA","reportTemplateCode":"third_party_facades_failed_items"}
curl -X POST -H "Content-Type: application/json" -H "apollographql-client-name: docs-example-client" -H "apollographql-client-version: 1.0.0" -H "x-auth-token: YOUR_API_SESSION_TOKEN" --data '{"query":"query GetReportForCrawl($crawlId: ObjectID!, $reportTemplateCode: String!) { getCrawl(id: $crawlId) { reportsByCode( input: { reportTypeCodes: Basic reportTemplateCodes: [$reportTemplateCode] } ) { rows { nodes { ... on CrawlSiteSpeedAuditOpportunities { opportunityDigest element title auditId exampleUrl wastedSecsAvg urlCount wastedSecsSum gaPageviewsSum savingsScoreSum } } } } } }","variables":{"crawlId":"TjAwNUNyYXdsNDAwMA","reportTemplateCode":"third_party_facades_failed_items"}}' https://api.lumar.io/graphql