I’m working with JavaScript and React, using the VKUI component library. I’ve encountered an issue where the images inside the Avatar component flicker on each re-render of the component. Here’s the custom component I’m using:
const Profile = ({ bingo }) => {
return (<Div>
<RichCell
disabled
before={<Avatar
size={48}
src={bingo.cr_ava}
/>}
caption={bingo.cr_name}
after={bingo.isHidden && 'Visibility limited' }
afterCaption={bingo.isHidden && 'Hidden from feed' }
>
{bingo.title}
</RichCell>
</Div>)
}
This component is used in each item of a certain feed. The user’s avatar flickers.
I’ve tried to use a simple image and refrained from using the react-window library to reduce the number of re-renders. The flickering has decreased slightly, but it hasn’t disappeared. Any ideas on why this is happening and how to fix it?