Skip to content

fix(ios): rendering hitches new arch#5

Merged
hannojg merged 3 commits into
0.81.4-discordfrom
fix/rendering-hitches-ios-new-arch
Jun 29, 2026
Merged

fix(ios): rendering hitches new arch#5
hannojg merged 3 commits into
0.81.4-discordfrom
fix/rendering-hitches-ios-new-arch

Conversation

@hannojg

@hannojg hannojg commented Jun 29, 2026

Copy link
Copy Markdown

Performance changes

I implemented multiple fixers which helped drive down render-passes, offscreen render passes and masking (which often results in additional render passes).

Snapshot masksToBounds layer.mask Render-pass layers Render-pass sum Offscreen flagged
Old arch DMS 482 66 54 93 54
New arch base 708 114 72 130 72
(1) RN Image fix 659 66 52 90 52
(2) FastImage interop overflow filter 538 70 52 90 52
(3) ClipView fix enabled 481 68 58 98 58
(4) FastImage inverse interop fix 492 73 54 95 54
(4) FastImage Fabric + clipping fix 488 71 51 91 51

Note: in between those snapshots the app content slightly changed so some snapshots can seem worse in some metrics, when they are not.

With all those fixes, during scrolling the DM list to the bottom, the total offscreen render passes which are especially expensive went from:

Old arch New arch base All fixes

1. Image component applied clipping and masks twice

RCTViewComponentView.mm‎ is setting a mask when border radius is applied, however, the image in JS is wrapped with a parent view to which styles get applied and that one already does the border radius + clipping!

2. Interop layer was setting overflow/clipping twice

It once set it on the native component and once on the interop intermediate view, causing double clipping.

Edit: This was necessary to avoid performance issues with DCDFastImageView going through the interop layer. We now landed on discord/discord to use the proper fabric componentview for fast image so this was no longer really necessary. There might be other views suffering from this, however, i'd prefer to make targeted changes for specific measurable instances!

3. ClipView fix

Actually in discord/discord:

4. FastImage Fabric

Actually in discord/discord:

@hannojg hannojg changed the title [WIP] fix(ios): rendering hitches arch [WIP] fix(ios): rendering hitches new arch Jun 29, 2026
@hannojg hannojg changed the title [WIP] fix(ios): rendering hitches new arch fix(ios): rendering hitches new arch Jun 29, 2026
@hannojg hannojg marked this pull request as ready for review June 29, 2026 18:34
@hannojg hannojg merged commit 36acc85 into 0.81.4-discord Jun 29, 2026
59 of 73 checks passed
@hannojg hannojg deleted the fix/rendering-hitches-ios-new-arch branch June 29, 2026 18:34
hannojg added a commit that referenced this pull request Jun 29, 2026
* fix(ios): rendering hitches

* avoid setting overflow twice for Legacy Interop components

* Revert "avoid setting overflow twice for Legacy Interop components"

This reverts commit 66ed378.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant