UNPKG

web-vitals

Version:

Easily measure performance metrics in JavaScript

2 lines (1 loc) 9.73 kB
var e,t,n,r,i,a=function(){return window.performance&&performance.getEntriesByType&&performance.getEntriesByType("navigation")[0]},o=function(e){if("loading"===document.readyState)return"loading";var t=a();if(t){if(e<t.domInteractive)return"loading";if(0===t.domContentLoadedEventStart||e<t.domContentLoadedEventStart)return"dom-interactive";if(0===t.domComplete||e<t.domComplete)return"dom-content-loaded"}return"complete"},u=function(e){var t=e.nodeName;return 1===e.nodeType?t.toLowerCase():t.toUpperCase().replace(/^#/,"")},c=function(e,t){var n="";try{for(;e&&9!==e.nodeType;){var r=e,i=r.id?"#"+r.id:u(r)+(r.className&&r.className.length?"."+r.className.replace(/\s+/g,"."):"");if(n.length+i.length>(t||100)-1)return n||i;if(n=n?i+">"+n:i,r.id)break;e=r.parentNode}}catch(e){}return n},s=-1,f=function(){return s},l=function(e){addEventListener("pageshow",(function(t){t.persisted&&(s=t.timeStamp,e(t))}),!0)},d=function(){var e=a();return e&&e.activationStart||0},m=function(e,t){var n=a(),r="navigate";return f()>=0?r="back-forward-cache":n&&(r=document.prerendering||d()>0?"prerender":n.type.replace(/_/g,"-")),{name:e,value:void 0===t?-1:t,rating:"good",delta:0,entries:[],id:"v3-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12),navigationType:r}},v=function(e,t,n){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){var r=new PerformanceObserver((function(e){t(e.getEntries())}));return r.observe(Object.assign({type:e,buffered:!0},n||{})),r}}catch(e){}},p=function(e,t){var n=function n(r){"pagehide"!==r.type&&"hidden"!==document.visibilityState||(e(r),t&&(removeEventListener("visibilitychange",n,!0),removeEventListener("pagehide",n,!0)))};addEventListener("visibilitychange",n,!0),addEventListener("pagehide",n,!0)},h=function(e,t,n,r){var i,a;return function(o){t.value>=0&&(o||r)&&((a=t.value-(i||0))||void 0===i)&&(i=t.value,t.delta=a,t.rating=function(e,t){return e>t[1]?"poor":e>t[0]?"needs-improvement":"good"}(t.value,n),e(t))}},g=-1,T=function(){return"hidden"!==document.visibilityState||document.prerendering?1/0:0},y=function(){p((function(e){var t=e.timeStamp;g=t}),!0)},E=function(){return g<0&&(g=T(),y(),l((function(){setTimeout((function(){g=T(),y()}),0)}))),{get firstHiddenTime(){return g}}},S=function(e,t){t=t||{};var n,r=[1800,3e3],i=E(),a=m("FCP"),o=function(e){e.forEach((function(e){"first-contentful-paint"===e.name&&(c&&c.disconnect(),e.startTime<i.firstHiddenTime&&(a.value=e.startTime-d(),a.entries.push(e),n(!0)))}))},u=window.performance&&window.performance.getEntriesByName&&window.performance.getEntriesByName("first-contentful-paint")[0],c=u?null:v("paint",o);(u||c)&&(n=h(e,a,r,t.reportAllChanges),u&&o([u]),l((function(i){a=m("FCP"),n=h(e,a,r,t.reportAllChanges),requestAnimationFrame((function(){requestAnimationFrame((function(){a.value=performance.now()-i.timeStamp,n(!0)}))}))})))},b=!1,C=-1,w=function(e,t){!function(e,t){t=t||{};var n=[.1,.25];b||(S((function(e){C=e.value})),b=!0);var r,i=function(t){C>-1&&e(t)},a=m("CLS",0),o=0,u=[],c=function(e){e.forEach((function(e){if(!e.hadRecentInput){var t=u[0],n=u[u.length-1];o&&e.startTime-n.startTime<1e3&&e.startTime-t.startTime<5e3?(o+=e.value,u.push(e)):(o=e.value,u=[e]),o>a.value&&(a.value=o,a.entries=u,r())}}))},s=v("layout-shift",c);s&&(r=h(i,a,n,t.reportAllChanges),p((function(){c(s.takeRecords()),r(!0)})),l((function(){o=0,C=-1,a=m("CLS",0),r=h(i,a,n,t.reportAllChanges)})))}((function(t){!function(e){if(e.entries.length){var t=e.entries.reduce((function(e,t){return e&&e.value>t.value?e:t}));if(t&&t.sources&&t.sources.length){var n=(r=t.sources).find((function(e){return e.node&&1===e.node.nodeType}))||r[0];n&&(e.attribution={largestShiftTarget:c(n.node),largestShiftTime:t.startTime,largestShiftValue:t.value,largestShiftSource:n,largestShiftEntry:t,loadState:o(t.startTime)})}}else e.attribution={};var r}(t),e(t)}),t)},L=function(e,t){S((function(t){!function(e){if(e.entries.length){var t=a(),n=e.entries[e.entries.length-1];if(t){var r=t.activationStart||0,i=Math.max(0,t.responseStart-r);e.attribution={timeToFirstByte:i,firstByteToFCP:e.value-i,loadState:o(e.entries[0].startTime),navigationEntry:t,fcpEntry:n}}}else e.attribution={timeToFirstByte:0,firstByteToFCP:e.value,loadState:o(f())}}(t),e(t)}),t)},A={passive:!0,capture:!0},F=new Date,M=function(r,i){e||(e=i,t=r,n=new Date,I(removeEventListener),B())},B=function(){if(t>=0&&t<n-F){var i={entryType:"first-input",name:e.type,target:e.target,cancelable:e.cancelable,startTime:e.timeStamp,processingStart:e.timeStamp+t};r.forEach((function(e){e(i)})),r=[]}},x=function(e){if(e.cancelable){var t=(e.timeStamp>1e12?new Date:performance.now())-e.timeStamp;"pointerdown"==e.type?function(e,t){var n=function(){M(e,t),i()},r=function(){i()},i=function(){removeEventListener("pointerup",n,A),removeEventListener("pointercancel",r,A)};addEventListener("pointerup",n,A),addEventListener("pointercancel",r,A)}(t,e):M(t,e)}},I=function(e){["mousedown","keydown","touchstart","pointerdown"].forEach((function(t){return e(t,x,A)}))},k=function(n,i){i=i||{};var a,o=[100,300],u=E(),c=m("FID"),s=function(e){e.startTime<u.firstHiddenTime&&(c.value=e.processingStart-e.startTime,c.entries.push(e),a(!0))},f=function(e){e.forEach(s)},d=v("first-input",f);a=h(n,c,o,i.reportAllChanges),d&&p((function(){f(d.takeRecords()),d.disconnect()}),!0),d&&l((function(){var u;c=m("FID"),a=h(n,c,o,i.reportAllChanges),r=[],t=-1,e=null,I(addEventListener),u=s,r.push(u),B()}))},D=function(e,t){k((function(t){!function(e){var t=e.entries[0];e.attribution={eventTarget:c(t.target),eventType:t.name,eventTime:t.startTime,eventEntry:t,loadState:o(t.startTime)}}(t),e(t)}),t)},P=0,N=1/0,q=0,R=function(e){e.forEach((function(e){e.interactionId&&(N=Math.min(N,e.interactionId),q=Math.max(q,e.interactionId),P=q?(q-N)/7+1:0)}))},H=function(){return i?P:performance.interactionCount||0},O=function(){"interactionCount"in performance||i||(i=v("event",R,{type:"event",buffered:!0,durationThreshold:0}))},j=0,U=function(){return H()-j},V=[],_={},z=function(e){var t=V[V.length-1],n=_[e.interactionId];if(n||V.length<10||e.duration>t.latency){if(n)n.entries.push(e),n.latency=Math.max(n.latency,e.duration);else{var r={id:e.interactionId,latency:e.duration,entries:[e]};_[r.id]=r,V.push(r)}V.sort((function(e,t){return t.latency-e.latency})),V.splice(10).forEach((function(e){delete _[e.id]}))}},G=function(e,t){t=t||{};var n=[200,500];O();var r,i=m("INP"),a=function(e){e.forEach((function(e){(e.interactionId&&z(e),"first-input"===e.entryType)&&(!V.some((function(t){return t.entries.some((function(t){return e.duration===t.duration&&e.startTime===t.startTime}))}))&&z(e))}));var t,n=(t=Math.min(V.length-1,Math.floor(U()/50)),V[t]);n&&n.latency!==i.value&&(i.value=n.latency,i.entries=n.entries,r())},o=v("event",a,{durationThreshold:t.durationThreshold||40});r=h(e,i,n,t.reportAllChanges),o&&(o.observe({type:"first-input",buffered:!0}),p((function(){a(o.takeRecords()),i.value<0&&U()>0&&(i.value=0,i.entries=[]),r(!0)})),l((function(){V=[],j=H(),i=m("INP"),r=h(e,i,n,t.reportAllChanges)})))},J=function(e,t){G((function(t){!function(e){if(e.entries.length){var t=e.entries.sort((function(e,t){return t.duration-e.duration||t.processingEnd-t.processingStart-(e.processingEnd-e.processingStart)}))[0];e.attribution={eventTarget:c(t.target),eventType:t.name,eventTime:t.startTime,eventEntry:t,loadState:o(t.startTime)}}else e.attribution={}}(t),e(t)}),t)},K={},Q=function(e,t){!function(e,t){t=t||{};var n,r=[2500,4e3],i=E(),a=m("LCP"),o=function(e){var t=e[e.length-1];if(t){var r=t.startTime-d();r<i.firstHiddenTime&&(a.value=r,a.entries=[t],n())}},u=v("largest-contentful-paint",o);if(u){n=h(e,a,r,t.reportAllChanges);var c=function(){K[a.id]||(o(u.takeRecords()),u.disconnect(),K[a.id]=!0,n(!0))};["keydown","click"].forEach((function(e){addEventListener(e,c,{once:!0,capture:!0})})),p(c,!0),l((function(i){a=m("LCP"),n=h(e,a,r,t.reportAllChanges),requestAnimationFrame((function(){requestAnimationFrame((function(){a.value=performance.now()-i.timeStamp,K[a.id]=!0,n(!0)}))}))}))}}((function(t){!function(e){if(e.entries.length){var t=a();if(t){var n=t.activationStart||0,r=e.entries[e.entries.length-1],i=r.url&&performance.getEntriesByType("resource").filter((function(e){return e.name===r.url}))[0],o=Math.max(0,t.responseStart-n),u=Math.max(o,i?(i.requestStart||i.startTime)-n:0),s=Math.max(u,i?i.responseEnd-n:0),f=Math.max(s,r?r.startTime-n:0),l={element:c(r.element),timeToFirstByte:o,resourceLoadDelay:u-o,resourceLoadTime:s-u,elementRenderDelay:f-s,navigationEntry:t,lcpEntry:r};r.url&&(l.url=r.url),i&&(l.lcpResourceEntry=i),e.attribution=l}}else e.attribution={timeToFirstByte:0,resourceLoadDelay:0,resourceLoadTime:0,elementRenderDelay:e.value}}(t),e(t)}),t)},W=function e(t){document.prerendering?addEventListener("prerenderingchange",(function(){return e(t)}),!0):"complete"!==document.readyState?addEventListener("load",(function(){return e(t)}),!0):setTimeout(t,0)},X=function(e,t){t=t||{};var n=[800,1800],r=m("TTFB"),i=h(e,r,n,t.reportAllChanges);W((function(){var o=a();if(o){if(r.value=Math.max(o.responseStart-d(),0),r.value<0||r.value>performance.now())return;r.entries=[o],i(!0),l((function(){r=m("TTFB",0),(i=h(e,r,n,t.reportAllChanges))(!0)}))}}))},Y=function(e,t){X((function(t){!function(e){if(e.entries.length){var t=e.entries[0],n=t.activationStart||0,r=Math.max(t.domainLookupStart-n,0),i=Math.max(t.connectStart-n,0),a=Math.max(t.requestStart-n,0);e.attribution={waitingTime:r,dnsTime:i-r,connectionTime:a-i,requestTime:e.value-a,navigationEntry:t}}else e.attribution={waitingTime:0,dnsTime:0,connectionTime:0,requestTime:0}}(t),e(t)}),t)};export{w as onCLS,L as onFCP,D as onFID,J as onINP,Q as onLCP,Y as onTTFB};