无阻塞加载脚本是一种优化网页性能的技术，旨在减少页面加载时间，提高用户体验。这是因为传统的`<script>`标签会阻塞浏览器的解析过程，导致页面的其他资源下载和渲染暂停，直到脚本下载并执行完毕。为了克服这个问题，开发者可以采用以下几种策略：
1. **内嵌JavaScript（Inline JavaScript）**：将JavaScript代码直接写入HTML文件中，这样可以避免额外的HTTP请求，但在大型应用中可能会增加页面大小，影响加载速度。
2. **异步加载（Asynchronous Loading）**：
- **XHR Eval**：使用XMLHttpRequest请求脚本内容，然后通过`eval()`函数执行。这种方法允许异步加载，但受同源策略限制，只能加载同一域下的脚本。
- **XHR Injection**：与XHR Eval类似，但通过创建新的`<script>`标签插入到DOM中执行，同样需要同源策略。
3. **Script in Iframe**：将脚本放在一个独立的HTML文件中，通过`<iframe>`加载。这种方法允许脚本在单独的上下文中运行，但iframe本身会增加额外的开销，并且存在跨域安全问题。
4. **Script DOM Element**：动态创建`<script>`元素并设置`src`属性，然后将其添加到DOM中。这种方式支持所有现代浏览器，且不受同源策略限制，但无法保证脚本执行顺序。
5. **Script Defer属性**：在`<script>`标签上添加`defer`属性，使得脚本在文档解析完成后但在`DOMContentLoaded`事件触发前执行。此方法仅在IE和部分现代浏览器中有效，可以保证执行顺序。
6. **document.write Script Tag**：使用`document.write`插入`<script>`标签，IE浏览器会并行加载这些脚本。但这种方法在其他浏览器中并不并行加载，且不推荐使用，因为它破坏了文档流。
在选择无阻塞加载脚本的方法时，需要考虑以下几个因素：
- **并行下载**：是否支持同时下载多个脚本以加速加载。
- **跨域支持**：是否可以加载不同源的脚本。
- **存在Script标签**：是否需要在HTML中预定义`<script>`标签。
- **忙碌指示**：是否会影响浏览器的加载指示器显示。
- **顺序保证**：是否能确保脚本的执行顺序。
- **大小（Bytes）**：不同方法对脚本大小的处理差异。
在多数情况下，使用Script DOM Element方法是个平衡的选择，它在所有浏览器中都有效，没有跨域限制，实现简单。然而，如果需要保证脚本执行顺序，可能需要结合其他策略，如使用异步队列等技术。优化脚本加载是一个涉及浏览器兼容性、性能和功能需求的综合考虑过程。
