CODEWITHSUNDEEP
html
Robins Gupta
Robins Gupta

Reputation: 3153

Why does image on a webpage disappear for few seconds when re-opening it after a while

I am designing a simple web page which contains several images.

But when I am opening that webpage in my browser, minimizing the browser and then reopening it after few minutes, the image disappears for few milliseconds

It doesn't occurs in popular website like Facebook or Google but the same problem persists in some less famous websites. I am not able to figure out what's actually happening..

Upvotes: 2

Views: 2223

Answers (1)

Joseph
Joseph

Reputation: 119847

Usually caused by very huge images resized using HTML/CSS. Another way to look at it, the images used was not resized to the size it was intended for the display. It takes time for the browser to resize and render them on the page, especially the large ones.

Also, a machine running low on memory will often offload resources to the swap. When windows are not in focus or are minimized, some browsers move resources off the memory and into the swap. As far as I know, Firefox does this and is configurable in the about:config. This allows the browser to save memory for other operations to use.

When the window regains focus, the browser picks them up from the swap (which generally is a slow operation), loads them back on the memory and renders them. This on-and-off-the-memory operation will take time thus could be what you are experiencing.

That's why when using images on the web:

  • resize the actual images to the size you need them to be
  • optimize images by using compression. JPGs and PNGs are good at this
  • Don't over use images
  • spriting, to avoid multiple HTTP requests

Upvotes: 2

Related Questions