JS 加载与执行问题

[xxleyi]

JS 在浏览器中可以控制页面元素的增删与各种动态行为，这自然会带来一个问题：当 JS 的使用越来越多时，JS 自身的加载与执行会直接影响页面响应与渲染表现，造成肉眼可见的区别。

这就要求开发者使用浏览器提供的某些特性依据自身页面与 JS 的情况，合理控制 JS 加载与执行的时机。

下载问题：

• 主流异步加载（重点掌握）：
  • Script DOM Element (以及是否考虑在 onload 事件中进行)
• 非主流异步加载：
  • XHR eval
  • XHR injection
  • script in iFrame
  • document.write script tag
  • setTimeout 与其它方法组合
• 标准：
  • 基本成为历史，但兼容 IE 时，可以考虑：defer
  • 当前通行标准，未来可期：async

执行问题：

• 延迟加载：
  • 异步加载为非 JS 脚本，但实际内容为 JS，后续按需执行

相关资源：

• javascript - load scripts asynchronously - Stack Overflow

以上是 JS 加载与执行问题涉及到的一些面，接下来慢慢消化，同时注意完善一些潜在的核心点：

• 浏览器的哪些特性导致当前局面，哪些是必然，哪些是历史错误 DEEP WHY
• 衍生出哪些符合行业标准的系统化解决方案，直接或间接 HOW
• 面对老项目时，如何慎重优化 HOW ON OLD
• 面对新项目时，如何综合考虑各种因素，来提高页面响应与渲染的用户友好性 HOW ON NEW