Extracting CSS costs from RUM

css_cost.js

const totalStyleCost = async () => {
  return new Promise(resolve => {
    let total = 0;
    const obs = new PerformanceObserver(entryList => {
      const entries = entryList.getEntries();
      for (const entry of entries) {
          if (entry.paintTime) {
              total += entry.paintTime - entry.styleAndLayoutStart;
          } else {
              total += entry.startTime + entry.duration - entry.styleAndLayoutStart;
          }
          for (const script of entry.scripts) {
              total += script.forcedStyleAndLayoutDuration;
          }
      }
      resolve(total);
    });
    obs.observe({type: "long-animation-frame", buffered: true});
  });
}

const totalStyleCostSync = () => {
    let total = 0;
    const obs = new PerformanceObserver(() => {});     
    obs.observe({type: "long-animation-frame", buffered: true});
    const entries = obs.takeRecords();
    for (const entry of entries) {
          if (entry.paintTime) {
              total += entry.paintTime - entry.styleAndLayoutStart;
          } else {
              total += entry.startTime + entry.duration - entry.styleAndLayoutStart;
          }
          for (const script of entry.scripts) {
              total += script.forcedStyleAndLayoutDuration;
          }
    }
    return total;
}