Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

core(lantern): use LCP instead of FMP for TTI simulation bounds #16046

Merged
merged 4 commits into from
Jun 6, 2024
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions core/computed/metrics/lantern-interactive.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
*/

import {makeComputedArtifact} from '../computed-artifact.js';
import {LanternFirstMeaningfulPaint} from './lantern-first-meaningful-paint.js';
import {LanternLargestContentfulPaint} from './lantern-largest-contentful-paint.js';
import {Interactive} from '../../lib/lantern/metrics/interactive.js';
import {getComputationDataParams, lanternErrorAdapter} from './lantern-metric.js';

Expand All @@ -29,8 +29,8 @@ class LanternInteractive extends Interactive {
* @return {Promise<LH.Artifacts.LanternMetric>}
*/
static async compute_(data, context) {
const fmpResult = await LanternFirstMeaningfulPaint.request(data, context);
return this.computeMetricWithGraphs(data, context, {fmpResult});
const lcpResult = await LanternLargestContentfulPaint.request(data, context);
return this.computeMetricWithGraphs(data, context, {lcpResult});
}
}

Expand Down
2 changes: 1 addition & 1 deletion core/lib/lantern/metric.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import {RESOURCE_TYPES} from '../../lib/network-request.js';
* @typedef Extras
* @property {boolean} optimistic
* @property {LH.Artifacts.LanternMetric=} fcpResult
* @property {LH.Artifacts.LanternMetric=} fmpResult
* @property {LH.Artifacts.LanternMetric=} lcpResult
* @property {LH.Artifacts.LanternMetric=} interactiveResult
* @property {{speedIndex: number}=} speedline
*/
Expand Down
14 changes: 7 additions & 7 deletions core/lib/lantern/metrics/interactive.js
Original file line number Diff line number Diff line change
Expand Up @@ -66,12 +66,12 @@ class Interactive extends Metric {
* @return {LH.Gatherer.Simulation.Result}
*/
static getEstimateFromSimulation(simulationResult, extras) {
if (!extras.fmpResult) throw new Error('missing fmpResult');
if (!extras.lcpResult) throw new Error('missing lcpResult');

const lastTaskAt = Interactive.getLastLongTaskEndTime(simulationResult.nodeTimings);
const minimumTime = extras.optimistic
? extras.fmpResult.optimisticEstimate.timeInMs
: extras.fmpResult.pessimisticEstimate.timeInMs;
? extras.lcpResult.optimisticEstimate.timeInMs
: extras.lcpResult.pessimisticEstimate.timeInMs;
return {
timeInMs: Math.max(minimumTime, lastTaskAt),
nodeTimings: simulationResult.nodeTimings,
Expand All @@ -84,13 +84,13 @@ class Interactive extends Metric {
* @return {Promise<LH.Artifacts.LanternMetric>}
*/
static async compute(data, extras) {
const fmpResult = extras?.fmpResult;
if (!fmpResult) {
throw new Error('FMP is required to calculate the Interactive metric');
const lcpResult = extras?.lcpResult;
if (!lcpResult) {
throw new Error('LCP is required to calculate the Interactive metric');
}

const metricResult = await super.compute(data, extras);
metricResult.timing = Math.max(metricResult.timing, fmpResult.timing);
metricResult.timing = Math.max(metricResult.timing, lcpResult.timing);
return metricResult;
}

Expand Down
6 changes: 3 additions & 3 deletions core/test/fixtures/lantern-baseline-accuracy.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@
"p95": 0.6524087591240876
},
"roughEstimateOfTTI": {
"p50": 0.28936170212765955,
"p90": 0.6481503092542887,
"p95": 0.7325279801030379
"p50": 0.27433435181143606,
"p90": 0.583952617757166,
"p95": 0.7259561558741738
},
"roughEstimateOfLCP": {
"p50": 0.20067905646890635,
Expand Down
32 changes: 16 additions & 16 deletions core/test/fixtures/lantern-baseline-computed-values.json

Large diffs are not rendered by default.

38 changes: 19 additions & 19 deletions core/test/fixtures/user-flows/reports/sample-flow-result.json
Original file line number Diff line number Diff line change
Expand Up @@ -331,11 +331,11 @@
"id": "interactive",
"title": "Time to Interactive",
"description": "Time to Interactive is the amount of time it takes for the page to become fully interactive. [Learn more about the Time to Interactive metric](https://developer.chrome.com/docs/lighthouse/performance/interactive/).",
"score": 0.95,
"score": 0.93,
"scoreDisplayMode": "numeric",
"numericValue": 3092.1940000000004,
"numericValue": 3410.384000000001,
"numericUnit": "millisecond",
"displayValue": "3.1 s"
"displayValue": "3.4 s"
},
"user-timings": {
"id": "user-timings",
Expand Down Expand Up @@ -1371,7 +1371,7 @@
"description": "Collects all available metrics.",
"score": 1,
"scoreDisplayMode": "informative",
"numericValue": 3092,
"numericValue": 3410,
"numericUnit": "millisecond",
"details": {
"type": "debugdata",
Expand All @@ -1380,7 +1380,7 @@
"firstContentfulPaint": 2520,
"firstMeaningfulPaint": 2520,
"largestContentfulPaint": 3410,
"interactive": 3092,
"interactive": 3410,
"speedIndex": 2520,
"totalBlockingTime": 140,
"maxPotentialFID": 150,
Expand Down Expand Up @@ -7060,7 +7060,7 @@
},
{
"values": {
"timeInMs": 3092.1940000000004
"timeInMs": 3410.384000000001
},
"path": "audits.interactive.displayValue"
},
Expand Down Expand Up @@ -17893,11 +17893,11 @@
"id": "total-blocking-time",
"title": "Total Blocking Time",
"description": "Sum of all time periods between FCP and Time to Interactive, when task length exceeded 50ms, expressed in milliseconds. [Learn more about the Total Blocking Time metric](https://developer.chrome.com/docs/lighthouse/performance/lighthouse-total-blocking-time/).",
"score": 1,
"score": 0.99,
"scoreDisplayMode": "numeric",
"numericValue": 57,
"numericValue": 75.5,
"numericUnit": "millisecond",
"displayValue": "60 ms",
"displayValue": "80 ms",
"scoringOptions": {
"p10": 200,
"median": 600
Expand Down Expand Up @@ -18004,11 +18004,11 @@
"id": "interactive",
"title": "Time to Interactive",
"description": "Time to Interactive is the amount of time it takes for the page to become fully interactive. [Learn more about the Time to Interactive metric](https://developer.chrome.com/docs/lighthouse/performance/interactive/).",
"score": 1,
"score": 0.99,
"scoreDisplayMode": "numeric",
"numericValue": 1688.5037302178957,
"numericValue": 2107.00424,
"numericUnit": "millisecond",
"displayValue": "1.7 s"
"displayValue": "2.1 s"
},
"user-timings": {
"id": "user-timings",
Expand Down Expand Up @@ -18177,7 +18177,7 @@
"numericUnit": "millisecond",
"displayValue": "0.9 s",
"metricSavings": {
"TBT": 50
"TBT": 100
},
"details": {
"type": "table",
Expand Down Expand Up @@ -19085,7 +19085,7 @@
"description": "Collects all available metrics.",
"score": 1,
"scoreDisplayMode": "informative",
"numericValue": 1689,
"numericValue": 2107,
"numericUnit": "millisecond",
"details": {
"type": "debugdata",
Expand All @@ -19094,9 +19094,9 @@
"firstContentfulPaint": 933,
"firstMeaningfulPaint": 933,
"largestContentfulPaint": 2024,
"interactive": 1689,
"interactive": 2107,
"speedIndex": 933,
"totalBlockingTime": 57,
"totalBlockingTime": 76,
"maxPotentialFID": 87,
"cumulativeLayoutShift": 0.020352129288190492,
"cumulativeLayoutShiftMainFrame": 0.020352129288190492,
Expand Down Expand Up @@ -19576,7 +19576,7 @@
"scoreDisplayMode": "informative",
"displayValue": "4 long tasks found",
"metricSavings": {
"TBT": 50
"TBT": 100
},
"details": {
"type": "table",
Expand Down Expand Up @@ -25000,7 +25000,7 @@
},
{
"values": {
"timeInMs": 1688.5037302178957
"timeInMs": 2107.00424
},
"path": "audits.interactive.displayValue"
},
Expand Down Expand Up @@ -25044,7 +25044,7 @@
"core/lib/i18n/i18n.js | ms": [
{
"values": {
"timeInMs": 57
"timeInMs": 75.5
},
"path": "audits[total-blocking-time].displayValue"
},
Expand Down
11 changes: 8 additions & 3 deletions core/test/lib/lantern/metrics/interactive-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@
import assert from 'assert/strict';

import {Interactive} from '../../../../lib/lantern/metrics/interactive.js';
import {FirstMeaningfulPaint} from '../../../../lib/lantern/metrics/first-meaningful-paint.js';
import {FirstContentfulPaint} from '../../../../lib/lantern/metrics/first-contentful-paint.js';
import {LargestContentfulPaint} from '../../../../lib/lantern/metrics/largest-contentful-paint.js';
import {getComputationDataFromFixture} from './metric-test-utils.js';
import {readJson} from '../../../test-utils.js';

Expand All @@ -20,7 +21,9 @@ describe('Metrics: Lantern TTI', () => {
it('should compute predicted value', async () => {
const data = await getComputationDataFromFixture({trace, devtoolsLog});
const result = await Interactive.compute(data, {
fmpResult: await FirstMeaningfulPaint.compute(data),
lcpResult: await LargestContentfulPaint.compute(data, {
fcpResult: await FirstContentfulPaint.compute(data),
}),
});

expect({
Expand All @@ -40,7 +43,9 @@ describe('Metrics: Lantern TTI', () => {
devtoolsLog: iframeDevtoolsLog,
});
const result = await Interactive.compute(data, {
fmpResult: await FirstMeaningfulPaint.compute(data),
lcpResult: await LargestContentfulPaint.compute(data, {
fcpResult: await FirstContentfulPaint.compute(data),
}),
});

expect({
Expand Down
8 changes: 1 addition & 7 deletions core/test/results/sample_v2.json
Original file line number Diff line number Diff line change
Expand Up @@ -7919,7 +7919,7 @@
},
{
"startTime": 0,
"name": "lh:computed:LanternFirstMeaningfulPaint",
"name": "lh:computed:LanternLargestContentfulPaint",
"duration": 100,
"entryType": "measure"
},
Expand Down Expand Up @@ -8157,12 +8157,6 @@
"duration": 100,
"entryType": "measure"
},
{
"startTime": 0,
"name": "lh:computed:LanternLargestContentfulPaint",
"duration": 100,
"entryType": "measure"
},
{
"startTime": 0,
"name": "lh:audit:csp-xss",
Expand Down
Loading