隨著移動互聯(lián)網(wǎng)的發(fā)展，許多應(yīng)用在不斷的產(chǎn)生，要說現(xiàn)在更新快、開放功能多的應(yīng)用，只能是微信小程序了。微信小程序由于剛推出來時開放的能力十分有限，所以在功能展示上會讓普通用戶感覺和H5一樣，并沒有什么特別之處，導(dǎo)致了部分人把兩者混為一談。實際上，小程序和H5是兩種不同的東西。

　　簡單來說，小程序是一種應(yīng)用，運行的環(huán)境是微信（App）；H5是一種技術(shù)，依附的外殼是是瀏覽器。

　　從「前端開發(fā)」的視角來看，微信小程序和H5也存在著多方面的不同。概括來說有以下四個方面的區(qū)別。

　　一、運行環(huán)境的不同

　　H5的運行環(huán)境是瀏覽器，包括webview，而微信小程序的運行環(huán)境并非完整的瀏覽器，因為小程序的開發(fā)過程中只用到一部分H5技術(shù)。

　　小程序的運行環(huán)境是微信開發(fā)團隊基于瀏覽器內(nèi)核完全重構(gòu)的一個內(nèi)置解析器，針對性做了優(yōu)化，配合自己定義的開發(fā)語言標準，提升了小程序的性能。

　　官方文檔表明腳本內(nèi)無法使用瀏覽器中常用的window對象和document對象（基于這一點，像zepto/jquery這種操作dom的庫就被完全拋棄了）。

　　不過微信給開發(fā)者提供了開發(fā)工具，內(nèi)置了編程、調(diào)試、開發(fā)環(huán)境以及發(fā)布，開發(fā)者只需按照官方文檔進行開發(fā)，就能保證小程序在微信內(nèi)穩(wěn)定運行。

　　二、開發(fā)成本不同

　　H5的開發(fā)，涉及開發(fā)工具（vscode、Atom等）、前端框架（Angular、react等）、模塊管理工具（Webpack、Browserify等）、任務(wù)管理工具（Grunt、Gulp等），還有UI庫選擇、接口調(diào)用工具（ajax、FetchApi等）、瀏覽器兼容性等等。

　　盡管這些工具可定制化非常高，大部分開發(fā)者也有自己的配置模板，但對于項目中各種外部庫的版本迭代、版本升級，這些成本加在一起那就是個不小數(shù)目了。

　　而開發(fā)一個微信小程序，由于微信團隊提供了開發(fā)者工具，并且規(guī)范了開發(fā)標準，則簡單得多。前端常見的HTML、CSS變成了微信自定義的WXML、WXSS，WXML，官方文檔中都有明確的使用介紹，開發(fā)者按照說明專注寫程序就可以了。

　　需要調(diào)用后端接口時，調(diào)用發(fā)起請求API；需要上傳下載時，調(diào)用上傳下載API；需要數(shù)據(jù)緩存時，調(diào)用本地存儲API；引入地圖、使用羅盤、調(diào)用支付、調(diào)用掃碼等等功能都可以直接使用；UI庫方面，框架帶有自家weui庫加成。

　　并且在使用這些API時，不用考慮瀏覽器兼容性，不用擔心出現(xiàn)BUG，顯而易見微信小程序的開發(fā)成本相對低很多。

　　三、技術(shù)兼容不同

　　H5的開發(fā)，涉及開發(fā)工具、前端框架、模塊管理工具、任務(wù)管理工具，還有UI庫選擇、接口調(diào)用工具、瀏覽器兼容性等等。盡管這些工具可定制化非常高，大部分開發(fā)者也有自己的配置模板。但對于項目中各種外部庫的版本迭代、版本升級，系統(tǒng)兼容等等，這些成本加在一起那就是個不小數(shù)目了。

　　開發(fā)一個微信小程序，由微信團隊提供了開發(fā)者工具，并且規(guī)范了開發(fā)標準，相比H5簡單得多。

　　前端常見的HTML、CSS變成了微信自定義的WXML、WXSS，WXML，官方文檔中都有明確的使用介紹，開發(fā)者按照說明專注寫程序就可以了。并且開發(fā)過程中，不用考慮瀏覽器兼容性，不用擔心出現(xiàn)瀏覽器模具框架造成的BUG，可見微信小程序的開發(fā)成本相對低很多，也容易很多。

　　四、運行流暢度不同

　　在運行流暢度方面，無論對于用戶還是開發(fā)者，都可以直觀體驗出兩者的差異。這也是普通大眾最容易區(qū)分小程序與H5的一點。

　　打開H5，實際上是打開一個網(wǎng)頁，而網(wǎng)頁需要在瀏覽器中渲染。所以加載這一過程，會給人明顯的「卡頓」感覺，面對復(fù)雜的業(yè)務(wù)邏輯或者豐富的頁面交互時尤為明顯。

　　而微信小程序，它的代碼直接在微信上運行，省去了通過瀏覽器渲染的步驟，因此，在微信中使用小程序，才會比H5流暢很多。

　　除了首次打開需要幾秒的加載時間外，小程序各個頁面的切換、跳轉(zhuǎn)等體驗已經(jīng)媲美原生App，有著同樣的柔絲般順滑的效果。

　　概括來說，小程序相對H5有著開發(fā)成本低、功能更豐富、使用體驗更佳的優(yōu)點，目前的微信小程序可以實現(xiàn)網(wǎng)頁端跳轉(zhuǎn)，為營銷推廣提供想象空間，微信小程序的功能和經(jīng)驗將會越來越完善，將是一個好的發(fā)展機會。