# 性能
# 为什么说 position absolute 跟 float 影响性能？
- 二者脱离文档流，会引起页面重绘
- 二者相比，position 的代价比较小，因为他的位置变化不用考虑对别的元素的影响，但是 float 会影响
- 另外，
position:absolute和 float 会隐式地改变 diplay 的属性为inline-block，就算我们显示地设置display:inline或者display:block，也仍然无效
# JS 资源和 CSS 资源的放置位置
CSS 放在 head 可以先加载样式，页面渲染时首先是根据DOM结构生成一个DOM树然后加上CSS样式生成一个渲染树，如果CSS放在后面可能页面会出现闪跳的感觉。
JS 放在后面，防止堵塞后续加载，JS 可以加上 defer 或者async 标签，前者会等待文档渲染完毕，在 DomContentLoaded 之前加载；后者是异步下载，下载完成即刻加载。
# CSS 常用性能优化方案
参考文章：掘金-CSS 性能优化还有哪些方法？-前端小智 (opens new window)
使用简写，如
margin:1px 2px不用的 css 删除，比如
display:inline后不应该再使用 width、height、margin、padding 以及 float压缩 css
关键的样式内联在
<style>中，因为加载外部样式需要时间能用 css 的不用图片
颜色使用缩写：#ffffff => #fff
不用的单位或者数字删除 0.2px => .2px ; 0px => 0
精灵图
分析表明，一些标签比其他标签更昂贵。以下这些解析会影响性能—如果在没有必要的情况，尽量不要使用它们。 border-radius box-shadow transform filter :nth-child position: fixed;
更少的选择器层级