refactor(core): Optimize fiber data processing

Author: aidenybai

README.md

@@ -246,9 +246,10 @@ We expect all contributors to abide by the terms of our [Code of Conduct](https:
 - [ ] "PageSpeed insights" for React
 - [ ] Offscreen canvas on worker thread
 - [ ] React Native support
-- [ ] Name / explain the actual problem
+- [ ] Name / explain the actual problem, docs
 - [ ] Simple FPS counter
 - [ ] Drag and select areas of the screen to scan
+- [ ] Long task progress bar filter
 - [ ] Add a funny mascot, like the ["Stop I'm Changing" dude](https://www.youtube.com/shorts/FwOZdX7bDKI?app=desktop)
 
 ## Acknowledgments

src/core/index.ts

@@ -193,22 +193,6 @@ export const start = () => {
         playGeigerClickSound(audioContext, amplitude);
       }
 
-      const fiberData = ReactScanInternals.fiberMap.get(fiber);
-      const now = Date.now();
-      let count = render.count;
-      let time = render.time;
-      if (fiberData) {
-        // clear aggregated fibers after 5 seconds
-        if (now - fiberData.lastUpdated > (options.resetCountTimeout ?? 5000)) {
-          ReactScanInternals.fiberMap.delete(fiber);
-        } else {
-          count += fiberData.count;
-          time += fiberData.time;
-          render.count = count;
-          render.time = time;
-        }
-      }
-
       if (render.name) {
         const prev = ReactScanInternals.reportData[render.name];
         ReactScanInternals.reportData[render.name] = {
@@ -217,14 +201,33 @@ export const start = () => {
         };
       }
 
-      ReactScanInternals.fiberMap.set(fiber, {
-        count,
-        time,
-        lastUpdated: now,
-      });
-
       requestAnimationFrame(() => {
         flushOutlines(ctx, new Map(), toolbar, perfObserver);
+
+        const fiberData = ReactScanInternals.fiberMap.get(fiber);
+        const now = Date.now();
+        let count = render.count;
+        let time = render.time;
+        if (fiberData) {
+          // clear aggregated fibers after 5 seconds
+          if (
+            now - fiberData.lastUpdated >
+            (options.resetCountTimeout ?? 5000)
+          ) {
+            ReactScanInternals.fiberMap.delete(fiber);
+          } else {
+            count += fiberData.count;
+            time += fiberData.time;
+            render.count = count;
+            render.time = time;
+          }
+        }
+
+        ReactScanInternals.fiberMap.set(fiber, {
+          count,
+          time,
+          lastUpdated: now,
+        });
       });
     },
     onCommitFinish() {