性能优化-js优化

js优化

---

当 HTML 解析器遇到一个 script 标记时，它会暂停构建 DOM，将控制权移交给 JavaScript 引擎；等 JavaScript 引擎运行完毕，浏览器会从中断的地方恢复 DOM 构建。
这也就是为什么我们需要将script tag放在页面的底部。
/React APP一般会如此使用。因为React需要将整个APP 渲染到一个DOM节点上，如果放置在DOM之上，会造成React找不到该渲染的节点，从而报错/
而我们一般不建议在render tree刚刚建立的时候，就使用JS去操作DOM，从而造成reflow，也就是说，希望JS不要成为render tree的一部分。这个时候，我们将<script> 放在页面靠下的部分就可以不阻塞页面的渲染。
如果你的<script>是从CDN获取资源，那么等待的过程也会造成一定的阻塞。
你可以将<script>加上 async，让它变为异步加载。
为了实现最佳性能，建议去除关键渲染路径中任何不必要的JavaScript