The replaced emojis take up no space when not yet loaded. So, when they are loaded and rendered, the content jumps.
The improvement here would be to
- reserve the needed screen estate in advance
and/or
- use the preinstalled emojis of the OS as a fallback-placeholder (similar to
font-display: swap)
to reduce/eliminate cumulative layout shift coming from react-openmoji
The replaced emojis take up no space when not yet loaded. So, when they are loaded and rendered, the content jumps.
The improvement here would be to
and/or
font-display: swap)to reduce/eliminate cumulative layout shift coming from
react-openmoji