技術文：微信小程序在微信APP裏如何運行的？

小程序是如何在微信 App 裏運行的呢？

微信 App 裏包含 javascript 運行引擎。

微信 App 裏包含了 WXML/WXSS 處理引擎，最終會把界面翻譯成系統原生的控件，並展現出來。這樣作的目的是爲了提供和原生 App 性能至關的用戶體驗。

咱們來模擬下小程序加載運行的過程：

用戶點擊打開一個小程序

微信App從微信服務器下載這個小程序

分析 app.json 獲得應用程序的配置信息（導航欄，窗口樣式，包含的頁面列表等）

加載並運行 app.js

加載並顯示在 app.json 裏配置的第一個頁面

這個只是從開發者眼中看到的一個簡化版的過程，實際過程應該比這要複雜得多，涉及到瀏覽器線程（就是運行咱們的邏輯層代碼 app.js 等的線程）和 AppService 線程之間的交互。從官方網站上的一個圖片能夠看出端倪：

微信 App 是如何與小程序的邏輯層 javascript 交互的呢？能夠簡單地概括以下：

JavaScript 是腳本語言，能夠在運行時解釋並執行。微信 App 裏包含了一個 JavaScript 引擎，由它來負責執行邏輯層的 JavaScript 代碼。那麼 JavaScript 調用的小程序相關 API 怎麼實現的呢？答案是最終會被翻譯成實如今微信 App 裏的原生接口。好比開發者調用 wx.getLocation(OBJECT) 獲取當前地理位置，微信 App 裏的 JavaScript 引擎在執行這個代碼時，會去調用微信 App 裏實現的原生接口來獲取地理位置座標。

從以上流程能夠看出，微信小程序的運行環境應該更相似於 ReactNative，而不是純Html5。二者最大的不一樣在於，ReactNative 的界面是由原生控件渲染出來的，而 Html5 的界面是由瀏覽器內核渲染出來的。二者在性能上有較大的差別。

微信小程序最大的好處是不須要作設備適配，只要微信能運行，小程序就能運行。

「H5程序俱樂部」是一個專一微信小程序學習交流，相關外包/招聘需求信息發佈的微信公衆號。

「H5程序俱樂部」微信號：wxappclub 或者 微信掃一掃關注