Bug 243949 - iOS 15.6 compositing with z-index causes crash
Summary: iOS 15.6 compositing with z-index causes crash
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Compositing (show other bugs)
Version: Safari 15
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2022-08-15 12:41 PDT by Liam DeBeasi
Modified: 2023-02-24 11:52 PST (History)
12 users (show)

See Also:


Attachments
Code reproduction (1.31 KB, text/html)
2022-08-15 12:41 PDT, Liam DeBeasi
no flags Details
Static testcase (1.15 KB, text/html)
2022-08-15 21:27 PDT, Simon Fraser (smfr)
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Liam DeBeasi 2022-08-15 12:41:13 PDT
Created attachment 461639 [details]
Code reproduction

When compositing a large number of elements that have z-index, WebKit will crash. This behavior first appeared on iOS 15.6.

Steps to reproduce:

1. Open the code reproduction on a device running iOS 15.6.
2. Inspect the page and open the "Layers" tab in dev tools.
3. Tap the "Crash" button.
4. Observe that memory usage spikes and Safari reloads the page.

Other Information:

- I tested this on an iPhone 11 running iOS 15.6. In my tests, the memory usage spiked to over 1GB.
- This code reproduction does use a large number of elements. While using a smaller number of elements (such as 100) won't crash the browser, it will still cause the memory usage to spike.
- This issue can also been seen on Safari for macOS. On Safari 15.5, clicking the "Crash" button brings the memory usage up to 40mb. On STP 151, clicking the "Crash" button brings the memory usage up to over 700mb. (Tested on a 2021 MacBook Pro with M1 Pro)
- This issue also happens on WKWebView.
Comment 1 Simon Fraser (smfr) 2022-08-15 13:41:55 PDT
The testcase triggers backing store allocation on all the `div.native` but I'm not sure why the ones outside the viewport have backing store.
Comment 2 Radar WebKit Bug Importer 2022-08-15 13:42:48 PDT
<rdar://problem/98686446>
Comment 3 Simon Fraser (smfr) 2022-08-15 21:27:25 PDT
Created attachment 461661 [details]
Static testcase

We make backing store for all the layers because they are inside a large, animated element ("container") so we keep all their backing stores alive.

There are several issues here:
1. The animation is a no-op, so we shouldn't consider it as something that extends backing store
2. z-index:-1 should not trigger backing store (`.native`) is a stacking context
3. Only `.container` should have backing while animating, because it's a stacking context.
Comment 4 Hans Krywalsky 2022-09-12 11:10:39 PDT
Still an issue with iOS 16, please fix as this is highly affecting users in one of our apps 😕
Comment 5 jameson 2022-09-13 06:14:02 PDT
This issue is also severely affecting our application and in some cases rendering it almost un-usable.
Comment 6 jameson 2022-09-13 07:05:31 PDT
Looks like this is still an issue in iOS 15.7 as well.
Comment 7 Simon Fraser (smfr) 2022-09-13 15:27:25 PDT
I think the fix for https://bugs.webkit.org/show_bug.cgi?id=244543 will fix this.
Comment 8 Maja 2022-09-27 06:50:19 PDT
I can confirm that I can reproduce this with 15.7 as well. Since our app is based on pinch zoom it makes it not usable at all. Would be nice if we can get this fixed soon.
Comment 9 Alexey Proskuryakov 2022-09-27 11:00:50 PDT
> I think the fix for https://bugs.webkit.org/show_bug.cgi?id=244543 will fix this.

Simon or Matt, would you mind confirming that it did?
Comment 10 Liam DeBeasi 2022-11-08 12:30:54 PST
The issue seems to be resolved on STP 156 on macOS. However, the issue persists on iOS 16.2 beta 2. The memory usage spikes to over 2GB when following the original steps to reproduce on an iPhone 13.
Comment 11 PaulPlay 2023-01-24 10:16:27 PST
I experience the same issue with cordova on 16.2
Comment 12 Liam DeBeasi 2023-02-24 11:52:53 PST
This no longer reproduces on iOS 16.3.