svelte-bricks icon indicating copy to clipboard operation
svelte-bricks copied to clipboard

How can we avoid CLS?

Open Conceptiks opened this issue 9 months ago • 1 comments

Hey, I am trying to create a masonry grid without any (or very little) layout shift. Is this possible with svelte-bricks. My current attempts always load a one-column layout which then shifts to adjust for the viewport width. Any tips?

Conceptiks avatar Apr 30 '24 14:04 Conceptiks

yeah, the layout shift in svelte-bricks is admittedly terrible. it needs JS to compute the number of columns based on the container width. i may be wrong but i think the only way to avoid that is a CSS-only solution (maybe this has become slightly easier now with CSS container queries). or delay rendering altogether until JS is ready. PRs for either of those would be welcome

janosh avatar Apr 30 '24 17:04 janosh