Bug 150445
| Summary: | Flexbox - flex direction column slow layout performance | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Scott Bobertson <scottbobertson> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED DUPLICATE | ||
| Severity: | Major | CC: | beidson, bernd.helzer, eoconnor, hyatt, jonlee, l1657572, ljharb, mike.sherov, mozilla, mrflix, rik, simon.fraser, webkit-bug-importer, zalan |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari 9 | ||
| Hardware: | Mac | ||
| OS: | OS X 10.10 | ||
| See Also: | https://bugs.webkit.org/show_bug.cgi?id=289072 | ||
Scott Bobertson
Nested divs with 'display: flex' and 'flex-direction: column' have very slow performance in Safari.
At a depth of 18 divs with these CSS properties Safari takes a total of 6578ms to layout and paint the divs this time grows exponentially as the depth of divs increases. This same test performed on Chrome or Firefox takes 2ms.
Here is a demo of the problem. (open the console to see the results)
http://codepen.io/anon/pen/zvRKYN?editors=001
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/23222219>
James Seigel
Still seems to be a critical problem. Definitely causes issues when nesting, or when products create deep nesting like react-native-web for example.
l1657572
I can confirm. I'm currently using a Flexbox framework which renders great on Chrome and Firefox, but slows to a crawl on Safari. Major issue.
Jon Lee
This is fixed with the latest flex box checkin in b168657.
*** This bug has been marked as a duplicate of bug 168657 ***