javascripts/pushr/dispatchers/rum.js

  1. /**
  2.  * @namespace javascripts.pushr.dispatchers.rum
  3.  * @description Handles the pushr events for Real User Metrics
  4.  */
  6. let allowedRumMetrics = ["ttfb", "networkInfo", "fcp", "fid", "lcp", "cls"]
  7. let rumMetricsCollected = []
  8. let rumObjects = []
  10. /**
  11.  * If it is a rum event then push the rum data onto a new array for rum data. If the metric type isn't
  12.  * one that is allow then we exit. If we have already collected it then we exit.
  13.  * 
  14.  * @function pushrDispatcher
  15.  * @memberof javascripts.pushr.dispatchers.rum
  16.  */
  17. export const pushrDispatcher = (pushrObject) => {
  18.   if (pushrObject.event !== "rum") return
  19.   if (!allowedRumMetrics.some(metric => metric === pushrObject.data.metric)) return
  20.   if (rumMetricsCollected.some(metric => metric === pushrObject.data.metric)) return
  21.   
  22.   rumMetricsCollected.push(pushrObject.data.metric)
  23.   rumObjects.push(pushrObject.data)
  24. }
  26. /**
  27.  * Dispatch any logs in rumObjects when the page is backgrounded or unloaded
  28.  * 
  29.  * @function leavePageDispatcher
  30.  * @memberof javascripts.pushr.dispatchers.rum
  31.  */
  32. export const leavePageDispatcher = () => {
  33.   const path = "/.netlify/functions/rum_logger-background/"
  34.   const body = JSON.stringify(rumObjects)
  35.   
  36.   if (rumObjects.length) batchPostRumData(path, body)
  37.   rumObjects = []
  38. }
  40. /**
  41.  * When the rum data is sent, empty the rumObjects array to ensure the data is not sent again. Use
  42.  * `navigator.sendBeacon()` if available, falling back to `fetch()`.
  43.  * 
  44.  * @function batchPostRumData
  45.  * @memberof javascripts.pushr.dispatchers.rum
  46.  */
  47. const batchPostRumData = (path, body) => {
  48.   (navigator.sendBeacon && navigator.sendBeacon(path, body)) ||
  49.   fetch(path, { body, method: "POST", keepalive: true })
  50. }