随着移动互联网的发展，许多应用在不断的产生，要说现在更新快、开放功能多的应用，只能是微信小程序了。微信小程序由于刚推出来时开放的能力十分有限，所以在功能展示上会让普通用户感觉和H5一样，并没有什么特别之处，导致了部分人把两者混为一谈。实际上，小程序和H5是两种不同的东西。

　　简单来说，小程序是一种应用，运行的环境是微信（App）；H5是一种技术，依附的外壳是是浏览器。

　　从「前端开发」的视角来看，微信小程序和H5也存在着多方面的不同。概括来说有以下四个方面的区别。

　　一、运行环境的不同

　　H5的运行环境是浏览器，包括webview，而微信小程序的运行环境并非完整的浏览器，因为小程序的开发过程中只用到一部分H5技术。

　　小程序的运行环境是微信开发团队基于浏览器内核完全重构的一个内置解析器，针对性做了优化，配合自己定义的开发语言标准，提升了小程序的性能。

　　官方文档表明脚本内无法使用浏览器中常用的window对象和document对象（基于这一点，像zepto/jquery这种操作dom的库就被完全抛弃了）。

　　不过微信给开发者提供了开发工具，内置了编程、调试、开发环境以及发布，开发者只需按照官方文档进行开发，就能保证小程序在微信内稳定运行。

　　二、开发成本不同

　　H5的开发，涉及开发工具（vscode、Atom等）、前端框架（Angular、react等）、模块管理工具（Webpack、Browserify等）、任务管理工具（Grunt、Gulp等），还有UI库选择、接口调用工具（ajax、FetchApi等）、浏览器兼容性等等。

　　尽管这些工具可定制化非常高，大部分开发者也有自己的配置模板，但对于项目中各种外部库的版本迭代、版本升级，这些成本加在一起那就是个不小数目了。

　　而开发一个微信小程序，由于微信团队提供了开发者工具，并且规范了开发标准，则简单得多。前端常见的HTML、CSS变成了微信自定义的WXML、WXSS，WXML，官方文档中都有明确的使用介绍，开发者按照说明专注写程序就可以了。

　　需要调用后端接口时，调用发起请求API；需要上传下载时，调用上传下载API；需要数据缓存时，调用本地存储API；引入地图、使用罗盘、调用支付、调用扫码等等功能都可以直接使用；UI库方面，框架带有自家weui库加成。

　　并且在使用这些API时，不用考虑浏览器兼容性，不用担心出现BUG，显而易见微信小程序的开发成本相对低很多。

　　三、技术兼容不同

　　H5的开发，涉及开发工具、前端框架、模块管理工具、任务管理工具，还有UI库选择、接口调用工具、浏览器兼容性等等。尽管这些工具可定制化非常高，大部分开发者也有自己的配置模板。但对于项目中各种外部库的版本迭代、版本升级，系统兼容等等，这些成本加在一起那就是个不小数目了。

　　开发一个微信小程序，由微信团队提供了开发者工具，并且规范了开发标准，相比H5简单得多。

　　前端常见的HTML、CSS变成了微信自定义的WXML、WXSS，WXML，官方文档中都有明确的使用介绍，开发者按照说明专注写程序就可以了。并且开发过程中，不用考虑浏览器兼容性，不用担心出现浏览器模具框架造成的BUG，可见微信小程序的开发成本相对低很多，也容易很多。

　　四、运行流畅度不同

　　在运行流畅度方面，无论对于用户还是开发者，都可以直观体验出两者的差异。这也是普通大众最容易区分小程序与H5的一点。

　　打开H5，实际上是打开一个网页，而网页需要在浏览器中渲染。所以加载这一过程，会给人明显的「卡顿」感觉，面对复杂的业务逻辑或者丰富的页面交互时尤为明显。

　　而微信小程序，它的代码直接在微信上运行，省去了通过浏览器渲染的步骤，因此，在微信中使用小程序，才会比H5流畅很多。

　　除了首次打开需要几秒的加载时间外，小程序各个页面的切换、跳转等体验已经媲美原生App，有着同样的柔丝般顺滑的效果。

　　概括来说，小程序相对H5有着开发成本低、功能更丰富、使用体验更佳的优点，目前的微信小程序可以实现网页端跳转，为营销推广提供想象空间，微信小程序的功能和经验将会越来越完善，将是一个好的发展机会。