浏览器|广州蓝景分享—HTML+CSS功能，让页面加载速度提高数倍( 二 ) 广州市

a）可用于针对不同的media条件裁剪或修改图片（例如，在较小的显示器上加载大图片的缩略版本）。
b）在不支持webp格式的情况下提供替代图片格式。
c）通过为查看器加载最合适的图片来节省带宽并加快页面加载时间。
如果为高DPI显示器提供更高分辨率的图像版本，请改用<img>元素上的srcset 。这允许浏览器在数据保存模式下选择低分辨率版本，并且你不必编写显式media条件。

3. 渲染图像
由于图像是异步加载的，并在第一次绘制后继续加载，如果在加载之前未定义其尺寸，则可能会导致重排到页面内容。例如，文本因加载图像而被推下页面。因此，设置width和高height属性至关重要，以便浏览器可以在布局中为它们保留空间。
对于任何background-image ，设置background-color值很重要，以便在下载图像之前，覆盖的内容保持可读。
4. 压缩HTML和CSS文件
压缩指的是从代码中删除所有不必要的字符以减小尺寸。删除的是不需要的空格字符，如空格、换行符、制表符等以及注释。
【浏览器|广州蓝景分享—HTML+CSS功能，让页面加载速度提高数倍】使用压缩工具，如CodeBeautify ， CSS Minifier等来缩小HTML和CSS文件。有助于为网站提供更快的页面加载速度。