開發移動端産品到底是用 H5 好(hǎo)(hǎo)還是用小程序好(hǎo)(hǎo)？ - 新(xīn)聞中心 - 新(xīn)聞中心

開發移動端産品到底是用 H5 好(hǎo)(hǎo)還是用小程序好(hǎo)(民子hǎo)？

2019-08-30 &nb用時sp; 來(lái)自：人(rén)人(rén)都是産品經常 &n林站bsp; 作(zuò)者：Judy &n化女bsp; 分(fēn)享：

許多做産品的同學經常會有這(zhè)樣的疑問：計劃開發的移動端産品北林到底是用 H5 好(hǎo)(hǎo)還是用小程序好(hǎo)(了水hǎo)？甚至很多開發同學也(yě)搞不清楚這(zhè)兩者在具體(畫站tǐ)使用中的優劣。那麼相信讀完此篇，便可讓你對二者之優劣利弊了(舞家le)然于胸，再也(yě)不必糾結。

大體(tǐ)上(shàng)講，H5和小程序司暗并不具備什(shén)麼可比性。隻是很多移劇人動端的場(chǎng)景下(xià)，這(去是zhè)兩種選擇都能(néng)實現(xiàn)産品的大部分(fē說男n)功能(néng)，加之其各領風(fēn熱綠g)騷好(hǎo)(hǎo)幾年，就(ji長雪ù)更難抉擇了(le)。
我們經常說(shuō)的 H5 是一(yī)種不去為标準的叫法，可以理(lǐ)解為(wèi)隻是一(yī)種技術多森，大家說(shuō)得最多的 H5 主要是指用在移動端的網頁，其實 P為樂C 電腦版也(yě)一(yī)樣可以使用 H5 頻水技術。而小程序，這(zhè)裡特指微信小程術術序，是在微信 APP 基礎上(shàng)支持的市輛一(yī)種應用形式，完全依賴于微信 A機討PP 環境。
以上(shàng)，是大概念上(shàng)的區分(fēn)，下(x樹說ià)面，我們就(jiù)來(lái)詳細對比一議妹(yī)下(xià)其他方面。

一(yī)、運行環境
這(zhè)裡的 H5 既然是網頁，那麼依賴的外殼主要是浏覽器(坐美qì)，因此隻要有浏覽器(qì)，就(jiù)可以使用。比如(拍事rú)手機内置的浏覽器(qì)，APP 的 web-view 組件，以及小服訊程序提供的 web-view 組件，都可以打開 H5 頁面。

注意，小程序的 web-view 可以打開 H5，但(dàn)并不是小程序要那“跳(tiào)轉”到了(le) H5 頁面，大水這(zhè)個(gè) H5 還是小程序的外殼内厭湖，仍然有很多限制。

前面說(shuō)了(le)，小程序隻能(né慢這ng)依賴微信客戶端，也(yě)就(jiù)是說(shuō什懂)隻能(néng)在微信裡打開。那麼，如(rú)果你的産品需要通過從小短信通知用戶帶上(shàng)訪問地址，就(jiù)無法用小程外務序實現(xiàn)了(le)。而 H5 頁面，則可以人劇在短信正文中直接用手機内置浏覽器(qì)打開。

但(dàn)是，微信本身(shēn)是跨平台的，因此無論是安卓上(sh民道àng)的微信，蘋果上(shàng)的微信，都是可以使用小程序的。甚至 QQ 數輛浏覽器(qì)也(yě)支持了(le)部分(fēn)小書放程序的入駐。

	H5	小程序
運行環境	浏覽器(qì)，Web-view	微信APP

二、系統權限
這(zhè)裡的系統權限，可以理(lǐ)解為(wèi)隐私級别比較高的，湖爸如(rú)通訊錄，或能(néng)調用硬件唱這的，比如(rú)藍牙功能(néng)等。從這(老街zhè)個(gè)角度看，H5 本身(shēn)可以說(shuō)幾乎是沒有什藍麗(shén)麼系統權限的。雖然也(yě)有攝像頭之類的舊風接口，但(dàn)是重度依賴浏覽器(qì)媽呢能(néng)力，兼容性有限。

而小程序，由于依賴微信客戶端本身(shēn)，所以微信小程序團隊将客微和戶端的很多能(néng)力開放(fàng)給了(le)小程序環境，當然，前劇業提是你給微信也(yě)授權了(le)相關(guān)的能(néng)姐習力，比如(rú)允許訪問麥克風(fēng)，允許訪問相冊等。

所以，如(rú)果你的産品重度依賴這(zhè那線)些(xiē)能(néng)力，那小程序一(yī)定是不二之選，體錢因為(wèi) H5 很難做到這(zhè)些(xiē)，對于很多去媽小程序提供的能(néng)力，H5 是根本沒有可能(nén和說g)實現(xiàn)的。

	H5	小程序
系統權限	弱	強

三、能(néng)力限制
前面提到了(le)系統權限層面的差異，其實也(yě)是一(yī)種能(作場néng)力限制。除此之外，還有一(yī)些(xiē)能(為畫néng)力是微信本身(shēn)的策略限懂市制的，比如(rú) H5 在微信裡可以直接分(fēn)享朋(péng)友圈，務日而小程序目前就(jiù)隻能(néng)轉發好(hǎo)(hǎo)友或群。對于可民朋(péng)友圈，就(jiù)隻能(néng)生(shē少不ng)成帶小程序碼的圖片發到朋(péng)相新友圈。

而對于分(fēn)享到好(hǎo)(hǎo)友或群，小程序又提供了(le)卡片暗歌式的分(fēn)享界面，看起來(lái)很高端，信息也(兵去yě)多，并且能(néng)追蹤用戶行為(wèi)。這(zh見算è)一(yī)點，H5 又無法做到。

再比如(rú)支付能(néng)力，小程序隻支持微信支付，的新而 H5 裡可以選擇使用其他支付平台提供的支媽好付方式。

	H5	小程序
直接分(fēn)享朋(péng)友圈	能(néng)	不能(néng)
掃碼識别	能(néng)	能(néng)
支付能(néng)力	多種	微信支付

四、用戶體(tǐ)驗
分(fēn)享卡片看上(shàng)去比普通的 H5 鍊接分(fēn)享體懂報(tǐ)驗要好(hǎo)(hǎo)；而朋(pé醫作ng)友圈的 H5 分(fēn)享形式，和圖片識别小程序碼的形式到底哪個(gè家都)好(hǎo)(hǎo)也(yě)不好(hǎo)(hǎo)說(shu靜視ō)。不過，如(rú)果你的産品被判定有違規行為(wèi)，那麼舊呢H5 的鍊接是很容易匹配屏蔽的，可以直接導緻分(fēn)享 H5 頁面隻能(遠器néng)自己可見，别人(rén)看不到。

但(dàn)是，小程序的分(fēn)享圖雖然不太可能(néng)封禁，但(d舊看àn)小程序是微信的呀，那還不是分(fēn)分(fēn)鐘就多日(jiù)關(guān)掉。所以在抗風(fēng)險方面，二者各有千秋。如(rú)果好拍是 H5，那就(jiù)多準備幾個(gè)鐵快域名；如(rú)果是小程序，就(jiù)直接多上(shàng)線遠朋幾個(gè)小程序，保證封禁時(shí)損失降到最低(dī)。

除了(le)形式上(shàng)的體(tǐ)驗差異，性能(化知néng)上(shàng)也(yě)是有差異了站的。小程序基于微信客戶端實現(xiàn)，對解析進行了(l都很e)優化(huà)，并且一(yī)旦首次打開小程序，可以時草直接緩存很多資源。因此，在使用小程序時(shí)可以明顯感覺很流暢，接森為近原生(shēng) APP 的體(tǐ)驗。

而 H5 本質上(shàng)還是網頁，跟之前在 PC 兵車上(shàng)浏覽網頁沒區别，每次要請求各種圖是要片樣式資源，在浏覽器(qì)内核裡渲染，因此體(tǐ)驗會差一(yī)美快些(xiē)。

	H5	小程序
流暢度	一(yī)般	好(hǎo)(hǎo)

五、訪問入口
在訪問入口這(zhè)個(gè)點上(shàn裡朋g)，H5 的核心競争力就(jiù)是能(néng)在上舞微信之外玩(wán)，不依賴微信本身(shēn)。而亮音小程序的優勢，就(jiù)是有 50+ 微信提供的場(chǎng)有吧景入口，并且聊天界面頂部的“最近使用”和“我的小朋報程序”這(zhè)個(gè)入口，相對 H分制5 來(lái)說(shuō)是有絕對優勢的。靜也

用戶關(guān)閉之後，H5 頁面如(rú)果輛書想繼續訪問，可能(néng)會通過收藏入口，或者轉發給“文件傳輸助手”等聊天界門妹面保存，還可以縮小到圖标稍後閱讀等等。本質上(shàn動花g)還是跟 PC 時(shí)代的浏覽器(qì)收藏夾火家差不多，需要有個(gè)地方把 H5 的鍊接地址保存下(xià)來(l光小ái)，方便下(xià)次訪問。如(rú)果沒有保存，下(xià)次就(jiù的店)很難找到了(le)。

至于微信内的搜索，是可以同時(shí)搜索 H5 和小程序的，可少銀以根據 H5 的名字和内容、小程序的名字和介紹來(lái)搜索。這志購(zhè)裡 H5 有個(gè)天然優勢就(jiù煙務)是，隻要你的鍊接在各大搜索引擎提交過，那麼使筆熱用其他的搜索引擎也(yě)能(néng)搜出這(zhè)個(gè) H5，有年比如(rú)百度搜索。

	H5	小程序
入口數量	少	多
專屬入口	無	有

六、用戶觸達
H5 本身(shēn)是沒有用戶觸達能(néng)力的，算腦如(rú)果用戶關(guān)掉了(le)頁面，頁面就(jiù)再公又也(yě)沒有辦法主動觸達該用戶了(le)。因此，傳統的營銷方式都是采用郵件信廠營銷或短信營銷等來(lái)觸達用戶。

後來(lái)，我們有了(le)微信服務(wù)号，就(jiù)多了(雜電le)服務(wù)号模闆消息的觸達方式。不管是哪種新物方式，都是想方設法把鍊接地址推送給用戶，用戶點擊時(s一家hí)再通過手機内置浏覽器(qì)或微信内置浏覽器(qì)訪問頁面。報費

而小程序天然支持模闆消息，雖然有一(yī)周的推送時(shí)體公間(jiān)限制，但(dàn)是常規的業務(讀女wù)已經足夠了(le)。隻要用戶使用你的小程序，你就(jiù)可以通過某種操那姐作(zuò)收集 formid，然後即可在一(yī)周之内的任意時花區(shí)間(jiān)觸達用戶。

	H5	小程序
主要觸達渠道	短信	微信
短信觸達	文字鍊接	文字引導微信搜索

七、開發成本
對于簡單功能(néng)，H5 和小程序的開發成本是差不多的，開發模答要式和語言風(fēng)格也(yě)類似。而對于前面說(shuō)到的系統我就能(néng)力，可能(néng)就(jiù)隻有小多中程序才能(néng)實現(xiàn)，H5 根本做不了(le)。此鐵來外，小程序自成體(tǐ)系，因此也(yě)有一(yī)些(xiē)現謝大(xiàn)成的組件可以使用，如(rú)果剛好(hǎo)(hǎ文內o)覆蓋了(le)你的産品功能(néng)就(年時jiù)能(néng)提升效率。

雖然 H5 也(yě)有很多框架組件可以用，但(dàn朋間)由于過于龐雜，有選擇成本，且技術棧和 UI 五花八門，可能(nén請道g)還有融合和修改的成本。而小程序組件的 UI 大部分(fēn)已空畫經确定，隻有很少的部分(fēn)可以修改，所以一(yī)旦認定使用小道腦程序，這(zhè)部分(fēn)成本會低(dī)很多。

總體(tǐ)上(shàng)來(lái)講，我覺得還是可以認為(wèi)小制制程序的開發成本更低(dī)一(yī)些(xiē)。

	H5	小程序
簡易功能(néng)成本	低(dī)	低(dī)
系統功能(néng)成本湖看	高	低(dī)

八、叠代周期
開發成本低(dī)，未必叠代周期就(jiù年湖)短。對于 H5 我們可以随時(shí)發布上(shàng)線，綠黃不用受任何牽制。而小程序的特點，就(jiù)妹鄉是每次提交版本都要經過微信方面的審核，且審核時(shí)間要請(jiān)的長短很随機，着急上(shàng)線的項目就(jiù)很無奈了(l綠化e)。

至于其他速度，取決于開發人(rén)員(yuán)技能(nén志輛g)熟練程度，系統複雜度，對基礎能(néng)力為放的依賴等，就(jiù)不好(hǎo)(hǎo)估算(媽女suàn)了(le)。

	H5	小程序
叠代周期	短	較長

九、外部限制
由于小程序依賴微信平台，因此微信平台要對内容安全等事(shì)項負責，一計比如(rú)你想搞個(gè)有 UGC 的産品，用 H5光吧可能(néng)還可以趁着監管寬松無證裸奔一(yī樹但)陣，或者說(shuō)做大了(le)再補證。

而小程序，就(jiù)很可能(néng)完全不機間能(néng)過審，根本上(shàng)不了(l友樂e)線。比如(rú)試聽(tīng)類，社交類，都有年中對應的資質，而這(zhè)個(gè)資質還可能(néng)很她藍難獲得。

類似的，H5 頁面可以不用搞 HTTPS，有個(也信gè)網站(zhàn)就(jiù)能(néng我商)玩(wán)，甚至用工具做個(gè)小活動也(yě)都可美日以玩(wán)。但(dàn)是小程序，從後端數就開始就(jiù)有限制，要求域名備案+HTTPS，一(yī)定程度上(s店通hàng)也(yě)是一(yī)點成本。

此外，小程序對文件大小也(yě)有限制，雖然現(xiàn)在已經紅習支持分(fēn)包加載，但(dàn)是在文件大小方面離件，H5 本身(shēn)是沒有什(shén)麼限制的。隻是實際開弟我發的時(shí)候，要照顧用戶的體(tǐ)驗，湖水不能(néng)讓頁面打開太慢(màn)。

	H5	小程序
外部限制	較少	多

綜上(shàng)所述，H5 和小程序在不同的場(chǎ聽了ng)景下(xià)各有千秋，具體(tǐ)使用哪一(yī)種要看你看重哪些車人(xiē)能(néng)力。H5 和小程序都是實現(xiàn)産品的工具，選擇工具最擅長的能(輛書néng)力，其他方面再想辦法來(lái)彌補即可。最後，再附體很上(shàng)完整表格一(yī)份，看筆請你是否已經明了(le)二者的差異：

	H5	小程序
運行環境	浏覽器(qì)、Web-view	微信
系統權限	弱	強
直接分(fēn)享朋(péng)友圈	能(néng)	不能(néng)
掃碼識别	能(néng)	能(néng)
支付能(néng)力	多種	微信
流暢度	一(yī)般	好(hǎo)(hǎo)
入口數量	少	多
專屬入口	無	有
主動觸達渠道	短信	微信
短信觸達	文字鍊接	文字引導到微信
簡易功能(néng)成本	低(dī)	低(dī)
系統功能(néng)成本	高	低(dī)
叠代周期	短	較長
外部限制	較少	多

如(rú)果你還有其他疑問，歡迎聯系與我交流。影西

上(shàng)一(yī)篇為(wèi)什(shén)麼設計師總是做不出司算你要的效果？

下(xià)一(yī)篇物聯網在智慧園區的應用