Move AnimationBackend initialization from Animated (#55103)

Summary:
Pull Request resolved: #55103

This diff decouples AnimationBackend from Animated. Now the backend is intialized in the Scheduler, from where it's passed to UIManager. Animation frontends (such as Animated) can then obtain a reference to the backend, and use it to schedule animation frame updates.

# Changelog
[General] [Changed] - Moved AnimationBackend initiailzation to `Scheduler`
[General] [Added] - `AnimationChoreographer` interface with an implementation for fantom tests

Reviewed By: zeyap

Differential Revision: D89663251

Author: Bartlomiej Bloniarz

packages/react-native/ReactAndroid/src/main/jni/CMakeLists.txt

@@ -82,6 +82,7 @@ add_react_common_subdir(react/debug)
 add_react_common_subdir(react/featureflags)
 add_react_common_subdir(react/performance/cdpmetrics)
 add_react_common_subdir(react/performance/timeline)
+add_react_common_subdir(react/renderer/animationbackend)
 add_react_common_subdir(react/renderer/animations)
 add_react_common_subdir(react/renderer/attributedstring)
 add_react_common_subdir(react/renderer/componentregistry)
@@ -200,6 +201,7 @@ add_library(reactnative
           $<TARGET_OBJECTS:react_newarchdefaults>
           $<TARGET_OBJECTS:react_performance_cdpmetrics>
           $<TARGET_OBJECTS:react_performance_timeline>
+          $<TARGET_OBJECTS:react_renderer_animationbackend>
           $<TARGET_OBJECTS:react_renderer_animations>
           $<TARGET_OBJECTS:react_renderer_attributedstring>
           $<TARGET_OBJECTS:react_renderer_componentregistry>
@@ -293,6 +295,7 @@ target_include_directories(reactnative
         $<TARGET_PROPERTY:react_newarchdefaults,INTERFACE_INCLUDE_DIRECTORIES>
         $<TARGET_PROPERTY:react_performance_cdpmetrics,INTERFACE_INCLUDE_DIRECTORIES>
         $<TARGET_PROPERTY:react_performance_timeline,INTERFACE_INCLUDE_DIRECTORIES>
+        $<TARGET_PROPERTY:react_renderer_animationbackend,INTERFACE_INCLUDE_DIRECTORIES>
         $<TARGET_PROPERTY:react_renderer_animations,INTERFACE_INCLUDE_DIRECTORIES>
         $<TARGET_PROPERTY:react_renderer_attributedstring,INTERFACE_INCLUDE_DIRECTORIES>
         $<TARGET_PROPERTY:react_renderer_componentregistry,INTERFACE_INCLUDE_DIRECTORIES>

packages/react-native/ReactCommon/React-Fabric.podspec

@@ -157,6 +157,7 @@ Pod::Spec.new do |s|
     ss.source_files         = podspec_sources("react/renderer/scheduler/**/*.{m,mm,cpp,h}", "react/renderer/scheduler/**/*.h")
     ss.header_dir           = "react/renderer/scheduler"
 
+    ss.dependency             "React-Fabric/animationbackend"
     ss.dependency             "React-performancecdpmetrics"
     ss.dependency             "React-performancetimeline"
     ss.dependency             "React-Fabric/observers/events"

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

@@ -559,10 +559,8 @@ void NativeAnimatedNodesManager::startRenderCallbackIfNeeded(bool isAsync) {
   if (ReactNativeFeatureFlags::useSharedAnimatedBackend()) {
 #ifdef RN_USE_ANIMATION_BACKEND
     if (auto animationBackend = animationBackend_.lock()) {
-      std::static_pointer_cast<AnimationBackend>(animationBackend)
-          ->start(
-              [this](float /*f*/) { return pullAnimationMutations(); },
-              isAsync);
+      animationBackend->start(
+          [this](float /*f*/) { return pullAnimationMutations(); }, isAsync);
     }
 #endif
 

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

@@ -88,24 +88,17 @@ NativeAnimatedNodesManagerProvider::getOrCreate(
 
     if (ReactNativeFeatureFlags::useSharedAnimatedBackend()) {
 #ifdef RN_USE_ANIMATION_BACKEND
-      // TODO: this should be initialized outside of animated, but for now it
-      // was convenient to do it here
-      animationBackend_ = std::make_shared<AnimationBackend>(
-          std::move(startOnRenderCallback_),
-          std::move(stopOnRenderCallback_),
-          std::move(directManipulationCallback),
-          std::move(fabricCommitCallback),
-          uiManager,
-          jsInvoker);
+      auto animationBackend = uiManager->unstable_getAnimationBackend().lock();
+      react_native_assert(
+          animationBackend != nullptr && "animationBackend is nullptr");
+      animationBackend->registerJSInvoker(jsInvoker);
 
       nativeAnimatedNodesManager_ =
-          std::make_shared<NativeAnimatedNodesManager>(animationBackend_);
+          std::make_shared<NativeAnimatedNodesManager>(animationBackend);
 
       nativeAnimatedDelegate_ =
           std::make_shared<UIManagerNativeAnimatedDelegateBackendImpl>(
-              animationBackend_);
-
-      uiManager->unstable_setAnimationBackend(animationBackend_);
+              animationBackend);
 #endif
     } else {
       nativeAnimatedNodesManager_ =

packages/react-native/ReactCommon/react/renderer/animated/NativeAnimatedNodesManagerProvider.h

@@ -8,6 +8,7 @@
 #pragma once
 
 #include <react/renderer/animated/MergedValueDispatcher.h>
+#include <react/renderer/uimanager/UIManagerAnimationBackend.h>
 #include <react/renderer/uimanager/UIManagerNativeAnimatedDelegate.h>
 #include "NativeAnimatedNodesManager.h"
 
@@ -32,7 +33,6 @@ class NativeAnimatedNodesManagerProvider {
   std::shared_ptr<EventEmitterListener> getEventEmitterListener();
 
  private:
-  std::shared_ptr<UIManagerAnimationBackend> animationBackend_;
   std::shared_ptr<NativeAnimatedNodesManager> nativeAnimatedNodesManager_;
 
   std::shared_ptr<EventEmitterListenerContainer> eventEmitterListenerContainer_;

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

@@ -15,15 +15,6 @@
 
 namespace facebook::react {
 
-static const auto layoutProps = std::set<PropName>{
-    WIDTH,           HEIGHT,        FLEX,          MARGIN,      PADDING,
-    POSITION,        BORDER_WIDTH,  ALIGN_CONTENT, ALIGN_ITEMS, ALIGN_SELF,
-    ASPECT_RATIO,    BOX_SIZING,    DISPLAY,       FLEX_BASIS,  FLEX_DIRECTION,
-    ROW_GAP,         COLUMN_GAP,    FLEX_GROW,     FLEX_SHRINK, FLEX_WRAP,
-    JUSTIFY_CONTENT, MAX_HEIGHT,    MAX_WIDTH,     MIN_HEIGHT,  MIN_WIDTH,
-    STYLE_OVERFLOW,  POSITION_TYPE, DIRECTION,     Z_INDEX,
-};
-
 UIManagerNativeAnimatedDelegateBackendImpl::
     UIManagerNativeAnimatedDelegateBackendImpl(
         std::weak_ptr<UIManagerAnimationBackend> animationBackend)
@@ -61,20 +52,15 @@ static inline Props::Shared cloneProps(
 }
 
 AnimationBackend::AnimationBackend(
-    StartOnRenderCallback&& startOnRenderCallback,
-    StopOnRenderCallback&& stopOnRenderCallback,
     DirectManipulationCallback&& directManipulationCallback,
-    FabricCommitCallback&& fabricCommitCallback,
-    UIManager* uiManager,
-    std::shared_ptr<CallInvoker> jsInvoker)
-    : startOnRenderCallback_(std::move(startOnRenderCallback)),
-      stopOnRenderCallback_(std::move(stopOnRenderCallback)),
-      directManipulationCallback_(std::move(directManipulationCallback)),
-      fabricCommitCallback_(std::move(fabricCommitCallback)),
+    std::shared_ptr<UIManager> uiManager)
+    : directManipulationCallback_(std::move(directManipulationCallback)),
       animatedPropsRegistry_(std::make_shared<AnimatedPropsRegistry>()),
-      uiManager_(uiManager),
-      jsInvoker_(std::move(jsInvoker)),
-      commitHook_(uiManager, animatedPropsRegistry_) {}
+      uiManager_(uiManager.get()),
+      commitHook_(*uiManager, animatedPropsRegistry_) {
+  react_native_assert(directManipulationCallback_ != nullptr);
+  react_native_assert(uiManager_ != nullptr);
+}
 
 void AnimationBackend::onAnimationFrame(double timestamp) {
   std::unordered_map<SurfaceId, SurfaceUpdates> surfaceUpdates;
@@ -108,23 +94,20 @@ void AnimationBackend::onAnimationFrame(double timestamp) {
   requestAsyncFlushForSurfaces(asyncFlushSurfaces);
 }
 
-void AnimationBackend::start(const Callback& callback, bool isAsync) {
+void AnimationBackend::start(const Callback& callback, bool /*isAsync*/) {
   callbacks.push_back(callback);
-  // TODO: startOnRenderCallback_ should provide the timestamp from the
-  // platform
-  if (startOnRenderCallback_) {
-    startOnRenderCallback_(
-        [this]() {
-          onAnimationFrame(
-              std::chrono::steady_clock::now().time_since_epoch().count() /
-              1000);
-        },
-        isAsync);
+  if (!isRenderCallbackStarted_) {
+    auto delegate = uiManager_->getDelegate();
+    delegate->uiManagerShouldResumeAnimationBackend();
+    isRenderCallbackStarted_ = true;
   }
 }
-void AnimationBackend::stop(bool isAsync) {
-  if (stopOnRenderCallback_) {
-    stopOnRenderCallback_(isAsync);
+
+void AnimationBackend::stop(bool /*isAsync*/) {
+  if (isRenderCallbackStarted_) {
+    auto delegate = uiManager_->getDelegate();
+    delegate->uiManagerShouldPauseAnimationBackend();
+    isRenderCallbackStarted_ = false;
   }
   callbacks.clear();
 }
@@ -178,6 +161,9 @@ void AnimationBackend::synchronouslyUpdateProps(
 
 void AnimationBackend::requestAsyncFlushForSurfaces(
     const std::set<SurfaceId>& surfaces) {
+  react_native_assert(
+      jsInvoker_ != nullptr ||
+      surfaces.empty() && "jsInvoker_ was not provided");
   for (const auto& surfaceId : surfaces) {
     // perform an empty commit on the js thread, to force the commit hook to
     // push updated shadow nodes to react through RSNRU
@@ -199,4 +185,11 @@ void AnimationBackend::clearRegistry(SurfaceId surfaceId) {
   animatedPropsRegistry_->clear(surfaceId);
 }
 
+void AnimationBackend::registerJSInvoker(
+    std::shared_ptr<CallInvoker> jsInvoker) {
+  if (!jsInvoker_) {
+    jsInvoker_ = jsInvoker;
+  }
+}
+
 } // namespace facebook::react

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

@@ -50,36 +50,28 @@ struct AnimationMutations {
 class AnimationBackend : public UIManagerAnimationBackend {
  public:
   using Callback = std::function<AnimationMutations(float)>;
-  using StartOnRenderCallback = std::function<void(std::function<void()> &&, bool /* isAsync */)>;
-  using StopOnRenderCallback = std::function<void(bool /* isAsync */)>;
+  using ResumeCallback = std::function<void()>;
+  using PauseCallback = std::function<void()>;
   using DirectManipulationCallback = std::function<void(Tag, const folly::dynamic &)>;
-  using FabricCommitCallback = std::function<void(std::unordered_map<Tag, folly::dynamic> &)>;
 
   std::vector<Callback> callbacks;
-  const StartOnRenderCallback startOnRenderCallback_;
-  const StopOnRenderCallback stopOnRenderCallback_;
   const DirectManipulationCallback directManipulationCallback_;
-  const FabricCommitCallback fabricCommitCallback_;
   std::shared_ptr<AnimatedPropsRegistry> animatedPropsRegistry_;
   UIManager *uiManager_;
   std::shared_ptr<CallInvoker> jsInvoker_;
   AnimationBackendCommitHook commitHook_;
+  bool isRenderCallbackStarted_{false};
 
-  AnimationBackend(
-      StartOnRenderCallback &&startOnRenderCallback,
-      StopOnRenderCallback &&stopOnRenderCallback,
-      DirectManipulationCallback &&directManipulationCallback,
-      FabricCommitCallback &&fabricCommitCallback,
-      UIManager *uiManager,
-      std::shared_ptr<CallInvoker> jsInvoker);
+  AnimationBackend(DirectManipulationCallback &&directManipulationCallback, std::shared_ptr<UIManager> uiManager);
   void commitUpdates(SurfaceId surfaceId, SurfaceUpdates &surfaceUpdates);
   void synchronouslyUpdateProps(const std::unordered_map<Tag, AnimatedProps> &updates);
   void requestAsyncFlushForSurfaces(const std::set<SurfaceId> &surfaces);
   void clearRegistry(SurfaceId surfaceId) override;
+  void registerJSInvoker(std::shared_ptr<CallInvoker> jsInvoker) override;
 
   void onAnimationFrame(double timestamp) override;
   void trigger() override;
-  void start(const Callback &callback, bool isAsync);
+  void start(const Callback &callback, bool isAsync) override;
   void stop(bool isAsync) override;
 };
 } // namespace facebook::react

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

@@ -7,13 +7,15 @@
 
 #include <react/renderer/animationbackend/AnimationBackendCommitHook.h>
 
+#include <utility>
+
 namespace facebook::react {
 
 AnimationBackendCommitHook::AnimationBackendCommitHook(
-    UIManager* uiManager,
+    UIManager& uiManager,
     std::shared_ptr<AnimatedPropsRegistry> animatedPropsRegistry)
     : animatedPropsRegistry_(std::move(animatedPropsRegistry)) {
-  uiManager->registerCommitHook(*this);
+  uiManager.registerCommitHook(*this);
 }
 
 RootShadowNode::Unshared AnimationBackendCommitHook::shadowTreeWillCommit(

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

@@ -19,7 +19,7 @@ class AnimationBackendCommitHook : public UIManagerCommitHook {
   std::shared_ptr<AnimatedPropsRegistry> animatedPropsRegistry_;
 
  public:
-  AnimationBackendCommitHook(UIManager *uiManager, std::shared_ptr<AnimatedPropsRegistry> animatedPropsRegistry);
+  AnimationBackendCommitHook(UIManager &uiManager, std::shared_ptr<AnimatedPropsRegistry> animatedPropsRegistry);
   RootShadowNode::Unshared shadowTreeWillCommit(
       const ShadowTree &shadowTree,
       const RootShadowNode::Shared &oldRootShadowNode,

packages/react-native/ReactCommon/react/renderer/animationbackend/CMakeLists.txt

@@ -20,7 +20,6 @@ target_link_libraries(react_renderer_animationbackend
       react_renderer_graphics
       react_renderer_mounting
       react_renderer_uimanager
-      react_renderer_scheduler
       glog
       folly_runtime
 )