Skip to content

Instantly share code, notes, and snippets.

@Kobe
Forked from mmocny/inp-devtools-watch.js
Created September 8, 2023 14:49
Show Gist options
  • Save Kobe/dd32215a9fa801f0279cbab8515a96bd to your computer and use it in GitHub Desktop.
Save Kobe/dd32215a9fa801f0279cbab8515a96bd to your computer and use it in GitHub Desktop.
Add these snippets to DevTools (console) Watch expressions
// max-INP:
(()=>{let o=globalThis;return void 0===o.winp&&(o.winp=0,new PerformanceObserver(n=>{for(let e of n.getEntries()){if(!e.interactionId)continue;o.winp=Math.max(e.duration,o.winp);let r=o=>o<=200?"color: green":o<=500?"color: yellow":"color: red";console.log(`%c[Interaction: ${e.name.padEnd(12)}] %cDuration: %c${e.duration}`,"color: grey; font-family: Consolas,monospace","",r(e.duration))}}).observe({type:"event",durationThreshold:0,buffered:!0})),o.winp})();
// interactionCount
performance.interactionCount;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment