前端杂谈 · Web

前端性能优化 不要在HTML中缩放图片

小编 · 5月1日 · 2020年
前端性能优化 不要在HTML中缩放图片

不要使用 <img> 的 width、height 缩放图片,如果用到小图片,就使用相应大小的图片。如果需要

<img width="100" height="100" src="mycat.jpg" alt="My Cat" />

那么图片本身(mycat.jpg)应该是 100x100px 的,而不是去缩小 500x500px 的图片。

很多 CMS 和 CDN 都提供图片裁切功能。

补充:设置图片的宽和高,以免浏览器按照「猜」的宽高给图片保留的区域和实际宽高差异,产生重绘。