perf: Sort view props alphabetically because fabric is implemented th…

…at way
mrousavy · Jan 16, 2025 · 53ec8b4 · 53ec8b4
1 parent 8fa40b2
commit 53ec8b4
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 11 deletions.
diff --git a/packages/nitrogen/src/views/ViewComponentShadowNode.ts b/packages/nitrogen/src/views/ViewComponentShadowNode.ts
@@ -32,8 +32,18 @@ export function getViewComponentNames(
 }
 
 export function createViewComponentShadowNodeFiles(
-  spec: HybridObjectSpec
+  specOriginal: HybridObjectSpec
 ): SourceFile[] {
+  // Due to internal Fabric details, props must be alphabetically sorted.
+  const sortedProps = [...specOriginal.properties].sort((a, b) => {
+    if (a.name < b.name) return -1
+    else if (a.name > b.name) return 1
+    else return 0
+  })
+  const spec: HybridObjectSpec = {
+    ...specOriginal,
+    properties: sortedProps,
+  }
   if (!spec.isHybridView) {
     throw new Error(
       `Cannot create View Component ShadowNode code for ${spec.name} - it's not a HybridView!`

diff --git a/.../react-native-nitro-image/nitrogen/generated/shared/c++/views/HybridTestViewComponent.cpp b/.../react-native-nitro-image/nitrogen/generated/shared/c++/views/HybridTestViewComponent.cpp
@@ -16,28 +16,28 @@ namespace margelo::nitro::image::views {
                                            const HybridTestViewProps& sourceProps,
                                            const react::RawProps& rawProps):
     react::ViewProps(context, sourceProps, rawProps, filterObjectKeys),
-    someProp([&]() -> CachedProp<bool> {
-      const react::RawValue* rawValue = rawProps.at("someProp", nullptr, nullptr);
-      if (rawValue == nullptr) return {};
-      const auto& [runtime, value] = (std::pair<jsi::Runtime*, const jsi::Value&>)*rawValue;
-      return CachedProp<bool>::fromRawValue(*runtime, value, sourceProps.someProp);
-    }()),
     someCallback([&]() -> CachedProp<std::function<void(double /* someParam */)>> {
       const react::RawValue* rawValue = rawProps.at("someCallback", nullptr, nullptr);
       if (rawValue == nullptr) return {};
       const auto& [runtime, value] = (std::pair<jsi::Runtime*, const jsi::Value&>)*rawValue;
       return CachedProp<std::function<void(double /* someParam */)>>::fromRawValue(*runtime, value, sourceProps.someCallback);
+    }()),
+    someProp([&]() -> CachedProp<bool> {
+      const react::RawValue* rawValue = rawProps.at("someProp", nullptr, nullptr);
+      if (rawValue == nullptr) return {};
+      const auto& [runtime, value] = (std::pair<jsi::Runtime*, const jsi::Value&>)*rawValue;
+      return CachedProp<bool>::fromRawValue(*runtime, value, sourceProps.someProp);
     }()) { }
 
   HybridTestViewProps::HybridTestViewProps(const HybridTestViewProps& other):
     react::ViewProps(),
-    someProp(other.someProp),
-    someCallback(other.someCallback) { }
+    someCallback(other.someCallback),
+    someProp(other.someProp) { }
 
   bool HybridTestViewProps::filterObjectKeys(const std::string& propName) {
     switch (hashString(propName)) {
-      case hashString("someProp"): return true;
       case hashString("someCallback"): return true;
+      case hashString("someProp"): return true;
       default: return false;
     }
   }

diff --git a/.../react-native-nitro-image/nitrogen/generated/shared/c++/views/HybridTestViewComponent.hpp b/.../react-native-nitro-image/nitrogen/generated/shared/c++/views/HybridTestViewComponent.hpp
@@ -41,8 +41,8 @@ namespace margelo::nitro::image::views {
                         const react::RawProps& rawProps);
 
   public:
-    CachedProp<bool> someProp;
     CachedProp<std::function<void(double /* someParam */)>> someCallback;
+    CachedProp<bool> someProp;
 
   private:
     static bool filterObjectKeys(const std::string& propName);