1

When Reactjs Components are rendered at first time, imgs flicker.
How can I fix it?

<Example Code>

import AccountProfile from '../../img/AccountProfile.png';
...

return(
   <div className='MyAccount'>
      <img className='MyAccount_Img' src={AccountProfile}/> // <- img flicker when first rendered.
   </div>
);

P.S Edit: How to preload images in React.js? I found the solution in here.

JAE L
  • 11
  • 4
  • flicker mean the image comes up and goes and comes back? how many times? did you check the network requests to see what is going on? – Akber Iqbal May 11 '22 at 03:04
  • @AkberIqbal Thanks for your helping. I check network requests, and the network sends requests to get images. This makes images flickering. Also, I found that I can preload images before the images are actually used. However, I checked that the network still sends requests again to get the preloaded images. I struggle with this problem. – JAE L May 12 '22 at 10:09
  • @AkberIqbal I found the solution. https://stackoverflow.com/questions/42615556/how-to-preload-images-in-react-js – JAE L May 12 '22 at 10:25

0 Answers0