[Webkit-unassigned] [Bug 249909] New: Very slow layout of flexbox containing overflow-wrap or word-break

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=249909

            Bug ID: 249909
           Summary: Very slow layout of flexbox containing overflow-wrap
                    or word-break
           Product: WebKit
           Version: Safari 16
          Hardware: All
                OS: macOS 13
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: dmitry at codingrobots.com
                CC: bfulgham at webkit.org, simon.fraser at apple.com,
                    zalan at apple.com

Created attachment 464225

  --> https://bugs.webkit.org/attachment.cgi?id=464225&action=review

Bug demo

The following combination of elements:

display: flex >
  overflow-wrap: anywhere >
    display: inline

with a large enough one-line string in the last element
makes Safari spend 10s of seconds to layout and display it.

The example is attached.

Chrome renders it instantly, while Safari Version 16.1 (18614.2.9.1.12) and at least up to the nightly 258335 at main takes ~13 seconds on my Mac and iPhone.

- If I replace overflow-wrap: anywhere with word-break: break-all, layout still takes the same time.

However,

- If I remove display: flex from the parent element, it renders instantly.
- If I remove overflow-wrap or word-break, it render instantly.
- If I add position: relative to the #root and position: absolute to the #child, it renders instantly.
- If I replace the span content, which contains 24K numbers in one line, with a repeated pattern (I tried "aaaa..." and "AaAaAa..."), it renders much faster.

It also breaks GitHub: if I open a gist with the attached example, https://gist.github.com/dchest/1e49eadd9c00e109efb3fccca93d56a4 , it shows all sorts of rendering bugs.

Instruments (if I'm reading them right) show that most of the time is spent in WebCore::Font:applyTransforms.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20221227/26689102/attachment.htm>