The opening is super slow, how to improve the opening speed_html/css_WEB-ITnose

My code works fine when stored locally, but it is very slow to open online. There are more than 300 pictures in total.








< ;a href="003.jpg">

..................

Reply to discussion (solution)

Optimize images and use image delayed loading.

The original poster searched for ImagesLazyLoad

If the jpg 200 width image is larger than 100k, it needs to be optimized in PS. The specific method is to import it directly, then ctrl shift alt s, save as jpg, The compression ratio is 60-70%.
If the image is less than 100k, it is recommended to use png-8 mode.
If it is less than 4k, gif, png-8 does not matter.

What did the poster do? He used more than 300 pictures

With so many HTTP connections, there is no way it would be slow


1, so if If your picture does not need to be used all at once, you can use delayed loading (script creation img ), or load it when you want to use it.
2. As mentioned above, the size of the picture itself is also an aspect. , reduce the accuracy if it is enough,
3. If you use various small pictures for background, you can consider using css image splitter technology, which is to combine each small picture into one large picture, and then carefully set the elements The width, height, and (background) position are used to share images

Why put so many images? It’s just slow. . It’s weird if it’s not slow