Skip to content

perf: Cache parsed box shadow strings - #57968

Open
ya-nsh wants to merge 1 commit into
react:mainfrom
ya-nsh:perf/cache-box-shadow-parsing
Open

perf: Cache parsed box shadow strings#57968
ya-nsh wants to merge 1 commit into
react:mainfrom
ya-nsh:perf/cache-box-shadow-parsing

Conversation

@ya-nsh

@ya-nsh ya-nsh commented Aug 15, 2026

Copy link
Copy Markdown
Contributor

Summary:

processBoxShadow reparses string values every time style processing runs, even when the same static shadow is shared by many views.

This adds a 1024-entry LRU cache for string inputs. A value is admitted after its second use so one-off dynamic strings do not pay the allocation cost of cloning a result. Cached arrays and entries are copied before they are returned, which preserves the existing mutation behavior. Array inputs continue through the existing uncached path.

I also added a Fantom benchmark for repeated and unique string inputs. A local release Metro bundle run on Node 22.22.1, pinned to one CPU, produced these median times over 25 samples:

scenario main this change
one string, 50,000 calls 127.64 ms 4.73 ms
16 strings, 50,000 calls 130.66 ms 4.20 ms
unique strings, 5,000 calls 21.04 ms 25.72 ms

The repeated cases were 27.0x and 31.1x faster. The unique case was 22.3% slower from bounded cache bookkeeping, without the extra result clone that a first-use admission policy would require.

Changelog:

[GENERAL] [CHANGED] - Cache repeated CSS box shadow processing

Test Plan:

  • yarn test packages/react-native/Libraries/StyleSheet/__tests__/processBoxShadow-test.js --runInBand (4 tests passed)
  • yarn flow-check --show-all-errors (0 errors)
  • yarn eslint packages/react-native/Libraries/StyleSheet/processBoxShadow.js packages/react-native/Libraries/StyleSheet/__tests__/processBoxShadow-test.js packages/react-native/Libraries/StyleSheet/__tests__/processBoxShadow-benchmark-itest.js
  • node node_modules/prettier/bin/prettier.cjs --check packages/react-native/Libraries/StyleSheet/processBoxShadow.js packages/react-native/Libraries/StyleSheet/__tests__/processBoxShadow-test.js packages/react-native/Libraries/StyleSheet/__tests__/processBoxShadow-benchmark-itest.js
  • git diff --check

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Aug 15, 2026
@ya-nsh
ya-nsh force-pushed the perf/cache-box-shadow-parsing branch from 940006d to b48379e Compare August 15, 2026 19:21
@facebook-github-tools facebook-github-tools Bot added the Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. label Aug 15, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant