Add CDP frame events (#54249)

Summary:
Pull Request resolved: #54249

Scaffolding for the bare minimum events needed to have frames show up on the performance timeline.

layerTreeId hardcoded to `1` for now.

Support for dropped and idle frames to be added later, full list can be found here https://github.com/facebook/react-native-devtools-frontend/blob/main/front_end/models/trace/types/TraceEvents.ts#L2971. Some more thought needs to be put into how Android frame timing maps to these events.

{F1982947634}

Changelog: [Internal]

Reviewed By: rubennorte

Differential Revision: D85347959

fbshipit-source-id: 950b8866170e963dbb7e7ebbf0873ecb84676304

Author: sbuggay

packages/react-native/ReactCommon/jsinspector-modern/tracing/PerformanceTracer.cpp

@@ -737,6 +737,70 @@ void PerformanceTracer::enqueueTraceEventsFromPerformanceTracerEvent(
                     .args = folly::dynamic::object("data", std::move(data)),
                 });
           },
+          [&](PerformanceTracerSetLayerTreeIdEvent&& event) {
+            folly::dynamic data = folly::dynamic::object("frame", event.frame)(
+                "layerTreeId", event.layerTreeId);
+
+            events.emplace_back(
+                TraceEvent{
+                    .name = "SetLayerTreeId",
+                    .cat = "devtools.timeline",
+                    .ph = 'I',
+                    .ts = event.start,
+                    .pid = processId_,
+                    .s = 't',
+                    .tid = event.threadId,
+                    .args = folly::dynamic::object("data", std::move(data)),
+                });
+          },
+          [&](PerformanceTracerFrameBeginDrawEvent&& event) {
+            folly::dynamic data = folly::dynamic::object(
+                "frameSeqId", event.frameSeqId)("layerTreeId", 1);
+
+            events.emplace_back(
+                TraceEvent{
+                    .name = "BeginFrame",
+                    .cat = "devtools.timeline",
+                    .ph = 'I',
+                    .ts = event.start,
+                    .pid = processId_,
+                    .s = 't',
+                    .tid = event.threadId,
+                    .args = std::move(data),
+                });
+          },
+          [&](PerformanceTracerFrameCommitEvent&& event) {
+            folly::dynamic data = folly::dynamic::object(
+                "frameSeqId", event.frameSeqId)("layerTreeId", 1);
+
+            events.emplace_back(
+                TraceEvent{
+                    .name = "Commit",
+                    .cat = "devtools.timeline",
+                    .ph = 'I',
+                    .ts = event.start,
+                    .pid = processId_,
+                    .s = 't',
+                    .tid = event.threadId,
+                    .args = std::move(data),
+                });
+          },
+          [&](PerformanceTracerFrameDrawEvent&& event) {
+            folly::dynamic data = folly::dynamic::object(
+                "frameSeqId", event.frameSeqId)("layerTreeId", 1);
+
+            events.emplace_back(
+                TraceEvent{
+                    .name = "DrawFrame",
+                    .cat = "devtools.timeline",
+                    .ph = 'I',
+                    .ts = event.start,
+                    .pid = processId_,
+                    .s = 't',
+                    .tid = event.threadId,
+                    .args = std::move(data),
+                });
+          },
       },
       std::move(event));
 }

packages/react-native/ReactCommon/jsinspector-modern/tracing/PerformanceTracer.h

@@ -290,6 +290,35 @@ class PerformanceTracer {
     HighResTimeStamp createdAt = HighResTimeStamp::now();
   };
 
+  struct PerformanceTracerSetLayerTreeIdEvent {
+    std::string frame;
+    int layerTreeId;
+    HighResTimeStamp start;
+    ThreadId threadId;
+    HighResTimeStamp createdAt = HighResTimeStamp::now();
+  };
+
+  struct PerformanceTracerFrameBeginDrawEvent {
+    int frameSeqId;
+    HighResTimeStamp start;
+    ThreadId threadId;
+    HighResTimeStamp createdAt = HighResTimeStamp::now();
+  };
+
+  struct PerformanceTracerFrameCommitEvent {
+    int frameSeqId;
+    HighResTimeStamp start;
+    ThreadId threadId;
+    HighResTimeStamp createdAt = HighResTimeStamp::now();
+  };
+
+  struct PerformanceTracerFrameDrawEvent {
+    int frameSeqId;
+    HighResTimeStamp start;
+    ThreadId threadId;
+    HighResTimeStamp createdAt = HighResTimeStamp::now();
+  };
+
   using PerformanceTracerEvent = std::variant<
       PerformanceTracerEventTimeStamp,
       PerformanceTracerEventEventLoopTask,
@@ -298,7 +327,11 @@ class PerformanceTracer {
       PerformanceTracerEventMeasure,
       PerformanceTracerResourceSendRequest,
       PerformanceTracerResourceReceiveResponse,
-      PerformanceTracerResourceFinish>;
+      PerformanceTracerResourceFinish,
+      PerformanceTracerSetLayerTreeIdEvent,
+      PerformanceTracerFrameBeginDrawEvent,
+      PerformanceTracerFrameCommitEvent,
+      PerformanceTracerFrameDrawEvent>;
 
 #pragma mark - Private fields and methods