diff --git a/README.md b/README.md index d9afc477..dbe644de 100644 --- a/README.md +++ b/README.md @@ -1018,8 +1018,8 @@ interface INPAttribution { sourceCharPosition?: number; } /** - * The total blocking durations in each sub-part by invoker for scripts that - * intersect the INP interaction. + * The total intersecting durations in each sub-part by invoker for + * scripts that intersect the INP interaction. * For example: * { * 'inputDelay': { 'event-listener': 185, 'user-callback': 28}, @@ -1044,7 +1044,7 @@ interface INPAttribution { * duration. Note, this includes forced style and layout within those * scripts. */ - totalScriptDuration: number; + totalIntersectingScriptsDuration: number; } /** * The time from when the user interacted with the page until when the diff --git a/src/attribution/onINP.ts b/src/attribution/onINP.ts index edd65a65..854338e1 100644 --- a/src/attribution/onINP.ts +++ b/src/attribution/onINP.ts @@ -269,7 +269,7 @@ export const onINP = ( const processingDuration = attribution.processingDuration; let totalNonForcedStyleAndLayoutDuration = 0; let totalForcedStyleAndLayout = 0; - let totalScriptTime = 0; + let totalIntersectingScriptsDuration = 0; let numScripts = 0; let slowestScriptDuration = 0; let slowestScriptEntry!: PerformanceScriptTiming; @@ -283,14 +283,15 @@ export const onINP = ( loafEntry.startTime + loafEntry.duration - loafEntry.styleAndLayoutStart; - loafEntry.scripts.forEach((script) => { + + for (const script of loafEntry.scripts) { const scriptEndTime = script.startTime + script.duration; if (scriptEndTime < interactionTime) { return; } const intersectingScriptDuration = scriptEndTime - Math.max(interactionTime, script.startTime); - totalScriptTime += intersectingScriptDuration; + totalIntersectingScriptsDuration += intersectingScriptDuration; numScripts++; totalForcedStyleAndLayout += script.forcedStyleAndLayoutDuration; const invokerType = script.invokerType; @@ -305,7 +306,7 @@ export const onINP = ( } // Define the record if necessary. Annoyingly TypeScript doesn't yet - // recognise this so need a few `!`s on the next two lines to convinced + // recognize this so need a few `!`s on the next two lines to convinced // it is typed. subparts[subpart] ??= {}; subparts[subpart]![invokerType] ??= 0; @@ -317,7 +318,7 @@ export const onINP = ( slowestScriptSubpart = subpart; slowestScriptDuration = intersectingScriptDuration; } - }); + } } // Gather the loaf summary information into the loafAttribution object @@ -348,7 +349,7 @@ export const onINP = ( totalForcedStyleAndLayoutDuration: totalForcedStyleAndLayout, totalNonForcedStyleAndLayoutDuration: totalNonForcedStyleAndLayoutDuration, - totalScriptDuration: totalScriptTime, + totalIntersectingScriptsDuration: totalIntersectingScriptsDuration, }; return loafSummary; diff --git a/src/types/inp.ts b/src/types/inp.ts index 9988966e..bc1ffcaa 100644 --- a/src/types/inp.ts +++ b/src/types/inp.ts @@ -142,8 +142,8 @@ export interface LongAnimationFrameSummary { */ slowestScript: SlowestScriptSummary; /** - * The total blocking durations in each sub-part by invoker for scripts that - * intersect the INP interaction. + * The total intersecting durations in each sub-part by invoker for + * scripts that intersect the INP interaction. * For example: * { * 'inputDelay': { 'event-listener': 185, 'user-callback': 28}, @@ -168,7 +168,7 @@ export interface LongAnimationFrameSummary { * duration. Note, this includes forced style and layout within those * scripts. */ - totalScriptDuration: number; + totalIntersectingScriptsDuration: number; } /**