各位市場(chǎng)部的朋友們大家好！

當(dāng)你的公司決定要開(kāi)發(fā)一款基于微信的應(yīng)用程序的時(shí)候，你是否曾經(jīng)猶豫過(guò)，究竟是應(yīng)該選擇基于H5的微網(wǎng)站，還是微信小程序呢？

工作中，小編經(jīng)常被客戶(hù)問(wèn)到這個(gè)問(wèn)題，然而，這并不是三言?xún)烧Z(yǔ)能夠說(shuō)清楚的。所以，我想索性把H5和小程序的區(qū)別寫(xiě)下來(lái)，這就有了這篇文章。

相信這篇文章能夠一次性解決你對(duì)于H5和小程序的差別的疑問(wèn)。如果覺(jué)得有用，歡迎點(diǎn)贊，或轉(zhuǎn)發(fā)給有需要的人。

一、 本質(zhì)區(qū)別

首先，說(shuō)明一下小程序和H5最為本質(zhì)的區(qū)別：

小程序是基于特定平臺(tái)APP基礎(chǔ)上的一個(gè)輕應(yīng)用，不能脫離其所在的平臺(tái)單獨(dú)運(yùn)行。換而言之，微信小程序只能在微信APP中運(yùn)行；同理，支付寶小程序也只能在支付寶APP中運(yùn)行，其他小程序也是一樣的道理。本文中的小程序泛指微信小程序。

H5可以簡(jiǎn)單的將它理解為網(wǎng)頁(yè)，微信H5是國(guó)內(nèi)營(yíng)銷(xiāo)圈對(duì)于手機(jī)微網(wǎng)站的一個(gè)泛稱(chēng)。除了一些特定情況外，比如添加了微信授權(quán)功能，H5是可以在手機(jī)和PC瀏覽器中打開(kāi)的。

由此可見(jiàn)，如果你所要開(kāi)發(fā)的應(yīng)用有在微信以外使用的需求，則只能選擇H5，而不是小程序。因?yàn)槲⑿判〕绦螂x開(kāi)微信APP則無(wú)法使用。

二、 應(yīng)用入口的不同

經(jīng)過(guò)六年多的演變，小程序與H5在微信APP中的入口已經(jīng)逐漸的趨于接近，比如說(shuō)都可以?huà)叽a進(jìn)入（二維碼的格式不同）；可以微信聊天窗轉(zhuǎn)發(fā)（小程序卡片更大、更顯眼）；可以嵌入微信公眾號(hào)菜單；可以插入公眾號(hào)推文（小程序卡片更顯眼）等。

然而，小程序還有專(zhuān)屬于自己的入口方式，比如，微信聊天列表頁(yè)面下拉快速訪(fǎng)問(wèn)近期小程序；微信“發(fā)現(xiàn)”頁(yè)“小程序”入口訪(fǎng)問(wèn)和搜索小程序等。此外，小程序還可以通過(guò)搜一搜、附近的小程序等功能被找到。H5不擁有以上所有的入口方式。

少數(shù)幾個(gè)小程序處于劣勢(shì)的情況，比如小程序暫時(shí)還無(wú)法直接轉(zhuǎn)發(fā)朋友圈，而H5則可以。當(dāng)然，你也可以選擇朋友圈發(fā)送小程序二維碼的方式作為替代。

簡(jiǎn)而言之，為了推廣微信小程序的使用，微信APP給予了小程序諸多的額外曝光機(jī)會(huì)。如果你應(yīng)用解決的問(wèn)題是微信APP中客戶(hù)的需求，單單從應(yīng)用入口的角度，小程序更佳。

三、 用戶(hù)使用體驗(yàn)的不同

用專(zhuān)業(yè)的技術(shù)術(shù)語(yǔ)來(lái)說(shuō)，小程序是微信內(nèi)的云端應(yīng)用（無(wú)需安裝），不是原生App，通過(guò)WebSocket 雙向通信（保證無(wú)需刷新即時(shí)通信）、本地緩存（圖片與UI 本地緩存降低與服務(wù)器交互延時(shí)）以及微信底層技術(shù)優(yōu)化實(shí)現(xiàn)了接近原生APP 的體驗(yàn)。這就是為什么很多用戶(hù)反映小程序的使用體驗(yàn)比H5更加流暢的原因。

H5就如同網(wǎng)頁(yè)在微信瀏覽器內(nèi)打開(kāi)使用，原理與在瀏覽器中打開(kāi)一個(gè)網(wǎng)頁(yè)相似，會(huì)存在一個(gè)加載的過(guò)程。頁(yè)面上方出現(xiàn)的綠色加載條就是H5頁(yè)面加載進(jìn)度的提示。

如果網(wǎng)速不佳或者網(wǎng)頁(yè)上需要加載的內(nèi)容過(guò)多，就會(huì)出現(xiàn)頁(yè)面“很卡”的感覺(jué)。當(dāng)遇到復(fù)雜的業(yè)務(wù)邏輯或者豐富的頁(yè)面交互時(shí)，卡頓就尤為明顯。

小程序和H5都無(wú)需安裝，直接打開(kāi)即可，且手機(jī)上打開(kāi)過(guò)一次后，就會(huì)有緩存，第二次打開(kāi)就會(huì)稍快些。

總體上來(lái)說(shuō)，小程序的使用體驗(yàn)會(huì)更加的流暢，而H5根據(jù)頁(yè)面加載內(nèi)容的多少，比較容易出現(xiàn)卡頓的現(xiàn)象。

四、 產(chǎn)品功能定位不同

小程序主打輕應(yīng)用，實(shí)現(xiàn)“即用即走”。因此，與公眾號(hào)不同，小程序沒(méi)有關(guān)注和推送營(yíng)銷(xiāo)消息等營(yíng)銷(xiāo)功能，（雖然小程序也可以在特定條件下發(fā)送服務(wù)消息，但官方明確指出不可用于營(yíng)銷(xiāo)目的），主要側(cè)重滿(mǎn)足功能性的需求。小程序相比公眾號(hào)H5運(yùn)行更流暢，可以用于替代部分原生APP的功能。而作為H5最常見(jiàn)的載體，公眾號(hào)是一種營(yíng)銷(xiāo)工具，為用戶(hù)提供粉絲管理、信息與資訊發(fā)布的平臺(tái)，一種新的信息傳播渠道，構(gòu)建與粉絲之間更好的溝通與管理模式。結(jié)合H5以后公眾號(hào)也能夠提供一些簡(jiǎn)單交互功能。

基于上面的原因，我們生活中常遇到商家使用小程序提供服務(wù)，例如，點(diǎn)餐、外賣(mài)、團(tuán)購(gòu)等；使用公眾號(hào)和H5實(shí)現(xiàn)粉絲管理和營(yíng)銷(xiāo)需求的現(xiàn)象也就很好理解了，例如營(yíng)銷(xiāo)海報(bào)、活動(dòng)報(bào)名等。

五、 開(kāi)發(fā)成本的不同

小程序因?yàn)槭窃谔囟ǖ沫h(huán)境（微信官方提供的工具）中去開(kāi)發(fā)，所以它的組件、UI都是現(xiàn)成的。用專(zhuān)業(yè)術(shù)語(yǔ)來(lái)說(shuō)，就是封裝好的了。

（開(kāi)發(fā)語(yǔ)言從前端常見(jiàn)的HTML、CSS變成了微信自定義的WXML、WXSS，WXML，官方文檔中都有明確的使用介紹，開(kāi)發(fā)者按照說(shuō)明專(zhuān)注寫(xiě)程序就可以了。引入地圖、使用羅盤(pán)、調(diào)用支付、調(diào)用掃碼等等功能都可以直接使用；UI庫(kù)方面，框架帶有自家WEui庫(kù)加成）

如果開(kāi)發(fā)者從未接觸html+css+js網(wǎng)頁(yè)前端開(kāi)發(fā)技術(shù)，那對(duì)于小程序開(kāi)發(fā)來(lái)說(shuō)會(huì)比較陌生；如果開(kāi)發(fā)者接觸過(guò)，那小程序開(kāi)發(fā)會(huì)簡(jiǎn)單很多，學(xué)習(xí)幾天基本上可以入門(mén)并且上手進(jìn)行開(kāi)發(fā)。此外，小程序開(kāi)發(fā)不用去考慮兼容問(wèn)題，修改返工的次數(shù)就會(huì)減少，成本會(huì)低一些。

公眾號(hào)H5在開(kāi)發(fā)時(shí)會(huì)有開(kāi)發(fā)工具的選擇、框架的選擇、UI的選擇等問(wèn)題，還要兼顧到不同手機(jī)瀏覽器是否兼容的問(wèn)題，可能會(huì)面臨多次修改，這樣會(huì)增加開(kāi)發(fā)成本。

所以說(shuō)，如果你的開(kāi)發(fā)公司同時(shí)具備H5和小程序的開(kāi)發(fā)經(jīng)驗(yàn)，同等的功能量級(jí)，小程序的開(kāi)發(fā)成本會(huì)稍微低一些，不過(guò)這個(gè)差別不會(huì)太大。當(dāng)然也存在一些例外，比如說(shuō)開(kāi)發(fā)簡(jiǎn)單的營(yíng)銷(xiāo)活動(dòng)著陸頁(yè)（landing page）或者微信海報(bào)，H5則會(huì)比小程序開(kāi)發(fā)成本更低、更靈活。

六、 獲取系統(tǒng)級(jí)權(quán)限的不同

微信小程序相對(duì)于H5能獲得更多的系統(tǒng)權(quán)限，比如網(wǎng)絡(luò)通信狀態(tài)、數(shù)據(jù)緩存能力等，這些系統(tǒng)級(jí)權(quán)限都可以和微信小程序無(wú)縫銜接。

公眾號(hào)H5則沒(méi)有這么多的系統(tǒng)權(quán)限，也是H5的大多應(yīng)用場(chǎng)景被定位在營(yíng)銷(xiāo)，或者業(yè)務(wù)邏輯簡(jiǎn)單、功能單一的應(yīng)用的原因。

簡(jiǎn)言之，系統(tǒng)權(quán)限的高低，依次是：“原生APP”大于“小程序 ”大于“ H5”。

七、 產(chǎn)品上線(xiàn)和更新方式不同

小程序的代碼、類(lèi)別和內(nèi)容，都需要經(jīng)過(guò)騰訊官方的嚴(yán)格審核，部分類(lèi)別需要資質(zhì)證書(shū)，而且每次更新迭代版本，都需要重新提交審核，審核通過(guò)后才可發(fā)布使用。審核時(shí)間各異，從幾個(gè)小時(shí)到幾天不等。如果你的應(yīng)用需要進(jìn)行頻繁的修改，那么審核等待的時(shí)間將會(huì)給你的項(xiàng)目帶來(lái)諸多不便。

公眾號(hào)H5是基于微信瀏覽器網(wǎng)頁(yè)的，無(wú)需通過(guò)官方審核，所以只要一個(gè)域名和放置代碼的服務(wù)器，無(wú)需其他資質(zhì)，基本上隨時(shí)可以發(fā)布上線(xiàn)且不需要審核。如需要修改頁(yè)面內(nèi)容，直接在服務(wù)器端修改就可以看到效果，并上線(xiàn)。

八、 獲取的用戶(hù)信息的不同

微信小程序可以獲取用戶(hù)授權(quán)后的基本信息，用戶(hù)在當(dāng)前小程序的唯一標(biāo)識(shí)OpenID、用戶(hù)的頭像圖片、微信昵稱(chēng)和綁定微信的手機(jī)號(hào)（需單獨(dú)授權(quán)）等。

公眾號(hào)H5可以獲取用戶(hù)授權(quán)后的基本信息，用戶(hù)在當(dāng)前公眾號(hào)的唯一標(biāo)識(shí)OpenID、用戶(hù)的頭像圖片、微信昵稱(chēng)等，但無(wú)法獲取綁定微信的手機(jī)號(hào)。

需要強(qiáng)調(diào)的是

（1）同一個(gè)用戶(hù)在小程序和公眾號(hào)的下的兩個(gè)OpenID是不同的，即便是小程序和公眾號(hào)的主體是相同的。

（2）如果小程序和公眾號(hào)都綁定在同一個(gè)開(kāi)放平臺(tái)賬號(hào)下的話(huà)，用戶(hù)在小程序和在公眾號(hào)下的UnionID是一樣的。

在不綁定UnionID的默認(rèn)情況下，H5頁(yè)面授權(quán)用戶(hù)無(wú)法和小程序的授權(quán)用戶(hù)自動(dòng)綁定（因?yàn)閮烧叩腛penID不同）。換種說(shuō)法則是，不綁定UnionID的話(huà)，系統(tǒng)無(wú)法知道小程序和H5上的用戶(hù)是否是同一個(gè)人。

UnionID 機(jī)制說(shuō)明

如果開(kāi)發(fā)者擁有多個(gè)移動(dòng)應(yīng)用、網(wǎng)站應(yīng)用、和公眾帳號(hào)（包括小程序），可通過(guò) UnionID 來(lái)區(qū)分用戶(hù)的唯一性，因?yàn)橹灰峭粋€(gè)微信開(kāi)放平臺(tái)帳號(hào)下的移動(dòng)應(yīng)用、網(wǎng)站應(yīng)用和公眾帳號(hào)（包括小程序），用戶(hù)的 UnionID 是唯一的。換句話(huà)說(shuō)，同一用戶(hù)，對(duì)同一個(gè)微信開(kāi)放平臺(tái)下的不同應(yīng)用，UnionID都是相同的。

九、 運(yùn)行環(huán)境的不同

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

公眾號(hào)H5的運(yùn)行環(huán)境是微信瀏覽器。

寫(xiě)在最后

簡(jiǎn)而言之，小程序使用體驗(yàn)更佳、訪(fǎng)問(wèn)入口多、獲取的系統(tǒng)權(quán)限更多，適合作為“用完即走”功能性應(yīng)用的開(kāi)發(fā)方式。然而，它缺乏營(yíng)銷(xiāo)功能，無(wú)法關(guān)注，并且不能在微信APP以外使用。

H5結(jié)合微信公眾號(hào)則更加適合滿(mǎn)足營(yíng)銷(xiāo)需求，可承載簡(jiǎn)單的交互功能，并且可以在微信生態(tài)以外使用。然而，使用體驗(yàn)和在微信生態(tài)中的曝光度則不如小程序。

總之，小程序和H5兩者各有利弊，需要根據(jù)實(shí)際情況有針對(duì)性的選擇。

另外，還需要指出，只要將H5的域名配置到小程序的業(yè)務(wù)域名中，就可以實(shí)現(xiàn)小程序中跳轉(zhuǎn)H5鏈接。這樣就能實(shí)現(xiàn)在小程序中訪(fǎng)問(wèn)H5，實(shí)現(xiàn)小程序和H5的整合。