properties using *
selector have more memory pressure since chromium 127 released
#14713
Replies: 5 comments 4 replies
-
Thank you for raising this — escalating it with my contacts on the Chrome team to see if we can figure out a quick resolution. |
Beta Was this translation helpful? Give feedback.
-
Everything needs to be on |
Beta Was this translation helpful? Give feedback.
-
The commit you mention is definitely related, it changes the CSS variables data to be garbage collected (using oilpan), where before it was not. Relevant change: https://chromium-review.googlesource.com/c/chromium/src/+/5470982/14/third_party/blink/renderer/core/style/style_variables.h#b47 My comment from another thread, quoting Chromium's commit message, is probably more relevant here.
In Chromium's documentation on memory management, the following sentence indicates that this type of change indeed can cause memory issues.
And
Usage in a style recalculation will definitely result in a very high allocation rate at least in some cases. |
Beta Was this translation helpful? Give feedback.
-
Edit: The Chromium optimization actually landed in version 127, as mentioned in the original Chromium issue i created. |
Beta Was this translation helpful? Give feedback.
-
Update: Chromium team fix a GC issue in commit, I've tested it in 132.0.6792.0 canary, and it feels really good, memory pressure reduced as usual. |
Beta Was this translation helpful? Give feedback.
-
Background
Recently we encountered a Chrome OOM issue, before starting this discussion, i've created a Chromium issue and discussed a lot with Chromium CSS team, here's the issue: https://issues.chromium.org/issues/368341452.
I'm gonna explain furthermore in the next section. There was no update in the issue since Oct 12, i'm looking for you guys for better help. I think maybe there's something tailwind can do to workaround, or giving more details to Chromium CSS team to fix this issue (maybe..).
How to repro Chromium's OOM
steps:
crash_minimum_repro.zip
from comment # 9, or crash_minimum_repro.zip (recommended)Toggle Tailwind CSS Style
in top (which will append / remove the specific <style /> contains tailwind output)chrome.oom.record.mp4
Information i have for the time being
I'm seeking help and wanna know:
--tw-ring-inset
,--tw-ring-offset-width
,--tw-ring-offset-color
, ..etc, apply to:root
instead of*
? I'm not sure whether these properties are inheritable or not? I confirmed that css above with * selector exist since tailwind 2.0 , and 4.0(in branchnext
) perisists.tailwindcss/packages/tailwindcss/src/ast.ts
Lines 183 to 187 in b701ed6
'false'
in utilities layer):tailwindcss/packages/tailwindcss/src/utilities.ts
Line 90 in b701ed6
Beta Was this translation helpful? Give feedback.
All reactions