性能优化清单：（完整了解）
yohoo：https://github.com/JohnsenZhou/Front-End-Performance-Checklist
google：https://developers.google.cn/web/fundamentals/performance/why-performance-matters/
可以看下自己的网站或页面是否达到要求
http缓存：
- http1.0：
一、expires,设置缓存有效期 // （不用去服务器监测，直接在本地取）
问题：如果系统时间不对，则缓存会出错（如：当前时间是2019-9-9，系统时间是2020-9-9，则缓存永远都会过期）
二、last-modified,设置对象的最后修改时间 // （需要去服务器监测）
带上last-modified去服务区check一下有没有过期，如果返回304，就会直接从缓存里面返回，否则会返回一个实际的文件
问题：文件被修改但内容没有变。因为last-modified的问题，导致了E-tag出现
- http1.1
一、1.max-age=num(s)，设置最大缓存时间 // （不用去服务器监测，直接在本地取）
2.public，缓存能被多用户共享
3.private，缓存不能再用户间共享
4.no-cache，不会被缓存
5.no-store，不能被存储
二、E-tag，可能在同一秒保存两次，也可能在服务器上文件修改时间不一致 // （需要去服务器监测）
max-age + Last Modified + Etag：如果支持Etag，会优先使用Etag作为验证的标准
让我们去设计一个资源缓存方案，应当怎么做？
1.HTML （no-cache）
2.CSS、JavaScript （MD5/timestamp/version + 长缓存）
3.Image （随机名字[uid 唯一的名字] + 长缓存
本地存储：
- Cookies：存储数据量优先，并且每次都会带到服务器，占用带宽
一般不推荐在cdn上带cookie，html文件与资源文件要分域
- localstorage：有大小限制，数据不安全；
例：百度把所有的js和css都放在localstorage中以此来提速
把多个数据存在一个key好？还是分开多个key存储比较好？
存多个key读写效率更快。
localstorage存爆了应该怎么处理？
无论是get还是set都需要用try catch包裹，不然可能会出错
怎么解决数据需要踢出，用什么方式踢出？
在命名的时候需要分级，分别代表数据的重要程度，先将重要程度低的数据踢出
- sessionStorage：很少使用，会话关闭就没有了
- IndexDB：很少使用
IndexDB是异步的，有可能页面都完全返回了，异步还没完成；IndexDB需要先初始化数据库
- App Cache：大坑货，不要用
1.可能会缓存错误页面，设置缓存运营商的劫持广告，
2.更新中有一个文件失败了，就会全部退回上一个版本，
3.由于是Lazy更新，如果后台接口有break change将会是大麻烦
4.manifest文件 (一定要设置no-cache) 也有可能不小心被缓存了
- Service Worker:App Cache太失败，以至于W3C终于明白用户需要更细致的缓存控制
Hybrid App:
在app中提供一个webview，在里面直接写代码，可以通过js调一些native使用的api，如图片上传能力、原生接口等。
离线包技术：可以看成是私有service worker。
Weex：
尽量不要用react native和weex
Weex，rn（react native）性能好的原因（如何解决性能问题）：来自于被删减的浏览器渲染实现。
例：在weex和rn中，css只能使用flex-box，其他如border-box不能被使用
weex和rn解决的问题：1、可以让前端写native；2、用户可以更容易调用原生组件；
不适合在高交互场景使用，所以在大量表单之类的场景千万不要使用
了解flutter
AMP(google)：
类似：MIP(百度)，抄AMP
AMP是谷歌推荐的有利于它搜索引擎做优化的网页的标准，组件非常受控。如电商网站等