INP to LoAF Attribution

INPtoLoAF.js

(function() {
    if (PerformanceObserver.supportedEntryTypes.includes('long-animation-frame')) {
        window.longestINPtoLoAFScript = null;

        function process(eventEntry) {
            let matchingLoafs = [];
            for (const event_entry of eventEntry.entries) {
                if (event_entry.entryType == "first-input")
                    continue;

                let entryLoafs = [];
                performance.getEntriesByType('long-animation-frame');

                const longAnimationFrames = performance.getEntriesByType('long-animation-frame');
                longAnimationFrames.filter(loaf => {
                    return event_entry.startTime < (loaf.startTime + loaf.duration) && loaf.startTime < (event_entry.startTime + event_entry.duration);
                }).forEach(loaf => {
                    performance.measure("LoAF", {
                        start: loaf.startTime,
                        end: loaf.startTime + loaf.duration,
                    });
                    matchingLoafs.push(loaf);
                });
            }

            matchingLoafs.forEach((loaf) => {
                for (const script of loaf.scripts) {
                    if (script.duration > (window.longestINPtoLoAFScript?.duration ?? 0))
                        window.longestINPtoLoAFScript = script;
                }
            });

            if (window.longestINPtoLoAFScript) {
                sendToGA(longestINPtoLoAFScript);
                window.longestINPtoLoAFScript = null;
            }
        }

        webVitals.onINP(process, {
            durationThreshold: 150
        });
    }
})();