Add pushAnimationMutations to the AnimationBackend (#56401)

Summary:
Pull Request resolved: #56401

Add `pushAnimationMutations(Callback)` to the AnimationBackend as a targeted alternative to `trigger()`.

The existing `trigger()` method has two problems:

1. **Blast radius**: It calls `onAnimationFrame()` which invokes ALL registered callbacks. When one animation frontend (e.g. Animated) calls `trigger()` in response to an event, every other frontend (e.g. Reanimated) also spins up unnecessarily.

2. **Broken timestamp on iOS**: `trigger()` uses `std::chrono::steady_clock` which on iOS maps to a different kernel clock than what `CADisplayLink` uses for vsync timestamps. These clocks have different baselines and can diverge over time (e.g. after device sleep), causing animations to see time jumps.

`pushAnimationMutations(Callback)` fixes both issues:
- Executes only the provided callback, not all registered ones
- Uses `AnimationChoreographer::now()` which delegates to `HighResTimeStamp`, providing a timestamp from the same clock as the vsync path on each platform

Also refactors `onAnimationFrame` to use `unpackMutations`/`applySurfaceUpdates` helpers, avoiding intermediate vector/set merging when accumulating mutations from multiple callbacks.

[General][Added] - Add pushAnimationMutations to AnimationBackend for targeted event-driven animation updates

Reviewed By: zeyap

Differential Revision: D100164749

fbshipit-source-id: 53d36ed316614baa835707a45361ae8f3b828d26

Author: Bartlomiej Bloniarz

packages/react-native/ReactCommon/react/renderer/animated/NativeAnimatedNodesManager.cpp

@@ -515,7 +515,10 @@ void NativeAnimatedNodesManager::handleAnimatedEvent(
     // frames.
     if (ReactNativeFeatureFlags::useSharedAnimatedBackend()) {
       if (auto animationBackend = animationBackend_.lock()) {
-        animationBackend->trigger();
+        animationBackend->pushAnimationMutations(
+            [this](AnimationTimestamp timestamp) -> AnimationMutations {
+              return pullAnimationMutations(timestamp);
+            });
       }
     } else {
       onRender();

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimationBackend.cpp

@@ -51,31 +51,27 @@ AnimationBackend::AnimationBackend(
   react_native_assert(uiManager_.expired() == false);
 }
 
-void AnimationBackend::onAnimationFrame(AnimationTimestamp timestamp) {
-  std::vector<CallbackWithId> callbacksCopy;
-  std::unordered_map<SurfaceId, SurfaceUpdates> surfaceUpdates;
-  std::set<SurfaceId> asyncFlushSurfaces;
+void AnimationBackend::unpackMutations(
+    AnimationMutations& mutations,
+    std::unordered_map<SurfaceId, SurfaceUpdates>& surfaceUpdates,
+    std::set<SurfaceId>& asyncFlushSurfaces) {
+  for (auto& mutation : mutations.batch) {
+    const auto family = mutation.family;
+    react_native_assert(family != nullptr);
 
-  {
-    std::lock_guard lock(mutex_);
-    callbacksCopy = callbacks;
+    auto& [families, updates, hasLayoutUpdates] =
+        surfaceUpdates[family->getSurfaceId()];
+    hasLayoutUpdates |= mutation.hasLayoutUpdates;
+    families.insert(family);
+    updates[mutation.tag] = std::move(mutation.props);
   }
 
-  for (auto& callbackWithId : callbacksCopy) {
-    auto mutations = callbackWithId.callback(timestamp);
-    asyncFlushSurfaces.merge(mutations.asyncFlushSurfaces);
-    for (auto& mutation : mutations.batch) {
-      const auto family = mutation.family;
-      react_native_assert(family != nullptr);
-
-      auto& [families, updates, hasLayoutUpdates] =
-          surfaceUpdates[family->getSurfaceId()];
-      hasLayoutUpdates |= mutation.hasLayoutUpdates;
-      families.insert(family);
-      updates[mutation.tag] = std::move(mutation.props);
-    }
-  }
+  asyncFlushSurfaces.merge(mutations.asyncFlushSurfaces);
+}
 
+void AnimationBackend::applySurfaceUpdates(
+    std::unordered_map<SurfaceId, SurfaceUpdates>& surfaceUpdates,
+    const std::set<SurfaceId>& asyncFlushSurfaces) {
   animatedPropsRegistry_->update(surfaceUpdates);
 
   for (auto& [surfaceId, updates] : surfaceUpdates) {
@@ -89,6 +85,30 @@ void AnimationBackend::onAnimationFrame(AnimationTimestamp timestamp) {
   requestAsyncFlushForSurfaces(asyncFlushSurfaces);
 }
 
+void AnimationBackend::applyMutations(AnimationMutations mutations) {
+  std::unordered_map<SurfaceId, SurfaceUpdates> surfaceUpdates;
+  std::set<SurfaceId> asyncFlushSurfaces;
+  unpackMutations(mutations, surfaceUpdates, asyncFlushSurfaces);
+  applySurfaceUpdates(surfaceUpdates, asyncFlushSurfaces);
+}
+
+void AnimationBackend::onAnimationFrame(AnimationTimestamp timestamp) {
+  std::vector<CallbackWithId> callbacksCopy;
+
+  {
+    std::lock_guard lock(mutex_);
+    callbacksCopy = callbacks;
+  }
+
+  std::unordered_map<SurfaceId, SurfaceUpdates> surfaceUpdates;
+  std::set<SurfaceId> asyncFlushSurfaces;
+  for (auto& callbackWithId : callbacksCopy) {
+    auto mutations = callbackWithId.callback(timestamp);
+    unpackMutations(mutations, surfaceUpdates, asyncFlushSurfaces);
+  }
+  applySurfaceUpdates(surfaceUpdates, asyncFlushSurfaces);
+}
+
 CallbackId AnimationBackend::start(const Callback& callback) {
   std::lock_guard lock(mutex_);
 
@@ -123,6 +143,12 @@ void AnimationBackend::trigger() {
   onAnimationFrame(std::chrono::steady_clock::now().time_since_epoch());
 }
 
+void AnimationBackend::pushAnimationMutations(const Callback& callback) {
+  auto timestamp = animationChoreographer_->now();
+  auto mutations = callback(timestamp);
+  applyMutations(std::move(mutations));
+}
+
 void AnimationBackend::commitUpdates(
     SurfaceId surfaceId,
     SurfaceUpdates& surfaceUpdates) {

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimationBackend.h

@@ -60,10 +60,19 @@ class AnimationBackend : public UIManagerAnimationBackend {
 
   void onAnimationFrame(AnimationTimestamp timestamp) override;
   void trigger() override;
+  void pushAnimationMutations(const Callback &callback) override;
   CallbackId start(const Callback &callback) override;
   void stop(CallbackId callbackId) override;
 
  private:
+  void unpackMutations(
+      AnimationMutations &mutations,
+      std::unordered_map<SurfaceId, SurfaceUpdates> &surfaceUpdates,
+      std::set<SurfaceId> &asyncFlushSurfaces);
+  void applySurfaceUpdates(
+      std::unordered_map<SurfaceId, SurfaceUpdates> &surfaceUpdates,
+      const std::set<SurfaceId> &asyncFlushSurfaces);
+  void applyMutations(AnimationMutations mutations);
   std::vector<CallbackWithId> callbacks;
   std::shared_ptr<AnimatedPropsRegistry> animatedPropsRegistry_;
   std::shared_ptr<AnimationChoreographer> animationChoreographer_;

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimationChoreographer.h

@@ -8,6 +8,7 @@
 #pragma once
 
 #include <react/renderer/uimanager/UIManagerAnimationBackend.h>
+#include <react/timing/primitives.h>
 
 namespace facebook::react {
 
@@ -21,6 +22,10 @@ class AnimationChoreographer {
 
   virtual void resume() = 0;
   virtual void pause() = 0;
+  virtual AnimationTimestamp now() const
+  {
+    return HighResTimeStamp::now().toChronoSteadyClockTimePoint().time_since_epoch();
+  }
   void setAnimationBackend(std::weak_ptr<UIManagerAnimationBackend> animationBackend)
   {
     animationBackend_ = animationBackend;

packages/react-native/ReactCommon/react/renderer/uimanager/UIManagerAnimationBackend.h

@@ -31,6 +31,7 @@ class UIManagerAnimationBackend {
   virtual void stop(CallbackId callbackId) = 0;
   virtual void clearRegistry(SurfaceId surfaceId) = 0;
   virtual void trigger() = 0;
+  virtual void pushAnimationMutations(const Callback &callback) = 0;
   virtual void registerJSInvoker(std::shared_ptr<CallInvoker> jsInvoker) = 0;
 };
 

private/react-native-fantom/tester/src/TesterAnimationChoreographer.h

@@ -7,6 +7,8 @@
 
 #pragma once
 
+#include <functional>
+
 #include <react/renderer/animationbackend/AnimationChoreographer.h>
 #include <react/renderer/core/ReactPrimitives.h>
 #include <react/runtime/ReactInstanceConfig.h>
@@ -19,8 +21,22 @@ class TesterAnimationChoreographer : public AnimationChoreographer {
   void pause() override;
   void runUITick(AnimationTimestamp timestamp);
 
+  AnimationTimestamp now() const override
+  {
+    if (clockProvider_) {
+      return clockProvider_();
+    }
+    return AnimationChoreographer::now();
+  }
+
+  void setClockProvider(std::function<AnimationTimestamp()> clockProvider)
+  {
+    clockProvider_ = std::move(clockProvider);
+  }
+
  private:
   bool isPaused_{false};
+  std::function<AnimationTimestamp()> clockProvider_;
 };
 
 } // namespace facebook::react