支付寶小程序、百度小程序、微信小程序、今日頭條小程序技術(shù)分析

一、總述

在如今群雄環(huán)伺的小程序賽道上，BAT早已完成了小程序的布局，今日頭條也不甘示弱，成為繼微信、支付寶、百度之后，第四個(gè)推出小程序應(yīng)用的公司，四家小程序可謂是各有各的特色。小程序出現(xiàn)，讓移動(dòng)應(yīng)用時(shí)代向輕應(yīng)用時(shí)代邁進(jìn)了一步。

今日頭條進(jìn)軍小程序是為什么呢？今日頭條是跟風(fēng)開(kāi)發(fā)小程序的嗎？跟風(fēng)也只是其中一個(gè)原因，由于小程序應(yīng)用體量更輕、對(duì)配置要求低、使用路徑短、場(chǎng)景和流量更為貼合。不少人認(rèn)為小程序就是未來(lái)接入移動(dòng)互聯(lián)服務(wù)的更佳入口。而且好多商家利用小程序無(wú)需下載APP，獲取更加方便，傳播更為廣泛的特點(diǎn)，在自己的小程序商城中獲得了巨大的收益。本文將對(duì)于四種小程序在發(fā)展現(xiàn)狀、自身特色、應(yīng)用場(chǎng)景以及技術(shù)方面進(jìn)行對(duì)比分析。今日頭條小程序，由于還未推出小程序平臺(tái)和相關(guān)技術(shù)文檔，所以涉及到技術(shù)方面的分析較少。

小程序共性：

1.全封閉的微信小程序。作為小程序的“鼻祖”微信小程序已經(jīng)擁有了 2.9 億日活躍用戶，微信小程序數(shù)量突破百萬(wàn)，第三方平臺(tái)數(shù)超過(guò) 2300 家。微信小程序的開(kāi)發(fā)者數(shù)量達(dá)到 150 萬(wàn)，微信小程序是全封閉式的，用戶只能在微信生態(tài)里完成產(chǎn)品閉環(huán)。微信小程序的封閉性，使得開(kāi)發(fā)者的小程序的運(yùn)行范圍只能在微信生態(tài)體系內(nèi)，雖然在一定程度上對(duì)小程序有規(guī)范作用，易于管理，但是其應(yīng)用范圍依然是在一定的界限內(nèi)。

2.半封閉的支付寶小程序。支付寶小程序通過(guò)“718+X”的業(yè)務(wù)邏輯來(lái)打通線上線下，即 7 大入口、1 個(gè)閉環(huán)、8 大能力再加 X 場(chǎng)景，支付寶小程序目前已重點(diǎn)開(kāi)放支付收單，會(huì)員服務(wù)，芝麻信用等8項(xiàng)能力，由于產(chǎn)品閉環(huán)需要在阿里的生態(tài)下完成，其本身是半開(kāi)放半封閉的模式，目前支付寶小程序數(shù)量共計(jì)超過(guò) 2 萬(wàn)，日活達(dá) 1.2 億，用戶數(shù)達(dá) 3 億，小程序平均7 日留存率為 29%。

3.開(kāi)放的百度小程序。百度于7月份正式推出了小程序，不同于微信和支付寶的封閉模式，百度小程序的主題為開(kāi)放+AI，百度把“搜索 + 信息流”全域流量都接入小程序開(kāi)放給開(kāi)發(fā)者，同時(shí)通過(guò)百度自身的技術(shù)優(yōu)勢(shì)，給小程序AI賦能。

2018上半年微信小程序數(shù)量突破百萬(wàn)，日活高達(dá)2.8億。百度智能小程序達(dá)到1.37億日活量，支付寶達(dá)到1.58億日活量。相比阿里、百度，騰訊借助微信特殊的社交和內(nèi)容生態(tài)，確實(shí)提前搶奪了小程序應(yīng)用的用戶紅利，尤其是社交裂變所產(chǎn)生的傳播效應(yīng)，似乎已經(jīng)成為目前小程序?qū)俚耐娣?。但是說(shuō)到底，小程序連接流量和場(chǎng)景、內(nèi)容，而B(niǎo)AT三者的流量本身具有天然的屬性差異，這也決定了小程序的刺激因素遠(yuǎn)不止社交，百度、阿里所具有搜索、電商的互聯(lián)網(wǎng)基因，使得其小程序的運(yùn)營(yíng)規(guī)則也各不相同。這也是為什么小程序不能成為騰訊獨(dú)角戲，百度高調(diào)進(jìn)入這一賽道的原因。從這個(gè)角度來(lái)看，百度智能小程序的核心競(jìng)爭(zhēng)力在于搜索，支付寶小程序的核心在于支付，微信小程序的核心在于社交，這就決定了各種小程序的使用場(chǎng)景，每個(gè)平臺(tái)都是結(jié)合其龐大入口之上的內(nèi)容生態(tài)和技術(shù)應(yīng)用來(lái)發(fā)展自身小程序的。

二、詳細(xì)分析

一、微信小程序 （2017年1月9日正式上線）

強(qiáng)社交屬性和高頻次流量是微信的強(qiáng)力優(yōu)勢(shì)。微信的用戶群分布廣泛，停留時(shí)間長(zhǎng)，打開(kāi)頻次高，這些特點(diǎn)使其成為各類資訊、娛樂(lè)化內(nèi)容和休閑游戲生長(zhǎng)的肥沃土壤。

微信小程序支持個(gè)人申請(qǐng)、企業(yè)注冊(cè)，駐門(mén)檻更低。微信的社交屬性帶來(lái)了巨大流量與十億月活。但在利用社交關(guān)系快速取得大量用戶之后，留存和回訪率又成了小程序更大的“短板”。

阿拉丁公布數(shù)據(jù)顯示，微信小程序已超100萬(wàn)個(gè)，開(kāi)發(fā)商更是如蒲公英般，遍地開(kāi)花。所以微信小程序無(wú)疑成為中小企業(yè)和零售商更好的選擇。截止2018年6月底，微信小程序的數(shù)量已經(jīng)突破百萬(wàn)，小程序的日活頁(yè)大幅增長(zhǎng)到了 2.7 億，相對(duì)于1月初微信官方公布的數(shù)據(jù)58萬(wàn)個(gè)小程序幾乎翻了一倍。按照此趨勢(shì)，到2018年年底，小程序?qū)⒃鲩L(zhǎng)到200萬(wàn)之巨。

二、支付寶小程序 （2017年9月20日正式上線）

支付寶小程序主打營(yíng)銷、信用、風(fēng)控、金融等差異化能力與優(yōu)勢(shì)。致力于走全方位賦能商業(yè)的路徑,目前主要面向企業(yè)級(jí)開(kāi)發(fā)者。僅支持企業(yè)注冊(cè)，不支持個(gè)人申請(qǐng)。

支付寶本身就具有極強(qiáng)的工具屬性，也非常符合符合張小龍口中“即用即走”的標(biāo)準(zhǔn)。螞蟻金服在今年接連開(kāi)放出諸多能力，小程序背靠支付寶大數(shù)據(jù)支持，支付簡(jiǎn)單化。支付寶的一個(gè)特色的模塊就是信用市場(chǎng)，小程序應(yīng)用標(biāo)準(zhǔn)通過(guò)支付寶用戶的芝麻信用分，為商家提供消費(fèi)者消費(fèi)能力的基礎(chǔ)信息，同樣通過(guò)支付寶的信用，為消費(fèi)者省去很多類似押金的步驟。

為了降低開(kāi)發(fā)門(mén)檻，支付寶與微信有著近似的小程序開(kāi)發(fā)框架與產(chǎn)品體驗(yàn)；但在應(yīng)用場(chǎng)景與發(fā)展方向上，支付寶小程序在未來(lái)方向并不在不會(huì)涉及社交、內(nèi)容等。在支付寶小程序上實(shí)現(xiàn)服務(wù)臺(tái)能力，著重于聯(lián)動(dòng)螞蟻金服保險(xiǎn)、安全等能力在出行、水電燃、醫(yī)療等領(lǐng)域?qū)崿F(xiàn)異地歸還、助力商家營(yíng)銷等。

由支付寶小程序行業(yè)明細(xì)來(lái)看，目前支付寶政務(wù)服務(wù)已經(jīng)覆蓋社會(huì)保障、交通、警務(wù)、民政、旅游類、稅務(wù)、氣象環(huán)保等7大類56項(xiàng)服務(wù)。結(jié)合支付寶本身、或者其他小程序提供的服務(wù)結(jié)合，就展示出一套結(jié)合門(mén)店+生活+小程序+服務(wù)+整體卡包小程序生態(tài)模式。

三、智能小程序 （2018年7月4日正式上線）

百度天然就是用戶各類需求的入口，智能小程序與搜索結(jié)果自然融合更直觀，可以讓用戶直接使用。反觀微信、支付寶小程序，都需要用戶在眾多小程序中進(jìn)行篩選，從而間接導(dǎo)致了許多同質(zhì)的小程序被淹沒(méi)。

百度強(qiáng)調(diào)的是開(kāi)放生態(tài)，主打AI和流量的。百度智能小程序具有入口自然，流量質(zhì)量高等優(yōu)勢(shì)，支持企業(yè)、政府、媒體和其他組織申請(qǐng)。百度職能小程序的生態(tài)體系對(duì)于開(kāi)發(fā)者是十分友好的，開(kāi)放的110多項(xiàng)AI技術(shù)可以讓開(kāi)發(fā)者輕松獲得AI能力。智能小程序是開(kāi)放的生態(tài)，不僅可以運(yùn)行于百度的平臺(tái)，更可以運(yùn)行于外部App上，開(kāi)發(fā)者一次開(kāi)發(fā)就可以實(shí)現(xiàn)多端運(yùn)行，這和微信小程的封閉生態(tài)有著本質(zhì)的區(qū)別。

“體驗(yàn)、流量、智能、開(kāi)放”是百度智能小程序的四大核心理念。

目前，攜程、蘇寧易購(gòu)、唯品會(huì)、同程、春雨醫(yī)生、愛(ài)奇藝、優(yōu)信二手車、查違章等在內(nèi)的近百家企業(yè)成為首批加入智能小程序生態(tài)的合作伙伴，并將陸續(xù)推出各自的智能小程序。百度APP中進(jìn)入愛(ài)奇藝小程序觀看視頻，一律沒(méi)有視頻廣告。

從目前趨勢(shì)來(lái)看微信還是占領(lǐng)領(lǐng)先地位的。但是，多種小程序之間不可唯流量論，小程序是基于商業(yè)和服務(wù)去開(kāi)發(fā)的，最終還是要回歸商業(yè)本質(zhì)。畢竟小程序天然是一個(gè)寄生體，是寄生在微信、支付寶等平臺(tái)用于服務(wù)用戶、拓展渠道、探索更多應(yīng)用場(chǎng)景的重要載體。這意味著，小程序必須與平臺(tái)的屬性特點(diǎn)相契合。小程序承載的是移動(dòng)互聯(lián)網(wǎng)時(shí)代，便捷生活發(fā)展的方向。

四、今日頭條小程序

目前開(kāi)放的小程序入口，只針對(duì) Android 手機(jī)，且暫時(shí)只對(duì)部分公司開(kāi)放。

5大特點(diǎn)：

1.可通過(guò)搜索關(guān)鍵詞進(jìn)入小程序；

2.可在不同頁(yè)面轉(zhuǎn)發(fā)到微頭條；

 3.微信小程序在同意授權(quán)之后，只能通過(guò)刪除小程序來(lái)取消這些信息的授權(quán)。今日頭條區(qū)別于微信，支持隨時(shí)進(jìn)行授權(quán)設(shè)置和權(quán)限修改，目前授權(quán)主要有頭像、昵稱和定位等信息。

4.可使用支付寶支付；

5.小程序頁(yè)面可獨(dú)立于今日頭條，與其他小程序無(wú)異。

預(yù)測(cè)未來(lái)今日頭條小程序發(fā)展方向會(huì)以內(nèi)容電商變現(xiàn)和支付領(lǐng)域變現(xiàn)為主。以「貓眼電影」為例，如果用戶在今日頭條里寫(xiě)了一篇影評(píng)，以前并沒(méi)有很好的轉(zhuǎn)化方式，現(xiàn)在如果在這篇內(nèi)容里接入「貓眼電影」小程序，用戶看完文章后即可跳轉(zhuǎn)到該電影的購(gòu)買(mǎi)頁(yè)面，完成購(gòu)買(mǎi)。

三、技術(shù)特點(diǎn)

從技術(shù)文檔上看，三種小程序的組件都包含視圖容器、基礎(chǔ)內(nèi)容、表單組件、導(dǎo)航、媒體組件、地圖、畫(huà)布、開(kāi)放能力八種類型。API大致分為網(wǎng)絡(luò)、媒體、文件、數(shù)據(jù)緩存、位置、設(shè)備、界面、開(kāi)放接口、更新、Worker、數(shù)據(jù)上報(bào)、基礎(chǔ)、定時(shí)器、地圖、WXML、畫(huà)布、系統(tǒng)、第三方平臺(tái)、轉(zhuǎn)發(fā)、路由、調(diào)試。不同平臺(tái)的提供其小程序的API會(huì)因平臺(tái)性質(zhì)的不同而有所差異。（三種小程序都有輸入框bug，即input聚焦時(shí)的抖動(dòng)）

一、微信小程序

微信支付支持人臉識(shí)別，小程序之間的跳轉(zhuǎn)，微信運(yùn)動(dòng)（30天之內(nèi)的步數(shù)）。獲取用戶收貨地址，可以調(diào)起用戶編輯收貨地址原生界面，并在編輯完成后返回用戶選擇的地址。同一個(gè)公眾號(hào)下關(guān)聯(lián)的10個(gè)同主體小程序和3個(gè)非同主體小程序之間，可以調(diào)用接口直接相互跳轉(zhuǎn)。小程序之間跳轉(zhuǎn)的功能，使得獨(dú)立的微信小程序不再是孤島。

二、支付寶小程序

支付寶小程序的核心競(jìng)爭(zhēng)力在于支付，小程序提供了跳轉(zhuǎn)支付寶卡包、芝麻認(rèn)證、信用借還等開(kāi)放接口。這也將成為小程序開(kāi)發(fā)者選擇支付寶小程序的主要原因。

相對(duì)于微信小程序，支付寶小程序在底層采用不同的技術(shù)選型，在組件上采用了此前成熟的Ant Design 設(shè)計(jì)，在開(kāi)放API上則面向自身特色能力來(lái)封裝，在框架方面采用開(kāi)源的React/webpack等技術(shù)為基礎(chǔ)，結(jié)合了支付寶自身的多年技術(shù)沉淀來(lái)實(shí)現(xiàn)。

但是從目錄結(jié)構(gòu)上來(lái)看與微信小程序基本一致，幾乎沒(méi)有什么太大的學(xué)習(xí)成本。甚至連更大頁(yè)面跳轉(zhuǎn)深度為5這樣的細(xì)節(jié)規(guī)則都與微信小程序同出一轍。目前能到看到的更大區(qū)別也只是一些命名規(guī)范上的區(qū)別，比如將“wx”換掉。如果你連這些都不想做，還可以到支付寶小程序的社區(qū)來(lái)下載一款“微信小程序轉(zhuǎn)支付寶小程序命令行工具”，批量幫你進(jìn)行處理。

支付寶小程序創(chuàng)建時(shí)的五大坑https://blog.csdn.net/rolan1993/article/details/78060779

微信小程序轉(zhuǎn)支付寶小程序方法：

npm install wx-alipay -g

wxToalipay --src={{小程序源碼目錄}} --dest={{支付寶小程序目錄,可缺省}}

點(diǎn)擊回車后就可將微信小程序轉(zhuǎn)換為支付寶小程序，

注：需要注意的是在轉(zhuǎn)換完成后，由于不完善之處，仍有很多地方需要我們自己去進(jìn)行修改

例如：組件化的使用。需要轉(zhuǎn)換為支付寶的小程序api

選擇器和css3的保持一致。一般有class=”test”類選擇器和id=”test”的id選擇器。

在支付寶小程序的樣式中特殊的地方就是：

※ .a- 或者 .am-為前綴的選擇器已經(jīng)被系統(tǒng)占用所以不要使用；

※ 不能使用屬性選擇器，例如,以下寫(xiě)法不被支持： //這種選擇器不被支持 input[name=“title”]{

color: test; }

三、智能小程序

接入AI能力，為開(kāi)發(fā)者提供身份證的文字識(shí)別，自動(dòng)化、智能化的文本審核，語(yǔ)音合成（將文本轉(zhuǎn)換為可以播放的mp3文件），11種類型的圖像審核，通用物體及場(chǎng)景識(shí)別的圖像識(shí)別功能。

為開(kāi)發(fā)者提供對(duì)接百度搜索生態(tài)的能力，為智能小程序?qū)胨阉髁髁?。?dāng)用戶在百度 App（10.9.5或以上版本）中搜索對(duì)應(yīng)的智能小程序的相關(guān)內(nèi)容時(shí)，小程序的相關(guān)頁(yè)面會(huì)通過(guò)檢索，出現(xiàn)在搜索結(jié)果頁(yè)中。開(kāi)發(fā)者只需要進(jìn)行簡(jiǎn)單的配置工作，就可以使自己開(kāi)發(fā)的智能小程序被百度搜索收錄、分發(fā)。

四、今日頭條小程序

*今日頭條小程序平臺(tái)和官方文檔還未發(fā)布。

四、具體對(duì)比分析

（一）單個(gè)頁(yè)面文件結(jié)構(gòu)

小程序 HTML（結(jié)構(gòu)） JavaScript（邏輯） CSS（樣式表） JSON（配置）

微信小程序 wxml js wxss json

支付寶小程序 axml js acss json

支付寶小程序 swan js css json

ACSS 表示的是原子化 CSS（Atomic CSS），是 Yahoo 提出來(lái)的一種獨(dú)特的 CSS 代碼組織方式。ACSS 的獨(dú)特性在于它挑戰(zhàn)了傳統(tǒng)意義上編寫(xiě) CSS 的更佳實(shí)踐–關(guān)注點(diǎn)分離原則。ACSS 認(rèn)為關(guān)注點(diǎn)分離原則會(huì)導(dǎo)致冗余、繁瑣和難以維護(hù)的 CSS 代碼。

ACS 的原則是把 CSS 樣式打散成盡可能小的部分，每個(gè) CSS 類只對(duì)應(yīng)一條樣式規(guī)則，從而達(dá)到更大化的可復(fù)用性。ACSS 的好處在于所生成的 CSS 文件只包含必須的內(nèi)容，而且冗余很少，可以減少 CSS 文件的尺寸，提高性能。另外 CSS 類所對(duì)應(yīng)的樣式規(guī)則是不變的，這使得在不同的項(xiàng)目和組件之間共享 CSS 變得很容易。

（二）小程序入口

1.微信小程序

微信內(nèi)入口：發(fā)現(xiàn)、搜索欄、群聊、公眾號(hào)文章、二維碼等

2.智能小程序

百度APP入口：個(gè)人中心、搜索、信息流、百家號(hào)文章頁(yè)、二維碼等

百度系A(chǔ)PP：百度貼吧、百度地圖、百度網(wǎng)盤(pán)等

合作伙伴APP：58、嗶哩嗶哩等

平臺(tái)入口：DUER OS、Apollo等

3.支付寶小程序

支付寶客戶端：支付寶首頁(yè)、應(yīng)用中心、消息中心、小程序市場(chǎng)、生活號(hào)、口碑店鋪?lái)?yè)、卡券包

3.今日頭條小程序

今日頭條APP入口：搜索關(guān)鍵詞

三大巨頭小程序入口的設(shè)置，可以看出巨頭們對(duì)于小程序投入的力度。相對(duì)來(lái)說(shuō)，微信非?？粗匦〕绦蜻@一塊，而支付寶和百度則是把它看作是輔助功能的存在，各有各的好處，各有各的出發(fā)點(diǎn)，只要是便于用戶使用，都會(huì)有市場(chǎng)。而今日頭條小程序還處于發(fā)展初期，各方面還未完善。

（三）小程序分享方式

1.微信小程序

只支持微信好友和微信群的分享，不支持朋友圈分享

2.支付寶小程序

支持分享到支付寶動(dòng)態(tài)、支付寶好友、微信、QQ、釘釘、新浪微博，支持生成

二維碼、吱口令

3.智能小程序

支持轉(zhuǎn)發(fā)到百度APP的動(dòng)態(tài)、微信、朋友圈分享

4.今日頭條小程序

今日頭條小程序僅支持分享到微頭條

（四）小程序單位 UI屏幕適配

1.微信小程序

rpx： 1px=2rp，屏幕寬度750rpx

2.支付寶小程序

rpx： 1px=2rp，屏幕寬度750rpx

3.智能小程序

rem： 1px=0.1rem，屏幕寬度3.75rem

（五）直播

1.微信小程序

暫只針對(duì)國(guó)內(nèi)主體如下類目的小程序開(kāi)放，需要先通過(guò)類目審核，再在小程序管理后臺(tái)，“設(shè)置”-“接口設(shè)置”中自助開(kāi)通該組件權(quán)限。并且，僅限于企業(yè)小程序。

2.支付寶小程序

暫不支持

3.智能小程序

限制較少，靈活完備

（六）真機(jī)調(diào)試

1.微信小程序

微信公眾平臺(tái)上將微信賬號(hào)綁定為開(kāi)發(fā)者，保證手機(jī)和開(kāi)發(fā)者工具的微信賬號(hào)都有當(dāng)前小程序的開(kāi)發(fā)者權(quán)限。在微信開(kāi)發(fā)者工具上生成真機(jī)調(diào)試或預(yù)覽二維碼，用手機(jī)微信>掃一掃，即可預(yù)覽。

2.支付寶小程序

支付寶掃一掃

3.智能小程序

可以選擇使用開(kāi)發(fā)者工具和控制臺(tái)兩種方式，進(jìn)行真機(jī)調(diào)試。

1）現(xiàn)在官網(wǎng)的專用的真機(jī)調(diào)試安裝包，安裝針對(duì)智能小程序調(diào)試的百度 App。

2）手機(jī)設(shè)置中，設(shè)置>關(guān)于手機(jī)>版本號(hào) 2）手機(jī)設(shè)置中，設(shè)置>關(guān)于手機(jī)>版本號(hào)

連續(xù)點(diǎn)擊五次進(jìn)入開(kāi)發(fā)者模式，開(kāi)啟 開(kāi)發(fā)者模式>USB調(diào)試（類似于安卓APP的開(kāi)發(fā)）。

3）返回手機(jī)桌面，可以看到百度

App顯示為智能小程序，進(jìn)入APP首頁(yè)下拉進(jìn)入智能小程序。

（七）支付

1.微信小程序

僅限于微信支付（支持人臉識(shí)別驗(yàn)證身份）

2.智能小程序

百度收銀臺(tái)，聚合了主流的百度錢(qián)包、微信、支付寶、網(wǎng)銀等多種支付方式，方便開(kāi)發(fā)者一站式快速接入多種支付渠道。

3.支付寶小程序

直接接入支付寶，其安全性更受用戶信賴。

4.今日頭條小程序

可使用支付寶支付

三種小程序接入支付的計(jì)費(fèi)方式都是按單筆計(jì)算。

（八）小程序?qū)徍耍▋H個(gè)人經(jīng)驗(yàn)）

1.微信小程序

審核迅速，對(duì)頁(yè)面內(nèi)容和功能要求不高，一般兩個(gè)小時(shí)左右過(guò)審

2.支付寶小程序

支付寶審核十分嚴(yán)格，會(huì)對(duì)程序進(jìn)行嚴(yán)格的功能測(cè)試和性能測(cè)試

5.智能小程序

一般需要半個(gè)工作日左右

云邁DIY小程序：https://xcx.yunmell.com

作者：專注于APP定制開(kāi)發(fā)、小程序開(kāi)發(fā)的云邁科技

       云邁科技是一家以提供物聯(lián)網(wǎng)開(kāi)發(fā)、APP開(kāi)發(fā)、小程序開(kāi)發(fā)為主的互聯(lián)網(wǎng)開(kāi)發(fā)公司。以客戶需求為導(dǎo)向，客戶利益為出發(fā)點(diǎn)，結(jié)合自身設(shè)計(jì)及專業(yè)開(kāi)發(fā)優(yōu)勢(shì)，為客戶提供從基礎(chǔ)到落地的一整套解決方案，探索并實(shí)現(xiàn)客戶商業(yè)價(jià)值較大化，為所有謀求長(zhǎng)遠(yuǎn)發(fā)展的企業(yè)貢獻(xiàn)全部力量。如果您想了解更多的功能，可以直接在線咨詢！云邁科技通過(guò)專業(yè)的技術(shù)水平，完善的售后服務(wù)系統(tǒng)，取得了廣大客戶的認(rèn)可！歡迎您的咨詢。