小程序無(wú)需下載，通過(guò)搜索和掃一掃就可以打開(kāi)，截止2021年微信已擁有超12億的用戶(hù)量，毫不夸張的說(shuō)小程序已經(jīng)成為了我們生活中的一部分，對(duì)于中小企業(yè)它有著巨大的優(yōu)勢(shì)，由于小程序有微信這個(gè)龐大的流量入口，因此獲取流量的方式也變得簡(jiǎn)單了，不像APP一樣，需要巨大的推廣費(fèi)，且適用于各個(gè)行業(yè)。因此小程序開(kāi)發(fā)就成為前端開(kāi)發(fā)工程師必備技能。本節(jié)來(lái)講一下小程序的運(yùn)行原理。

微信小程序采用 JavaScript、WXML、WXSS 三種技術(shù)進(jìn)行開(kāi)發(fā)，從技術(shù)講和現(xiàn)有的前端開(kāi)發(fā)差不多，但深入挖掘的話(huà)卻又有所不同。

?

JavaScript：首先 JavaScript 的代碼是運(yùn)行在微信 App 中的，并不是運(yùn)行在瀏覽器中，因 此一些 H5 技術(shù)的應(yīng)用，需要微信 App 提供對(duì)應(yīng)的 API 支持，而這限制住了 H5 技術(shù)的應(yīng)用，且 其不能稱(chēng)為嚴(yán)格的 H5，可以稱(chēng)其為偽 H5，同理，微信提供的獨(dú)有的某些 API，H5 也不支持或支 持的不是特別好

WXML：WXML 微信自己基于 XML 語(yǔ)法開(kāi)發(fā)的，因此開(kāi)發(fā)時(shí)，只能使用微信提供的現(xiàn)有 標(biāo)簽，HTML 的標(biāo)簽是無(wú)法使用的。

WXSS：WXSS 具有 CSS 的大部分特性，但并不是所有的都支持，而且支持哪些，不支 持哪些并沒(méi)有詳細(xì)的文檔。

另外微信的架構(gòu)，是數(shù)據(jù)驅(qū)動(dòng)的架構(gòu)模式，它的 UI 和數(shù)據(jù)是分離的，所有的頁(yè)面更新，都需要通過(guò)對(duì)數(shù)據(jù)的更改來(lái)實(shí)現(xiàn)。小程序分為兩個(gè)部分 webview 和 appService。其中 webview 主要用來(lái)展現(xiàn) UI，appService 有來(lái)處理業(yè)務(wù)邏輯、數(shù)據(jù)及接口調(diào)用。它們?cè)趦蓚€(gè)進(jìn)程中運(yùn)行，通過(guò)系統(tǒng)層 JSBridge 實(shí)現(xiàn)通信， 實(shí)現(xiàn) UI 的渲染、事件的處理。