CODEWITHSUNDEEP
javascripthtml
Srikanth Rayabhagi
Srikanth Rayabhagi

Reputation: 1443

Does dimensions of GIF affect performance of web page?

Ignoring the size of each GIF, here are 2 ways in which I am trying to load GIFs

  1. Load the GIF's by stretching/compresssing to default size of 400px x 400px
  2. Load the same GIFs by tweaking the default size to 100px x 100px

Will these two cases affect the performance due to rendering, if so how much performance gain can we expect by decreasing the size of the images?

Note: These are the dimensions of the elements and I am not tweaking the actual size of the GIFs

Upvotes: 3

Views: 949

Answers (1)

Pranav 웃
Pranav 웃

Reputation: 8477

Resizing images on the browser does affect performance when it comes to rendering.

From tips for best performance,

Don't use a bigger image than you need just because you can set the width and height in HTML. If you need then your image (mycat.jpg) should be 100x100px rather than a scaled down 500x500px image.

About how much it affects, it depends on how much resize you apply, and how many images you resize on one page.

Ah, found the link I was trying to remember :

Long image decoding, unnecessary image resizing, heavy animation and data processing can all lead to dropped frames, which reduces the frame rate, resulting in janky pages

Upvotes: 3

Related Questions