- From: Joshua Peek <josh@joshpeek.com>
- Date: Mon, 17 Feb 2014 11:33:08 -0600
- To: public-web-perf@w3.org
Navigation and user timings have been useful to gather and analysis on the server side. Though, its a bit tricky to build tools that just take that data and upload it to a server. Theres no notification when new performance entries have been recorded. This requires invasive code to recheck the performance entries buffer. var seen = 0; function reportPerformance() { var entries = performance.getEntries(); var newEntries = entries.slice(seen); seen = entries.length; if (newEntries.length) { navigator.sendBeacon("/stats", JSON.stringify(newEntries)); } }); // gather all entries from initial load window.addEventListener("load", function() { reportPerformance(); }); // report script timing after async script loads var script = document.createElement("script"); script.src = "/async-script.js"; script.onload = reportPerformance; document.head.appendChild(script); // report user timing window.performance.mark("mark_fully_loaded"); reportPerformance(); And knowing when its safe to read performance.timing stats has a small edge case. window.addEventListener("load", function() { performance.timing.loadEventEnd; // 0 setTimeout(function() { performance.timing.loadEventEnd; // 123 }, 0); }); It would be helpful to receive an event or callback when the browser knows there are new performance entries available. This should cover any resource and user timings. Anything that will add new entries to `performance.getEntries()`. The notification should not even be synchronous. Batching and throttling the notification would be up to the browser. As of the NavigationTiming2 spec, the Performance interface is already an EventTarget. Heres an example of using a fictitious event name with to log client performance timings back to a server backend. performance.addEventListener("entries", function(event) { navigator.sendBeacon("/stats", JSON.stringify(event.newEntries)); }); And maybe even add an event or promise for navigation timing readiness. performance.timing.ready().then(function() { navigator.sendBeacon("/stats", JSON.stringify(performance.timing)); });
Received on Monday, 17 February 2014 17:33:35 UTC