Hello,
It all depends on the context.
Are these images displayed when an element is hovered? (using a sprite would do the job)
Are they displayed regularly and randomly?
Are they heavy?
Preloading can be useful, but you need to bear in mind that you will be preloading all the images, and therefore consuming resources.
What's more, there are several ways of preloading images, so please take a look at this article.
I don't know if your request concerns the images displayed in the background of your header, but you can start by converting them to webp and compressing them with a tool like TinyPNG.
Original jpg (37.8 Ko):
![Image]()
Convert to webp (28.4 Ko):
![Image]()
Compressed webp (4.5 Ko):
The weight has become ridiculous and preloading would have no impact, or really imperceptible.
![Image]()
It all depends on the context.
Are these images displayed when an element is hovered? (using a sprite would do the job)
Are they displayed regularly and randomly?
Are they heavy?
Preloading can be useful, but you need to bear in mind that you will be preloading all the images, and therefore consuming resources.
What's more, there are several ways of preloading images, so please take a look at this article.
I don't know if your request concerns the images displayed in the background of your header, but you can start by converting them to webp and compressing them with a tool like TinyPNG.
Original jpg (37.8 Ko):

Convert to webp (28.4 Ko):

Compressed webp (4.5 Ko):
The weight has become ridiculous and preloading would have no impact, or really imperceptible.

Statistics: Posted by cabot — Sun Feb 16, 2025 9:42 am