Implemented Custom smilies and reactions are causing layout shift if not using sprite mode

[Kirby]

Custom smilies and reactions do not have a width and height for the image if sprite mode is not used and thus are causing layout shift.

Depending on the size of the smilies (think of large animated smilies) this can sum up quite a bit.

 

[Mike]

I don't think this is necessarily a bug per se (I don't think a layout shift is automatically a bug, particularly if it involves something that we haven't ever attempted to track and thus don't have available).

I think I'll move this to suggestions for now, though I'm pretty sure that you can get away with sprite mode with individual images provided you specify the dimensions, so there is a workaround.

 

[Kirby]

I don't think this is necessarily a bug per se

I respectfully disagree here. CLS is a web vital and Google does recommend to fix this if it is over 0,1 - so ideally it should be 0.
Yes, there is a workaround, but IMHO it is rather unintuitive to go down that route (and does increase CSS).

I've just added a bit of code to automatically store the dimensions in smilie cache and use those when rendering BB code, that's a lot easier than having to enter dimensions for each and every smilie

 

[titocento]

I respectfully disagree here. CLS is a web vital and Google does recommend to fix this if it is over 0,1 - so ideally it should be 0.
Yes, there is a workaround, but IMHO it is rather unintuitive to go down that route (and does increase CSS).

I've just added a bit of code to automatically store the dimensions in smilie cache and use those when rendering BB code, that's a lot easier than having to enter dimensions for each and every smilie

Hi @Kirby , can you share that code?

 

[Kirby]

Not a big issue and not exactly what this suggestion is about but closely related:
PageSpeed Insights complains about emojis not having width/height attributes

As the size (64x64 or 72x72 depending on the emoji style) is known it would be nice if this could be included in the HTML.

 

[otto]

Any news about this?

I think its no big trouble to add such a functionality so we doesnt have trouble with GSC.

 

[fionix]

Vote for this function to be in the next release please!