- 首页 > it技术 > >
// 一、图片
1，修饰类的图片有css代替
2，根据具体屏幕，用小图代替
3，小图使用base64格式
4，雪碧图（多个图整合在一起）
5，webP有更好的压缩算法（但兼容性差一点）
6，小图用png或者svg（SVG 使用 XML 格式定义图像。可缩放矢量图），大图用jpg// 二、域名的预解析
dns-prefetch?作用简单说明就是当你浏览网页时，
浏览器会加载网页时对网页中的域名进行解析缓存，
这样在你单击当前网页链接无需DNS解析，减少浏览者等待时间// 三、预加载
不在首页用到，但是后面极大可能会用，而且很大，就提前去加载。不会阻塞onload事件// 四、预渲染
在后台提前渲染（后面大概率会打开。不然会浪费）// 五、懒执行
首屏优化。耗时逻辑并不需要在首屏就使用的，就可以使用懒执行。
通过事件或定时器触发// 六、懒加载
懒加载就是将不关键的资源延后加载。
比如图片，先放一个src占位。对应的图片链接放在自定义区域，只有执行到该区域后，才替换属性-src。video也可以这样，显示区域才去加载// 七、CDN// 三、节流。（scroll的时候不希望一直发请求。而是间隔或者停下的时候发）
let now = +new Date()
// 将当前时间和上一次执行函数时间对比
// 如果差值大于设置的等待时间就执行函数
if (now - lastTime > wait) {
lastTime = now
func// 四、防抖
return function(...args) {
if (timer) clearTimeout(timer)
timer = setTimeout(() => {
func.apply(this, args)
}, wait)
推荐阅读
