RESOLVED FIXED285576
REGRESSION(282648@main): A tweet with 12000+ emojis takes Safari forever to display
https://bugs.webkit.org/show_bug.cgi?id=285576
Summary REGRESSION(282648@main): A tweet with 12000+ emojis takes Safari forever to d...
cueball045
Reported 2025-01-07 21:40:13 PST
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
Attachments
Radar WebKit Bug Importer
Comment 1 2025-01-09 13:24:23 PST
alan
Comment 2 2025-01-09 13:28:33 PST
It looks like we are busy with appending all those images elements to DOM.
Ryosuke Niwa
Comment 3 2025-01-09 23:39:34 PST
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>
Said Abou-Hallawa
Comment 4 2025-05-30 17:33:42 PDT
EWS
Comment 5 2025-10-10 15:46:24 PDT
Committed 301333@main (50da6f725760): <https://commits.webkit.org/301333@main> Reviewed commits have been landed. Closing PR #46151 and removing active labels.
Note You need to log in before you can comment on or make changes to this bug.