加载多个iframe 窗口时间超过四秒，怎么优化

[heroboyluck]

引用

传统的Jquery+模式开发，公用的页面使用iframe嵌入到页面中；

这个公用页面可能被调用十多次，也就是嵌入了十多个iframe，导致在完全加载完成需要四秒多，页面多处于空白。

引用

当前的解决方案是：先加载了第一个页面，1S加载完毕，之后所有的页面延时加载，这样只能治标，让用户第一眼看了东西，但是立即点击后面的标签，仍然在加载中。

有没有优化方案，提升加载速度。

感谢各位大佬!

[heroboyluck]

引用 1 楼 sxty0220 的回复:

先把 iframe 的 src 设置成空需要调用 iframe 对应的通过js或者后台程序 再赋值src

测试了主要的并不是iframe加载的问题，测试时设置iframe的src内容是一个空白页面index.html；循环加载20多个，加载速度80ms；而实际不用iframe加入dom结构`<div></div>`20多次时间在60ms；

最后性能分析，在于iframe完之后需要动态初始化页面的一些模块内容，执行好多JS脚本。导致卡顿；由于JS操作DOM导致了浏览器执行重绘，页面布局消耗过大。

[heroboyluck]

引用 2 楼 雨中客888 的回复:

我之前有页面嵌入iframe 20多个，用了懒加载，效果可以

你这个和延时加载没什么区别，先加载一部分，用户可以看到，再由某个因素触发再加载其他的。

[雨中客888]

引用 4 楼 heroboyluck 的回复:

[quote=引用 2 楼 雨中客888 的回复:] 我之前有页面嵌入iframe 20多个，用了懒加载，效果可以

你这个和延时加载没什么区别，先加载一部分，用户可以看到，再由某个因素触发再加载其他的。[/quote] 对 这个是可以解决iframe 一次加载多造成的卡顿，你现在不是这个问题了，看你写的是页面渲染了

[sxty0220]

先把 iframe 的 src 设置成空需要调用 iframe 对应的通过js或者后台程序 再赋值src

[雨中客888]

我之前有页面嵌入iframe 20多个，用了懒加载，效果可以