What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
A low PageSpeed Insights score does not prove that your Three.js scene is the problem—or that JavaScript is innocent. Start by checking whether the weak result is a Lighthouse lab score or real-user field data, then identify the failing metric. For slow Largest Contentful Paint (LCP), the key evidence is the LCP element and its timing breakdown, not simply the presence of a WebGL canvas.
First, establish what PageSpeed Insights says is failing
PageSpeed Insights (PSI) combines two different kinds of evidence: Lighthouse diagnostics from a controlled lab run and field data from the Chrome User Experience Report (CrUX). The lab is useful for reproducing and investigating performance problems, but it does not necessarily capture the bottlenecks visitors encounter in the field. A URL without enough CrUX data may show origin-level data instead, so check whether the report describes the tested URL or the broader site origin. Google’s PSI documentation explains the distinction.
As an Amazon Associate I earn from qualifying purchases.
Keep the Lighthouse performance category score separate from Core Web Vitals. Google classifies a Lighthouse score of 90 or above as good, 50–89 as needing improvement, and below 50 as poor. That category score is not the same as the field-data Core Web Vitals assessment. Google’s score-band guidance
Free tools Windows power users keep installed
One-click scans. No signup required.
Core Web Vitals are LCP, Cumulative Layout Shift (CLS), and Interaction to Next Paint (INP). Their current good thresholds are LCP at or below 2.5 seconds, CLS at or below 0.1, and INP at or below 200 milliseconds. Field assessment is based on the 75th percentile of eligible page or origin data; when there is sufficient data for all three metrics, all three must meet their good thresholds to pass. LCP is reported separately for mobile and desktop. Google’s Core Web Vitals and PSI guidance
#1 Best Overall
| Evidence in PSI | What it tells you | How to use it |
|---|---|---|
| Lighthouse lab score and diagnostics | A controlled test result and clues about possible causes. | Use it to investigate and compare changes under similar conditions; do not treat it as proof that field Core Web Vitals fail. |
| CrUX field data | Real-user experience for the reported URL or, when URL data is insufficient, the origin. | Check the scope, device, and individual metrics to understand the visitor experience represented. |
Find the weak metric before blaming the scene
Record the device category, Lighthouse score, individual metric results, and whether the field panel is URL-level or origin-level. The next step depends on what is actually weak:
- LCP: Find which element PSI identifies as the largest contentful element, then inspect its loading and rendering timeline.
- CLS: Look for content that changes size or position as the page loads, such as images, fonts, or third-party widgets.
- INP: Focus on interaction responsiveness. A low overall score alone does not identify the cause; inspect the individual metric and relevant diagnostics.
For broader site patterns, Google Search Console’s Core Web Vitals report uses actual-user data and groups similar URLs. For a group with enough data, its status reflects the slowest reported metric. Google Search Central’s Core Web Vitals report documentation
Rank #2
For LCP, follow the element and its four timing parts
Use the LCP element as your starting point, whether it is a heading, image, or another visible item. Inspect the initial HTML response and the LCP resource in a network waterfall. Google breaks LCP into four parts: time to first byte (TTFB), resource load delay, resource load duration, and element render delay. Google’s LCP optimization guide
- TTFB: Time until the browser receives the first byte of the HTML response. A late response delays everything discovered from the document.
- Resource load delay: Time between the HTML response and the start of the LCP resource loading. A resource discovered late may spend too long waiting to begin.
- Resource load duration: Time spent fetching the LCP resource once the request starts.
- Element render delay: Time between the resource finishing and the LCP element appearing. Work still blocking rendering can contribute here.
If an image or other resource starts late, investigate how soon the browser can discover it and how it is delivered. If it loads promptly but appears late, look for work that prevents the element from being painted. This separates a slow or late resource from a rendering bottleneck; a smooth-looking scene on your own machine does not settle either question.
Rank #3
JavaScript can still delay an LCP element it does not create
Three.js is JavaScript, but the useful distinction is not “scene versus no JavaScript.” It is whether work on the page’s main thread delays the element PSI measured. A large script can take time to parse and execute, and that work can hold up rendering even if the script is not render-blocking and does not produce the LCP element. Google’s LCP guidance explicitly warns that JavaScript can delay LCP in those circumstances. Google’s explanation of JavaScript and LCP
Inspect main-thread activity alongside the LCP timeline. Determine whether the scene’s scripts or other page scripts are doing work during the delay. Do not assume that an unrelated-looking LCP element makes JavaScript irrelevant, and do not assume that every JavaScript warning means the 3D scene is the cause.
Rank #4
If CLS is weak, inspect the rest of the page too
A Three.js page still contains ordinary page content, and layout instability can occur independently of scene complexity. Google identifies images or video without known dimensions, fonts that differ from their fallback, and third-party content that changes size after loading as possible causes of layout shifts. Google’s CLS guidance
Do these 3 things before closing this tab:
1Fix the driver behind crashes, sound loss and screen glitches2Repair Windows errors before they cause bigger problems3Scan for outdated or missing drivers - takes under a minuteCompare the page before and after those assets or widgets load. Check whether space was reserved for media and whether a font swap or late-arriving embed moves surrounding content. Diagnose the metric PSI reports rather than treating every poor score as a rendering-performance issue.
Best Value
Use a controlled diagnostic loop
- Record the report: Note device, Lighthouse category score, individual metric results, and whether PSI is showing lab data, URL-level CrUX, or origin-level CrUX.
- Choose the failing metric: For LCP, identify the reported element; for CLS, find late size or position changes; for INP, investigate the interaction responsiveness evidence.
- Trace LCP timing when relevant: Compare the HTML response, when the LCP resource begins and finishes, and when the element paints. Classify the delay as TTFB, resource load delay, resource load duration, or element render delay.
- Inspect main-thread work: Include large JavaScript execution in the investigation, even when it does not create the LCP element.
- Compare lab and field evidence: Use the lab to investigate reproducible causes and field data to understand actual-user experience when there is enough CrUX data.
- Change one plausible cause at a time: Measure the same metric under comparable conditions so the effect of a change is interpretable.
What a bad score does—and does not—establish
A PageSpeed result can expose problems in the document request, an LCP resource, main-thread work, or layout changes around a Three.js canvas. It does not, by itself, establish that scene complexity caused the result, that JavaScript is uninvolved, or that real visitors fail Core Web Vitals. The official PSI guidance describes simulated mobile and desktop conditions; it does not establish that every PSI run uses software rendering or lacks GPU acceleration. An individual September 28, 2026 Three.js forum post makes software-rendering claims, but that community report is not evidence of a universal PSI behavior.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
