开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第28天，点击查看活动详情
一、ifram 有哪些优缺点
iframe 的优点：
1.iframe 能够原封不动的把嵌入的网页展现出来。
2.如果有多个网页引用 iframe，那么只需要修改 iframe 的内容，就可以实现调用每一个页面的更改，方便快捷。
3.网页如果为了统一风格，头部和版本都是一样的，就可以写成一个页面，用 iframe 嵌套，可以增加代码的可重用。
4.如果遇到加载缓慢的第三方内容，如图标或广告，这些问题可以由 iframe 来解决。
5.iframe 会堵塞主页面的 Onload 事件。
6.iframe 和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。
iframe 的缺点：
1）iframe 会阻塞主页面的 Onload 事件；
2）iframe 和主页面共享链接池，而浏览器对相同城的链接有限制，所以会影响页面的并行加载；
3）使用 iframe 之前需要考虑这两个缺点，如果需要使用 iframe，最好是通过 JavaScript；
4）动态给 iframe 添加 src 属性值，这样可以可以绕开以上两个问题
5）不利于 seo
6）代码复杂，无法一下被搜索引擎索引到
7）iframe 框架页面会增加服务器的 http 请求，对于大型网站不可取。
8）很多的移动设备无法完全显示框架，设备兼容性差
二、canvas
Canvas 元素是 HTML5 的一部分，允许脚本语言动态渲染位图像。Canvas 由一个可绘制地区HTML 代码中的属性定义决定高度和宽度。JavaScript 代码可以访问该地区，通过一套完整的绘图功能类似于其他通用二维的 API，从而生成动态的图形。
Canvas 能应对以下需求：
1、游戏：游戏在 HTML5 领域具有举足轻重的地位。HTML5 在基于 Web 的图像显示方面比Flash 更加立体、更加精巧，Ohad 认为运用 Canvas 制作的图像能够令 HTML5 游戏在流畅度和跨平台方面发挥更大的潜力。
2、图表制作：现在一些开发者使用 HTML/CSS 完成图标制作，但完全可以用 Canvas 来实现。当然，使用 SVG（可缩放矢量图形）来完成图表制作也是非常好的方法。(例如：echarts.js heightchart.js 都是基于 canvas 来绘图!)
