浏览器渲染过程

• 根据HTML构建HTML树(DOM)
• 根据CSS构建css树(cssDOM)
• 将两棵树合并成一颗渲染树(render tree)
• layout布局
• paint绘制
• composite合成 (根据层叠关系展示画面)

更新样式的渲染方式

如果修改了布局（lauoyt）元素，浏览器将检查所有其他元素，进行重新布局

如果修改背景图、文字颜色或者阴影等，浏览器会跳过布局，直接执行绘制

如果不改变布局也不绘制属性的话，比如动画属性，浏览器会直接执行合成

css元素渲染属性表

跳转地址

google优化