1、避免使用应用缓存
AppCache已被废弃，考虑使用serviceworker的
CacheAPI
。
、避免使用console.time()
如果您使用console.time()测量页面的性能，请考虑改用
UserTimingAPI
。其优势包括：
高分辨率时间戳。 可导出的计时数据。 与ChromeDevToolsTimeline相集成。在Timeline录制期间调用UserTiming函数performance.measure()时，DevTools自动将此测量结果添加到Timeline的结果中，如以下屏幕截图中的mycustommeasurement标签中所示。
3、避免使用Date.now()
如果使用Date.now()测量时间，请考虑改用performance.now()。performance.now()可提供较高的时间戳分辨率，并始终以恒定的速率增加，它不受系统时钟（可以调整或手动倾斜）的影响。
4、避免使用document.write()
对于网速较慢（如G、3G或较慢的WLAN）的用户，外部脚本通过document.write()动态注入会使页面内容的显示延迟数十秒。
5、避免使用mutationevents
以下突变事件会损害性能，在DOM事件规范中已弃用。
DOMAttrModified DOMAttributeNameChanged DOMCharacterDataModified DOMElementNameChanged DOMNodeInserted DOMNodeInsertedIntoDocument DOMNodeRemoved DOMNodeRemovedFromDocument DOMSubtreeModified
建议将每个mutationevents替换成
MutationObserver
6、避免使用旧版CSSFlexbox
年的旧Flexbox规范已弃用，其速度比最新的规范慢.3倍。请参阅
Flexbox布局并不慢
了解更多信息。
7、避免在页面加载时自动请求地理位置
页面在加载时自动请求用户位置会使用户不信任页面或感到困惑。应将此请求与用户的手势（如点按一个“FindStoresNearMe”按钮）进行关联，而不是在页面加载时自动请求用户的位置。
8、避免在页面加载时自动请求通知权限
如
怎样才算好的通知
中所述，好的通知需要做到及时、相关且精确。如果您的页面在加载时要求权限以发送通知，则这些通知可能与您的用户无关或者不是他们的精准需求。为提高用户体验，最好是向用户发送特定类型的通知，并在他们选择加入后显示权限请求。
9、避免显示宽高比不正确的图像
如果渲染的图像与其源文件中的宽高比不同，则呈现的图像可能看起来失真，产生不好的用户体验。建议：
避免将元素的宽度或高度设置为可变大小的容器的百分比。 避免设置不同于源图像尺寸的显式宽度或高度值。 考虑使用css-aspect-ratio或AspectRatioBoxes来帮助保留宽高比。 如果可能的话，在HTML中指定图片的宽度和高度是一个很好的做法，这样浏览器就可以为图片分配空间，这样可以防止页面在加载时跳过。在HTML中而不是CSS中指定宽度和高度是更好的做法，因为浏览器在解析CSS之前分配空间。实际上，如果您使用响应式图像，则此方法可能很困难，因为在知道视口尺寸之前无法指定宽度和高度。
10、避免使用具有已知安全漏洞的前端JavaScript库
入侵者具有自动的Web爬虫程序，可以对您的站点进行扫描以查找已知的安全漏洞。Web搜寻器检测到漏洞时，会向入侵者发出警报。从那里，入侵者只需要弄清楚如何利用站点上的漏洞。建议：停止使用Lighthouse标志的每个库。如果该库发布了解决该漏洞的较新版本，请升级到该版本，或考虑使用其他库。请参阅
Snyk的漏洞数据库
，以了解有关每个库的漏洞的更多信息。
11、打开外部链接使用rel="noopener"
当您的页面链接至使用target="_blank"的另一个页面时，新页面将与您的页面在同一个进程上运行。如果新页面正在执行开销极大的JavaScript，您的页面性能可能会受影响。此外，target="_blank"也是一个安全漏洞。新的页面可以通过window.opener访问您的窗口对象，并且它可以使用window.opener.location=newURL将您的页面导航至不同的网址。如需了解详细信息，请参阅
rel=noopener的性能优势
。建议：将rel="noopener"添加至Lighthouse在您的报告中识别的每个链接。一般情况下，当您在新窗口或标签中打开一个外部链接时，始终添加rel="noopener"。
ahref="