前言

我们需要遍历.lyad的元素,并将其className中的lyad删掉。

![]C4V[7X~JQIHR36YZ`MV7.png]1# preload简介

一种资源预加载的方式。用于提高性能，方便开发人员控制资源加载。

preload 指示浏览器预先请求当前页面接下来会需要用到的资源。

在chrome中，采用 preload 预加载资源后，后续没有在对资源进行请求(3s)，控制台会提示说是否有必要预加载该资源。

前言

前端优化有个原则，叫资源懒加载。

对于某些js资源，我们在页面load前并不需要用到，加载反而会影响到首屏速度。

把这些js放到 load 后进行加载，我们称之为js异步加载。

介绍

以下参考了MDN,并添加了一些细节和自己的测试结论

<img/>的属性，设置srcset之后不同屏幕密度加载不同图片。

其值为：以逗号分隔的一个或多个字符串列表表明不同User Agent可能设置的图像资源。

每一个字符串由以下组成：

1. 一个图像的 URL。
2. 可选的描述符，空格后跟以下的其一：
   • 一个宽度(w)描述符，这是一个正整数，后面紧跟 'w' 符号。该整数宽度=sizes属性给出的资源（source）大小*像素密度。该值需配合sizes使用。
   • 一个像素密度描述符，这是一个正浮点数，后面紧跟 'x' 符号。该值其实指的就是dpr。若像素密度描述符直接命中的话，就不考虑sizes和w描述符了，但是建议一般所有字符串仅用其中一个 如果没有指定描述符，那它会被指定为默认的 1x。

内容

1.尽量减少HTTP请求数

1. 资源合并
2. 小图片base64编码
3. 多图合并为单图
4. CSS Sprites，通过background-image和background-position属性来定位要显示的部分

2. 减少DNS查找

组件分散到2-4个主机名，这是同时减少DNS查找和允许高并发下载的折中方案

3. 避免重定向

HTTP 重定向是一项用于将客户端重定向到设备专用网址的常用技术。

但采用重定向会增加延迟。

若必须重定向的话，请使用HTTP重定向（响应体为空）并用301(永久转移)或302（暂时转移）状态码。（两者区别在于302会被url拦截，具体百度

因为系统会根据 HTTP 请求标头中的用户代理来执行重定向。 例子：

HTTP/1.1 301 Moved Permanently
Location: http://example.com/newuri
Content-Type: text/html

若难以实现HTTP重定向，则用js再去做。该做法多了文档下载，js解析的过程。

注意1：有一种常见的极其浪费资源的重定向，就是URL尾部缺少一个斜线的时候。

例如，跳转到http://astrology.yahoo.com/astrology会返回一个重定向到http://astrology.yahoo.com/astrology/的301响应（注意添在尾部的斜线）。

在Apache中可以用Alias，mod_rewrite或者DirectorySlash指令来取消不必要的重定向。

注意2：进行双向重定向与单向重定向

将访问桌面版网页的移动用户重定向到对应的移动版网页 -- “单向”重定向

在移动用户以及桌面设备用户分别访问桌面版网站和移动网站上的网页时，对他们进行重定向 --“双向”重定向

https://developers.google.com/search/mobile-sites/mobile-seo/separate-urls#automatic-redirection