perf(text): experiment text optimizations (RN #59063, #59064)

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlags.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<652b195c21ffe47263fcfbe77a898aa1>>
+ * @generated SignedSource<<67b631d02306806e8c7ffa8c975109a1>>
  */
 
 /**
@@ -96,6 +96,12 @@ public object ReactNativeFeatureFlags {
   @JvmStatic
   public fun discordUiManagerOptimization(): Double = accessor.discordUiManagerOptimization()
 
+  /**
+   * Select text optimizations: 0 = none, 1 = keep paragraph content across unchanged clones, 2 = 1 + skip unused getDesiredWidth on Android.
+   */
+  @JvmStatic
+  public fun discordTextOptimization(): Double = accessor.discordTextOptimization()
+
   /**
    * When enabled, the accessibilityOrder prop will propagate to native platforms and define the accessibility order.
    */

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsCxxAccessor.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<10c483c7007076bb3c1cee1197c20c89>>
+ * @generated SignedSource<<f5cd71a6003014dfa456687464ece677>>
  */
 
 /**
@@ -31,6 +31,7 @@ internal class ReactNativeFeatureFlagsCxxAccessor : ReactNativeFeatureFlagsAcces
   private var disableTextLayoutManagerCacheAndroidCache: Boolean? = null
   private var disableViewPreallocationAndroidCache: Boolean? = null
   private var discordUiManagerOptimizationCache: Double? = null
+  private var discordTextOptimizationCache: Double? = null
   private var enableAccessibilityOrderCache: Boolean? = null
   private var enableAccumulatedUpdatesInRawPropsAndroidCache: Boolean? = null
   private var enableAndroidTextMeasurementOptimizationsCache: Boolean? = null
@@ -219,6 +220,15 @@ internal class ReactNativeFeatureFlagsCxxAccessor : ReactNativeFeatureFlagsAcces
     return cached
   }
 
+  override fun discordTextOptimization(): Double {
+    var cached = discordTextOptimizationCache
+    if (cached == null) {
+      cached = ReactNativeFeatureFlagsCxxInterop.discordTextOptimization()
+      discordTextOptimizationCache = cached
+    }
+    return cached
+  }
+
   override fun enableAccessibilityOrder(): Boolean {
     var cached = enableAccessibilityOrderCache
     if (cached == null) {

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsCxxInterop.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<1492421cd4b9bca791ee9ad5f87507a3>>
+ * @generated SignedSource<<cbe97e368b1f0cf81424f76dfdfed90b>>
  */
 
 /**
@@ -50,6 +50,8 @@ public object ReactNativeFeatureFlagsCxxInterop {
 
   @DoNotStrip @JvmStatic public external fun discordUiManagerOptimization(): Double
 
+  @DoNotStrip @JvmStatic public external fun discordTextOptimization(): Double
+
   @DoNotStrip @JvmStatic public external fun enableAccessibilityOrder(): Boolean
 
   @DoNotStrip @JvmStatic public external fun enableAccumulatedUpdatesInRawPropsAndroid(): Boolean

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsDefaults.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<462ac270e53d73922c29341d2bf557cc>>
+ * @generated SignedSource<<1228bb8dec11c46e2c26b775ff45d7e2>>
  */
 
 /**
@@ -45,6 +45,8 @@ public open class ReactNativeFeatureFlagsDefaults : ReactNativeFeatureFlagsProvi
 
   override fun discordUiManagerOptimization(): Double = 0.0
 
+  override fun discordTextOptimization(): Double = 0.0
+
   override fun enableAccessibilityOrder(): Boolean = false
 
   override fun enableAccumulatedUpdatesInRawPropsAndroid(): Boolean = true

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsLocalAccessor.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<bf74b75d5d8ac7eac7666dafefb03b0f>>
+ * @generated SignedSource<<5630bc94a28bed82e9246b5bd83eae2a>>
  */
 
 /**
@@ -35,6 +35,7 @@ internal class ReactNativeFeatureFlagsLocalAccessor : ReactNativeFeatureFlagsAcc
   private var disableTextLayoutManagerCacheAndroidCache: Boolean? = null
   private var disableViewPreallocationAndroidCache: Boolean? = null
   private var discordUiManagerOptimizationCache: Double? = null
+  private var discordTextOptimizationCache: Double? = null
   private var enableAccessibilityOrderCache: Boolean? = null
   private var enableAccumulatedUpdatesInRawPropsAndroidCache: Boolean? = null
   private var enableAndroidTextMeasurementOptimizationsCache: Boolean? = null
@@ -234,6 +235,16 @@ internal class ReactNativeFeatureFlagsLocalAccessor : ReactNativeFeatureFlagsAcc
     return cached
   }
 
+  override fun discordTextOptimization(): Double {
+    var cached = discordTextOptimizationCache
+    if (cached == null) {
+      cached = currentProvider.discordTextOptimization()
+      accessedFeatureFlags.add("discordTextOptimization")
+      discordTextOptimizationCache = cached
+    }
+    return cached
+  }
+
   override fun enableAccessibilityOrder(): Boolean {
     var cached = enableAccessibilityOrderCache
     if (cached == null) {

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/internal/featureflags/ReactNativeFeatureFlagsProvider.kt

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<ba69b300b057a5696d76bd1a667b91d0>>
+ * @generated SignedSource<<7ab6e2389bd15ff296dc78a32a5d2e8d>>
  */
 
 /**
@@ -45,6 +45,8 @@ public interface ReactNativeFeatureFlagsProvider {
 
   @DoNotStrip public fun discordUiManagerOptimization(): Double
 
+  @DoNotStrip public fun discordTextOptimization(): Double
+
   @DoNotStrip public fun enableAccessibilityOrder(): Boolean
 
   @DoNotStrip public fun enableAccumulatedUpdatesInRawPropsAndroid(): Boolean

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/TextLayoutManager.kt

@@ -731,13 +731,33 @@ internal object TextLayoutManager {
       )
     }
 
-    val desiredWidth = ceil(Layout.getDesiredWidth(text, paint)).toInt()
-
     val layoutWidth =
-        when (widthYogaMeasureMode) {
-          YogaMeasureMode.EXACTLY -> ceil(width).toInt()
-          YogaMeasureMode.AT_MOST -> min(desiredWidth, floor(width).toInt())
-          else -> desiredWidth
+        if (ReactNativeFeatureFlags.discordTextOptimization() >= 2.0) {
+          // Layout.getDesiredWidth is a full measuring pass over the text, so only run it when its
+          // result can affect the layout width. It cannot when the width is EXACTLY, nor when the
+          // text was boring but did not fit: boring.width is the unwrapped width of the same text
+          // and we only get here if it exceeds floor(width), so min(desiredWidth, floor(width)) is
+          // floor(width).
+          when {
+            widthYogaMeasureMode == YogaMeasureMode.EXACTLY -> ceil(width).toInt()
+            widthYogaMeasureMode == YogaMeasureMode.AT_MOST && boring != null ->
+                floor(width).toInt()
+            else -> {
+              val desiredWidth = ceil(Layout.getDesiredWidth(text, paint)).toInt()
+              if (widthYogaMeasureMode == YogaMeasureMode.AT_MOST) {
+                min(desiredWidth, floor(width).toInt())
+              } else {
+                desiredWidth
+              }
+            }
+          }
+        } else {
+          val desiredWidth = ceil(Layout.getDesiredWidth(text, paint)).toInt()
+          when (widthYogaMeasureMode) {
+            YogaMeasureMode.EXACTLY -> ceil(width).toInt()
+            YogaMeasureMode.AT_MOST -> min(desiredWidth, floor(width).toInt())
+            else -> desiredWidth
+          }
         }
     return buildLayout(
         text,

packages/react-native/ReactAndroid/src/main/jni/react/featureflags/JReactNativeFeatureFlagsCxxInterop.cpp

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<fd827f02cf87afa56d3827c6fd29a31f>>
+ * @generated SignedSource<<0be74c94405970ebed9a3deab3fe0a48>>
  */
 
 /**
@@ -105,6 +105,12 @@ class ReactNativeFeatureFlagsJavaProvider
     return method(javaProvider_);
   }
 
+  double discordTextOptimization() override {
+    static const auto method =
+        getReactNativeFeatureFlagsProviderJavaClass()->getMethod<jdouble()>("discordTextOptimization");
+    return method(javaProvider_);
+  }
+
   bool enableAccessibilityOrder() override {
     static const auto method =
         getReactNativeFeatureFlagsProviderJavaClass()->getMethod<jboolean()>("enableAccessibilityOrder");
@@ -692,6 +698,11 @@ double JReactNativeFeatureFlagsCxxInterop::discordUiManagerOptimization(
   return ReactNativeFeatureFlags::discordUiManagerOptimization();
 }
 
+double JReactNativeFeatureFlagsCxxInterop::discordTextOptimization(
+    facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop> /*unused*/) {
+  return ReactNativeFeatureFlags::discordTextOptimization();
+}
+
 bool JReactNativeFeatureFlagsCxxInterop::enableAccessibilityOrder(
     facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop> /*unused*/) {
   return ReactNativeFeatureFlags::enableAccessibilityOrder();
@@ -1196,6 +1207,9 @@ void JReactNativeFeatureFlagsCxxInterop::registerNatives() {
       makeNativeMethod(
         "discordUiManagerOptimization",
         JReactNativeFeatureFlagsCxxInterop::discordUiManagerOptimization),
+      makeNativeMethod(
+        "discordTextOptimization",
+        JReactNativeFeatureFlagsCxxInterop::discordTextOptimization),
       makeNativeMethod(
         "enableAccessibilityOrder",
         JReactNativeFeatureFlagsCxxInterop::enableAccessibilityOrder),

packages/react-native/ReactAndroid/src/main/jni/react/featureflags/JReactNativeFeatureFlagsCxxInterop.h

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<584ebd805c4a72383eb1e07ef28d490b>>
+ * @generated SignedSource<<974ffe0fc50bc5aa3d70fdc4a16c62ee>>
  */
 
 /**
@@ -63,6 +63,9 @@ class JReactNativeFeatureFlagsCxxInterop
   static double discordUiManagerOptimization(
     facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop>);
 
+  static double discordTextOptimization(
+    facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop>);
+
   static bool enableAccessibilityOrder(
     facebook::jni::alias_ref<JReactNativeFeatureFlagsCxxInterop>);
 

packages/react-native/ReactAndroid/src/test/java/com/facebook/react/views/text/TextLayoutManagerAbsoluteLayoutWithFractionalPixelTest.kt

@@ -13,9 +13,11 @@ import android.text.Layout
 import android.text.SpannableString
 import android.text.TextPaint
 import android.text.TextUtils
+import com.facebook.react.internal.featureflags.ReactNativeFeatureFlagsForTests
 import com.facebook.yoga.YogaMeasureMode
 import kotlin.math.ceil
 import org.assertj.core.api.Assertions.assertThat
+import org.junit.Before
 import org.junit.Test
 import org.junit.runner.RunWith
 import org.robolectric.RobolectricTestRunner
@@ -41,6 +43,11 @@ import org.robolectric.RobolectricTestRunner
 @RunWith(RobolectricTestRunner::class)
 class TextLayoutManagerAbsoluteLayoutWithFractionalPixelTest {
 
+  @Before
+  fun setUp() {
+    ReactNativeFeatureFlagsForTests.setUp()
+  }
+
   @Test
   fun `EXACTLY mode with fractional width allocates a layout wide enough to fit its own text`() {
     val text = SpannableString("Keep watching")

packages/react-native/ReactCommon/react/featureflags/ReactNativeFeatureFlags.cpp

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<8a37279e2d9a281cdeb43356993ec0a9>>
+ * @generated SignedSource<<bd78d327bd892d9768ec7f9b8102e480>>
  */
 
 /**
@@ -70,6 +70,10 @@ double ReactNativeFeatureFlags::discordUiManagerOptimization() {
   return getAccessor().discordUiManagerOptimization();
 }
 
+double ReactNativeFeatureFlags::discordTextOptimization() {
+  return getAccessor().discordTextOptimization();
+}
+
 bool ReactNativeFeatureFlags::enableAccessibilityOrder() {
   return getAccessor().enableAccessibilityOrder();
 }

packages/react-native/ReactCommon/react/featureflags/ReactNativeFeatureFlags.h

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<01cfdab8946e251169d6a69ed712d57e>>
+ * @generated SignedSource<<f679ea9525ce373bfde704471dee579a>>
  */
 
 /**
@@ -94,6 +94,11 @@ class ReactNativeFeatureFlags {
    */
   RN_EXPORT static double discordUiManagerOptimization();
 
+  /**
+   * Select text optimizations: 0 = none, 1 = keep paragraph content across unchanged clones, 2 = 1 + skip unused getDesiredWidth on Android.
+   */
+  RN_EXPORT static double discordTextOptimization();
+
   /**
    * When enabled, the accessibilityOrder prop will propagate to native platforms and define the accessibility order.
    */