1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 | import {bindReporter} from './lib/bindReporter.js';
|
18 | import {finalMetrics} from './lib/finalMetrics.js';
|
19 | import {getFirstHidden} from './lib/getFirstHidden.js';
|
20 | import {initMetric} from './lib/initMetric.js';
|
21 | import {observe} from './lib/observe.js';
|
22 | import {onBFCacheRestore} from './lib/onBFCacheRestore.js';
|
23 | import {ReportHandler} from './types.js';
|
24 |
|
25 |
|
26 | export const getFCP = (onReport: ReportHandler, reportAllChanges?: boolean) => {
|
27 | const firstHidden = getFirstHidden();
|
28 | let metric = initMetric('FCP');
|
29 | let report: ReturnType<typeof bindReporter>;
|
30 |
|
31 | const entryHandler = (entry: PerformanceEntry) => {
|
32 | if (entry.name === 'first-contentful-paint') {
|
33 | if (po) {
|
34 | po.disconnect();
|
35 | }
|
36 |
|
37 |
|
38 | if (entry.startTime < firstHidden.timeStamp) {
|
39 | metric.value = entry.startTime;
|
40 | metric.entries.push(entry);
|
41 | finalMetrics.add(metric);
|
42 | report();
|
43 | }
|
44 | }
|
45 | };
|
46 |
|
47 | const po = observe('paint', entryHandler);
|
48 | if (po) {
|
49 | report = bindReporter(onReport, metric, reportAllChanges);
|
50 |
|
51 | onBFCacheRestore((event) => {
|
52 | metric = initMetric('FCP');
|
53 | report = bindReporter(onReport, metric, reportAllChanges);
|
54 | requestAnimationFrame(() => {
|
55 | requestAnimationFrame(() => {
|
56 | metric.value = performance.now() - event.timeStamp;
|
57 | finalMetrics.add(metric);
|
58 | report();
|
59 | });
|
60 | });
|
61 | });
|
62 | }
|
63 | };
|