iframe是什么？有什么缺点？

好问题 👍
我给你把 iframe 的概念 + 常见缺点 梳理一下，方便你理解和在项目中判断是否要用。

🔹 iframe 是什么？

<iframe>（Inline Frame）是 HTML 内联框架 标签，用来在当前页面中 嵌入另一个独立的 HTML 页面。
比如：

<iframe src="https://example.com" width="600" height="400"></iframe>

效果就是在你的网页里开了一个“小窗口”，展示另一个网页。

👉 常见用途：

• 引入第三方内容（广告、地图、视频等）
• 在后台管理系统里嵌套子系统
• 跨域加载独立页面（比如统计报表）

🔹 iframe 的缺点

虽然 iframe 有一定便利性，但缺点也比较多，所以现代开发里一般 能不用就不用：

1. 性能问题

   • 每个 iframe 都会加载一个独立的页面（包括 HTML、CSS、JS），相当于开了一个“新浏览器窗口”，消耗更多内存和资源。
   • 如果嵌套太多，页面渲染会变慢。

2. SEO 不友好

   • 搜索引擎爬虫对 iframe 内的内容识别较差，内容可能不会被收录。
   • 如果重要内容放在 iframe 里，会影响网站排名。

3. 交互受限（用户体验差）

   • iframe 内的页面和外部页面相对独立，样式和脚本不好统一。
   • 滚动条、缩放、响应式布局常常不好控制。

4. 安全风险

   • 如果引入第三方页面，容易被嵌入恶意代码（比如 XSS 攻击）。
   • 有些网站会用 X-Frame-Options 禁止被嵌入，以防止“点击劫持”。

5. 跨域限制

   • 如果 iframe 引入的是不同域名的页面，父页面和子页面的 JS 无法直接交互（同源策略限制）。

🔹 总结

✅ iframe 的优势是：快速引入独立页面、隔离作用域、跨系统集成方便。
❌ 缺点是：性能差、SEO差、安全风险、样式交互不便。

所以在实际项目里：

• 如果只是临时引入外部内容（广告、第三方地图/视频），iframe 还能用。
• 如果是内部系统集成，现在更推荐用 微前端框架（如 qiankun、single-spa） 或 组件化方案 替代。