Avoid scratch TextPaint for Facsimile Layouts (#51827)

Summary:
Pull Request resolved: #51827

TextLayoutManager has an optimization today, where it reuses a scratch TextPaint throughout layouts.

This is not safe in Facsimile, since the paint is included as part of `Layout`, and the `Layout` escapes the TextLayoutManager, to later be drawn. I.e. every `PreparedLayoutTextView` right now is sharing this same scratch Paint.

This change makes it so that we only ever use a scratch paint for the purpose of measurements, where the layout is short-lived.

A simpler approach could be to just abandon the scratch TextPaint, since they do not seem wildly expensive at a glance (though not trivial).

Changelog: [Internal]

Reviewed By: rshest

Differential Revision: D75987605

fbshipit-source-id: 3fe3519c6164828a25cb4e2b0ee6eded73695a95

Author: NickGerleman

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

@@ -22,20 +22,15 @@ internal object FontMetricsUtil {
   private const val AMPLIFICATION_FACTOR = 100f
 
   @JvmStatic
-  fun getFontMetrics(
-      text: CharSequence,
-      layout: Layout,
-      paint: TextPaint,
-      context: Context
-  ): WritableArray {
+  fun getFontMetrics(text: CharSequence, layout: Layout, context: Context): WritableArray {
     val dm = context.resources.displayMetrics
     val lines = Arguments.createArray()
 
     // To calculate xHeight and capHeight we have to render an "x" and "T" and manually measure
     // their height. In order to get more precision than Android offers, we blow up the text size by
     // 100 and
     // measure it. Luckily, text size affects rendering linearly, so we can do this trick.
-    val paintCopy = TextPaint(paint).apply { textSize *= AMPLIFICATION_FACTOR }
+    val paintCopy = TextPaint(layout.paint).apply { textSize *= AMPLIFICATION_FACTOR }
 
     val capHeightBounds = Rect()
     paintCopy.getTextBounds(

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

@@ -112,9 +112,7 @@ public long measure(
 
           if (mShouldNotifyOnTextLayout) {
             ThemedReactContext themedReactContext = getThemedContext();
-            WritableArray lines =
-                FontMetricsUtil.getFontMetrics(
-                    text, layout, sTextPaintInstance, themedReactContext);
+            WritableArray lines = FontMetricsUtil.getFontMetrics(text, layout, themedReactContext);
             WritableMap event = Arguments.createMap();
             event.putArray("lines", lines);
             if (themedReactContext.hasActiveReactInstance()) {

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

@@ -373,7 +373,7 @@ private static Spannable createSpannableFromAttributedString(
 
   private static Layout createLayout(
       Spannable text,
-      BoringLayout.Metrics boring,
+      @Nullable BoringLayout.Metrics boring,
       float width,
       YogaMeasureMode widthYogaMeasureMode,
       boolean includeFontPadding,
@@ -417,7 +417,7 @@ private static Layout createLayout(
 
   private static Layout createLayoutWithCorrectRounding(
       Spannable text,
-      BoringLayout.Metrics boring,
+      @Nullable BoringLayout.Metrics boring,
       float width,
       YogaMeasureMode widthYogaMeasureMode,
       boolean includeFontPadding,
@@ -475,7 +475,7 @@ private static Layout createLayoutWithCorrectRounding(
 
   private static Layout createLayoutWithBuggedRounding(
       Spannable text,
-      BoringLayout.Metrics boring,
+      @Nullable BoringLayout.Metrics boring,
       float width,
       YogaMeasureMode widthYogaMeasureMode,
       boolean includeFontPadding,
@@ -571,14 +571,12 @@ private static Layout createLayoutWithBuggedRounding(
     return layout;
   }
 
+  /**
+   * Sets attributes on the TextPaint, used for content outside the Spannable text, like for empty
+   * strings, or newlines after the last trailing character
+   */
   private static void updateTextPaint(
       TextPaint paint, TextAttributeProps baseTextAttributes, Context context) {
-    // TextPaint attributes will be used for content outside the Spannable, like for the
-    // hypothetical height of a new line after a trailing newline character (considered part of the
-    // previous line).
-    paint.reset();
-    paint.setAntiAlias(true);
-
     if (baseTextAttributes.getEffectiveFontSize() != ReactConstants.UNSET) {
       paint.setTextSize(baseTextAttributes.getEffectiveFontSize());
     }
@@ -602,13 +600,33 @@ private static void updateTextPaint(
         paint.setFakeBoldText((missingStyle & Typeface.BOLD) != 0);
         paint.setTextSkewX((missingStyle & Typeface.ITALIC) != 0 ? -0.25f : 0);
       }
-    } else {
-      paint.setTypeface(null);
     }
   }
 
-  private static Layout createLayout(
-      @NonNull Context context,
+  /**
+   * WARNING: This paint should not be used for any layouts which may escape TextLayoutManager, as
+   * they may need to be drawn later, and may not safely be reused
+   */
+  private static TextPaint scratchPaintWithAttributes(
+      TextAttributeProps baseTextAttributes, Context context) {
+    TextPaint paint = Preconditions.checkNotNull(sTextPaintInstance.get());
+    paint.setTypeface(null);
+    paint.setTextSize(12);
+    paint.setFakeBoldText(false);
+    paint.setTextSkewX(0);
+    updateTextPaint(paint, baseTextAttributes, context);
+    return paint;
+  }
+
+  private static TextPaint newPaintWithAttributes(
+      TextAttributeProps baseTextAttributes, Context context) {
+    TextPaint paint = new TextPaint();
+    updateTextPaint(paint, baseTextAttributes, context);
+    return paint;
+  }
+
+  private static Layout createLayoutForMeasurement(
+      Context context,
       MapBuffer attributedString,
       MapBuffer paragraphAttributes,
       float width,
@@ -625,10 +643,29 @@ private static Layout createLayout(
     } else {
       TextAttributeProps baseTextAttributes =
           TextAttributeProps.fromMapBuffer(attributedString.getMapBuffer(AS_KEY_BASE_ATTRIBUTES));
-      paint = Preconditions.checkNotNull(sTextPaintInstance.get());
-      updateTextPaint(paint, baseTextAttributes, context);
+      paint = scratchPaintWithAttributes(baseTextAttributes, context);
     }
 
+    return createLayout(
+        text,
+        paint,
+        attributedString,
+        paragraphAttributes,
+        width,
+        widthYogaMeasureMode,
+        height,
+        heightYogaMeasureMode);
+  }
+
+  private static Layout createLayout(
+      Spannable text,
+      TextPaint paint,
+      MapBuffer attributedString,
+      MapBuffer paragraphAttributes,
+      float width,
+      YogaMeasureMode widthYogaMeasureMode,
+      float height,
+      YogaMeasureMode heightYogaMeasureMode) {
     BoringLayout.Metrics boring = isBoring(text, paint);
 
     int textBreakStrategy =
@@ -656,6 +693,7 @@ private static Layout createLayout(
                 paragraphAttributes.getString(PA_KEY_ELLIPSIZE_MODE))
             : null;
 
+    // T226571629: textAlign should be moved to ParagraphAttributes
     @Nullable String alignmentAttr = getTextAlignmentAttr(attributedString);
     Layout.Alignment alignment = getTextAlignment(attributedString, text, alignmentAttr);
     int justificationMode = getTextJustificationMode(alignmentAttr);
@@ -699,24 +737,28 @@ private static Layout createLayout(
 
   @UnstableReactNativeAPI
   public static PreparedLayout createPreparedLayout(
-      @NonNull Context context,
+      Context context,
       ReadableMapBuffer attributedString,
       ReadableMapBuffer paragraphAttributes,
       float width,
       YogaMeasureMode widthYogaMeasureMode,
       float height,
       YogaMeasureMode heightYogaMeasureMode,
       @Nullable ReactTextViewManagerCallback reactTextViewManagerCallback) {
+    Spannable text =
+        getOrCreateSpannableForText(context, attributedString, reactTextViewManagerCallback);
+    TextAttributeProps baseTextAttributes =
+        TextAttributeProps.fromMapBuffer(attributedString.getMapBuffer(AS_KEY_BASE_ATTRIBUTES));
     Layout layout =
         TextLayoutManager.createLayout(
-            Preconditions.checkNotNull(context),
+            text,
+            newPaintWithAttributes(baseTextAttributes, context),
             attributedString,
             paragraphAttributes,
             width,
             widthYogaMeasureMode,
             height,
-            heightYogaMeasureMode,
-            reactTextViewManagerCallback);
+            heightYogaMeasureMode);
 
     int maximumNumberOfLines =
         paragraphAttributes.contains(TextLayoutManager.PA_KEY_MAX_NUMBER_OF_LINES)
@@ -828,7 +870,7 @@ public static long measureText(
       @Nullable float[] attachmentsPositions) {
     // TODO(5578671): Handle text direction (see View#getTextDirectionHeuristic)
     Layout layout =
-        createLayout(
+        createLayoutForMeasurement(
             context,
             attributedString,
             paragraphAttributes,
@@ -1151,23 +1193,23 @@ private static int nextAttachmentMetrics(
   }
 
   public static WritableArray measureLines(
-      @NonNull Context context,
+      Context context,
       MapBuffer attributedString,
       MapBuffer paragraphAttributes,
       float width,
       float height) {
     Layout layout =
-        createLayout(
+        createLayoutForMeasurement(
             context,
             attributedString,
             paragraphAttributes,
             width,
             YogaMeasureMode.EXACTLY,
             height,
             YogaMeasureMode.EXACTLY,
+            // TODO T226571550: Fix measureLines with ReactTextViewManagerCallback
             null);
-    return FontMetricsUtil.getFontMetrics(
-        layout.getText(), layout, Preconditions.checkNotNull(sTextPaintInstance.get()), context);
+    return FontMetricsUtil.getFontMetrics(layout.getText(), layout, context);
   }
 
   private static @Nullable BoringLayout.Metrics isBoring(Spannable text, TextPaint paint) {