性能优化--- iframe阻塞页面渲染的问题，如何优化？

问题描述：

iframe 阻塞问题会阻塞页面的加载，因为 iframe 中的内容需要在父页面加载完成后才能被加载和渲染。这意味着在 iframe 内容完全加载和渲染之前，用户无法看到页面的其他部分。这种行为不仅降低了用户体验，因为用户会看到页面的一部分空白，而且还会影响页面的 SEO（搜索引擎优化），因为搜索引擎可能在等待所有内容加载完成后才评估页面内容的相关性。

阻塞原因：

1. 浏览器的渲染机制：浏览器解析 HTML 文档并构建 DOM 树的过程是逐步进行的。当遇到 iframe 标签时，浏览器会停止当前文档的解析，转而加载 iframe 指定的 URL。只有等到 iframe 的内容完全加载完毕后，浏览器才会继续解析父页面的剩余内容。

2. 资源下载顺序：iframe 中的资源（如图片、脚本等）需要按照它们在文档中出现的顺序下载。如果 iframe 中的内容在父页面的其他内容之前下载完成，这将导致父页面的其他内容被延迟显示，从而阻塞页面的加载。

3. 同步加载：默认情况下，iframe 的内容是同步加载的，这意味着它们会阻塞父页面的渲染。直到 iframe 的内容完全加载，父页面的渲染才能继续。

4. 性能考虑：iframe 中的内容可能会占用大量的网络带宽和 CPU 资源。如果不加以控制，大量 iframe<