Skip to content

Make elementCallback idempotent if using a custom viewport width#350

Merged
martinbooth merged 1 commit into
mainfrom
fix/make-elementCallback-idempotent
Jul 26, 2025
Merged

Make elementCallback idempotent if using a custom viewport width#350
martinbooth merged 1 commit into
mainfrom
fix/make-elementCallback-idempotent

Conversation

@martinbooth

Copy link
Copy Markdown
Contributor

I hadn't realised this got called multiple times with the same node and it isn't currently idempotent so each time a component re-renders it re-wraps getBoundingClientRect, increasing the amount the returned rect is scaled by each time.

Issue is only present if viewportScale !== 1

Fix captures the original getBoundingClientRect in a WeakMap so subsequent calls will re-use the original function when wrapping

I hadn't realised this got called multiple times with the same node
and it isn't currently idempotent so each time a component
re-renders it re-wraps getBoundingClientRect, increasing the amount
the returned rect is scaled by each time.

Issue is only present if viewportScale !== 1

Fix captures the original getBoundingClientRect in a WeakMap
so subsequent calls will re-use the original function when
wrapping
@github-actions

Copy link
Copy Markdown

workflow: benchmarks/size

Comparison of minified (terser) and compressed (brotli) size results, measured in bytes. Smaller is better.

Results Base Patch Ratio
react-strict-dom/dist/dom/index.js
· compressed 2,514 2,514 1.00
· minified 8,691 8,691 1.00
react-strict-dom/dist/dom/runtime.js
· compressed 855 855 1.00
· minified 2,435 2,435 1.00
react-strict-dom/dist/native/index.js
· compressed 16,675 16,664 1.00 -
· minified 63,767 63,915 1.00 +

@github-actions

Copy link
Copy Markdown

workflow: benchmarks/perf (native)

Comparison of performance test results, measured in operations per second. Larger is better.

Results Base Patch Ratio
css.create
· small 1,123,044 1,140,184 1.02 +
· small with units 488,131 498,086 1.02 +
· small with variables 634,577 672,098 1.06 !!
· several small 345,805 354,334 1.02 +
· large 201,491 202,566 1.01 +
· large with polyfills 146,996 148,399 1.01 +
· complex 102,713 103,567 1.01 +
· unsupported 213,208 214,298 1.01 +
css.createTheme
· simple theme 226,031 226,108 1.00 +
· polyfill theme 210,707 211,144 1.00 +
css.props
· small 230,355 230,309 1.00 -
· small with units 189,069 189,990 1.00 +
· small with variables 102,500 103,288 1.01 +
· small with variables of units 77,257 77,491 1.00 +
· large 96,641 96,910 1.00 +
· large with polyfills 37,325 37,299 1.00 -
· complex 23,694 23,501 0.99 -
· unsupported 143,137 142,787 1.00 -
· simple merge 161,082 161,871 1.00 +
· wide merge 17,875 17,796 1.00 -
· deep merge 17,504 17,412 0.99 -
· themed merge 32,199 32,280 1.00 +

@martinbooth martinbooth merged commit 2f8aa5f into main Jul 26, 2025
8 checks passed
@necolas necolas deleted the fix/make-elementCallback-idempotent branch August 4, 2025 04:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants