「这是我参与2022首次更文挑战的第7天，活动详情查看：2022首次更文挑战」
下面先来聊聊缓存
缓存分为两种：强缓存和协商缓存，根据响应的header内容来决定
强缓存和协商缓存获取资源形式都是从缓存取
但，强缓存是不发送请求到服务器，直接从缓存取，状态码是200（from cache）；
而协议缓存是发送请求到服务器，通过服务器来告知缓存是否可用，可用在从缓存取，状态码是304（not modified）
强缓存相关字段有 expires，cache-control。如果 cache-control与expires同时存在的话，cache-control的优先级高于expires
协商缓存相关字段有Last-Modified/If-Modified-Since，Etag/If-None-Match
下面在来聊聊动画
动画包括JS动画和css3动画，我们来聊聊他们之间的不同吧
渲染线程分为main thread 和compositor thread，如果css动画只改变 transform和 opacity，这时整个CSS动画在compositor trhead完成；而 JS 动画则会在 main thread执行，然后出发compositor thread 进行下一步操作。特别注意的是如果改变transform 和opacity是不会layout或者paint
两者主要区别：
- 功能涵盖面，
JS比CSS大 - 实现难度不一，
CSS3比JS更加简单 - 对帧速表现不好的低版本浏览器，
css3可以做到自然降级 css3动画有天然事件支持css3有兼容性问题
另外我们聊聊link标签和@import 标签
我们都知道，外部引入 CSS 有2种方式，link标签和@import
link标签和@import的区别：
link属于html标签，而@import是css提供的；- 页面被加载时，
link会同时被加载，而@import引用的 css 会等到页面加载结束后加载； link方式样式的权重高于@import的；link是html标签，因此没有兼容性，而@import只有IE5以上才能识别。
比较建议使用link标签，慎用@import方式。
这样可以避免考虑@import的语法规则和注意事项，避免产生资源文件下载顺序混乱和http请求过多的烦恼
