Skip to content

Text layout cache isn't invalidated when maxFontSizeMultiplier changes #56921

@atlj

Description

@atlj

Description

On both Android and iOS, React Native seems to be caching text layout as you can see here. The cache is invalidated when styles or the text itself changes however maxFontSizeMultiplier isn't being accounted for.

In the screenshots below, you can see that the applying a different maxFontSizeMultiplier value to otherwise two identical text components results in visual glitches when font scaling is not set to 1.

Steps to reproduce

  1. Render two identical text components with same style and strings
  2. On one of those components, set a maxFontSizeMultiplier, setting it to 1 works the best
  3. Increase the system font scaling value
  4. Optionally restart the app so other text scaling bugs in React Native have no effect
  5. You can see how the height on both of these text components are being calculated based on the first one that's rendered.

React Native Version

0.85.3

Affected Platforms

Runtime - Android, Runtime - iOS

Output of npx @react-native-community/cli info

info Fetching system and libraries information...
System:
  OS: macOS 15.7.7
  CPU: (12) arm64 Apple M4 Pro
  Memory: 224.25 MB / 48.00 GB
  Shell:
    version: 0.109.1
    path: /Users/burakguner/.cargo/bin/nu
Binaries:
  Node:
    version: 24.13.0
    path: /Users/burakguner/.nix-profile/bin/node
  Yarn:
    version: 1.22.22
    path: /Users/burakguner/.nix-profile/bin/yarn
  npm:
    version: 11.6.2
    path: /Users/burakguner/.nix-profile/bin/npm
  Watchman:
    version: 2026.01.19.00
    path: /Users/burakguner/.nix-profile/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /Users/burakguner/.local/share/gem/ruby/3.3.0/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 25.2
      - iOS 26.2
      - macOS 26.2
      - tvOS 26.2
      - visionOS 26.2
      - watchOS 26.2
  Android SDK:
    API Levels:
      - "30"
      - "31"
      - "34"
      - "35"
      - "36"
    Build Tools:
      - 35.0.0
      - 36.0.0
      - 36.1.0
    System Images:
      - android-30 | ARM 64 v8a
      - android-34 | Google Play ARM 64 v8a
      - android-35 | Google APIs ARM 64 v8a
      - android-35 | Google Play ARM 64 v8a
      - android-36.1 | Google Play ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: 2025.3 AI-253.32098.37.2534.15336583
  Xcode:
    version: 26.2/17C52
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 21.0.8
    path: /Users/burakguner/.nix-profile/bin/javac
  Ruby:
    version: 3.4.8
    path: /Users/burakguner/.nix-profile/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 20.1.0
    wanted: 20.1.0
  react:
    installed: 19.2.3
    wanted: 19.2.3
  react-native:
    installed: 0.85.3
    wanted: 0.85.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

N/A

MANDATORY Reproducer

https://github.com/atlj/reproducer-text-caching

Screenshots and Videos

Font Scale iOS 18.6 Android 14 Android 15 Android 16
1 Image Image Image Image
~2 Image Image Image Image

See how order matters here, that indicates a caching problem

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions