285576 2025-01-07 21:40:13 -0800 REGRESSION(282648@main): A tweet with 12000+ emojis takes Safari forever to display 2025-10-10 15:46:27 -0700 1 1 1 Unclassified WebKit DOM Safari 18 Mac (Apple Silicon) macOS 15 RESOLVED FIXED InRadar P2 Minor --- 1 cueball045 sabouhallawa fantasai.bugs karlcow rniwa sabouhallawa simon.fraser vitor.roriz webkit-bug-importer zalan oldest_to_newest 2085702 0 cueball045 2025-01-07 21:40:13 -0800 A reply[1] to this parent tweet[2] shows some crab emojis. On clicking "Show more", Safari takes a good upwards of 10 seconds to open and show the entire tweet. Firefox and Chrome are much snappier in comparison (this also could be because I tested this on a new launch of these browsers but I was using Safari with multiple tabs already). Regardless, I would not expect Safari to be so laggy. The tweet has 12,090 🦀 emojis which is roughly 48.36 KB. Steps to reproduce: 1. Visit the parent tweet[2] 2. Scroll down to find a comment by the account @Jonathan_Blow which is just lots of 🦀. 3. Click "Show more". [1] https://x.com/Jonathan_Blow/status/1876748466908787124 [2] https://x.com/ThePrimeagen/status/1876739118350111093 2086179 1 webkit-bug-importer 2025-01-09 13:24:23 -0800 <rdar://problem/142638658> 2086181 2 zalan 2025-01-09 13:28:33 -0800 It looks like we are busy with appending all those images elements to DOM. 2086275 3 rniwa 2025-01-09 23:39:34 -0800 I've confirmed that the tweet in question (https://x.com/Jonathan_Blow/status/1876748466908787124) almost instantly loads at 282640@main. We're spending most of our time inside elementTextDirectionState and in particular, looking up dir attribute in Element::findAttributeByName. I'm having a trouble making a reproduction out of it though. Naively appending a bunch of img elements like this doesn't seem to fully replicate the pathology: <!DOCTYPE html> <html> <body> <style> img { width: 1.2em; height: 1.2em; } </style> <div id="container" dir="auto" lang="qme"><p id="tail" dir="ltr">tail</p></div> <script> onload = () => { requestAnimationFrame(() => { for (let i = 0; i < 12000; ++i) { const img = document.createElement('img'); img.alt = '🦀'; img.src = 'https://abs-0.twimg.com/emoji/v2/svg/1f980.svg'; img.setAttribute('draggable', 'false'); img.setAttribute('class', 'r-4qtqp9 r-dflpy8 r-k4bwe5 r-1kpi4qh r-pp5qcn r-h9hxbl'); container.insertBefore(img, tail); } }); } </script> </body> </html> 2120843 4 sabouhallawa 2025-05-30 17:33:42 -0700 Pull request: https://github.com/WebKit/WebKit/pull/46151 2150078 5 ews-feeder 2025-10-10 15:46:24 -0700 Committed 301333@main (50da6f725760): <https://commits.webkit.org/301333@main> Reviewed commits have been landed. Closing PR #46151 and removing active labels.