近日，移動開發平台 mPaaS 體驗入口正式上線「知曉雲」官網，使用者進入控制台建立應用後，即可體驗嘗鮮。
而本文也将從 mPaaS 小程式架構解析展開，分享其如何幫助開發者實作“小程式代碼僅需開發一次，便可多端投放”的效果。
前言
本文将從以下兩個方面展開分享：
- 支付寶小程式架構的系統介紹（支付寶小程式架構概述、應用層架構、Native SDK）
- mPaaS 技術架構與助力（mPaaS 小程式、mPaaS 小程式 IDE、mPaaS MDS）
我們将從支付寶小程式架構的設計原理入手，回顧其演進路徑及具體的優化政策。同時，為滿足開發者實作在自有 App 内投放小程式的需求，mPaaS 小程式嘗試針對小程式 SDK 完成瘦身、去依賴。借助 mPaaS 小程式，可以做到一套小程式代碼，在支付寶和自己的 App 中雙端投放和運作，甚至建構出自己的小程式生态體系。
小程式簡介：移動網際網路新熱點
近來，小程式俨然成為了移動網際網路的新熱點。繼 2017 年初微信正式推出微信小程式後，各個大廠陸續釋出了各自的小程式 —— 支付寶小程式、百度小程式、頭條小程式，小程式成為了各家移動網際網路生态布局的重要一環。通過小程式生态可以引入大量的外部服務，不僅豐富了平台的能力，而且可以為平台帶來大量的使用者流量，進而使得平台具備無限的潛能。
支付寶小程式簡介
支付寶小程式是一種全新的開發模式，它運作在支付寶用戶端，可以被便捷地擷取和傳播，為終端使用者提供更優的使用者體驗。為友善小程式的開發者，支付寶小程式具有類似微信小程式的 DSL 和開發環境，降低小程式開發者的學習成本。
支付寶小程式架構淺析
基礎需求
小程式的本質需求是讓第三方開發者可以接入，使得第三方開發的小程式可以在平台級應用中運作。對于這個需求，最簡單的實作方案是：讓外部開發者開發純 HTML5 應用，在應用的 HTML5 容器裡打開，容器提供一些原生的接口供 HTML5 使用。比如在支付寶和微信上的“滴滴出行”以 HTML5 的形式運作在各自的平台中，這種模式看似還不錯，但是實際上這種簡單的方案不能滿足這兩個小程式的基礎需求：
- 體驗，作為一個“小程式”需要讓體驗接近原生，而上述像滴滴出行這些普通 HTML5 的體驗不太行，包括啟動速度、頁面切換流暢度都有問題，跟原生體驗沒法比。
- 管控，作為一個平台必須對接入的應用有管控能力，必須能盡量精确控制應用的内容和類型，畢竟若出現非法應用平台是要承擔責任的，HTML5 的方式太過自由，開發者可以随時改變整個應用的内容，平台難以檢測到這些改變，無法管控。另外 HTML5 開發品質參差不齊，平台也無法管控。
架構概述
為了實作小程式并滿足上述的小程式的兩個需求，小程式架構應用而生。我們先看下小程式架構大圖，自上而下看。
- 小程式代碼，這是小程式開發者使用小程式 DSL 及各種元件開發的小程式。
- 小程式元件及 API，這是小程式的元件及 API 層，提供了小程式所需的各種元件和小程式 API。小程式開發者隻需要在基于這一層提供的元件及API進行小程式的開發。
- 小程式應用層架構，這是小程式運作的架構層，它基于 React 實作了小程式的運作架構。該層主要包含小程式的邏輯處理引擎及渲染層。
- Native SDK，該層提供了小程式所需的 Native 能力，通過 JavaScriptCore 為小程式的 JS 層架構提供大量的Native API，此外該層還提供了小程式包管理、背景保活等能力等基礎能力。
- React 和 React Native，這一層是小程式底層運作環境，分别對應于 Web 和 Native 環境，使得小程式可運作在 WebView 和 iOS/Android 上。
- 系統層，即 Web 核心、iOS 和 Android，是系統級的平台層。
目前支付寶的小程式使用的是 React 版，螞蟻内部的其他 APP 有在使用 React Native 版的小程式。
應用層架構
我們一起看下小程式應用層架構。每個小程式的代碼分為兩部分——邏輯處理和視圖渲染，分别運作在 Worker (js 引擎) 以及 Render （渲染層）中。
- Worker 運作小程式的邏輯處理代碼，包括事件處理，API 調用以及架構的生命周期管理。Worker 隻有一個，友善 app 資料在頁面間的共享和互動。
- Render 運作小程式的渲染代碼，主要包括模版、樣式和架構的跨終端的 js 元件或 Native 元件，擷取邏輯層的資料操作渲染引擎(React/ReactNative)進行渲染，Render 在小程式中可以有多個。
- Worker 和所有的 Render 都建立連接配接，将需要渲染的資料傳遞給對應的 Render 進行渲染，worker 也會将 api 調用轉給 Native SDK 處理。
- Render 則将元件的觸發事件送到對應的 Worker 處理，同時接受 worker 的調用進行重新渲染。render 可以看作一個無狀态的渲染終端，小程式的狀态都保留在 Worker 内。
可見該架構可以做到，JS 邏輯代碼與頁面渲染分離并行執行，不會出現 JS 代碼執行時卡住頁面渲染的情況，進而提升渲染性能。多個頁面可以共享一個 JS 運作環境，資料可以很友善地共享，整個小程式生命周期裡共享同一個上下文，更接近 APP 的開發體驗。小程式的模闆樣式是自定義的格式，這樣可以做到開發時使用固定的DSL，不依賴底層的渲染引擎，這樣引擎的優化更新不會造成上層的小程式代碼的不相容，并且渲染行為是完全是可控的。
Native SDK
我們再看Native層，在支付寶中是由 Nebula H5 容器負責實作，它為小程式提供Native 能力，為小程式提供的包管理、背景保活等功能。
- Native api，小程式調用的api中有部分功能需要在native中實作，這部分api通過橋接調用進入對應的native api。
- 包管理，負責小程式包的下載下傳、存儲、加載。小程式包的下載下傳具有多種政策，可以滿足小程式的預下載下傳、強制更新等需求。
- 背景保活，小程式在背景可以存活5分鐘，使得使用者在下次打開時可以獲得更好的體驗。
小結
現在讓我們回到前面提到的兩個小程式的基本需求，體驗和管控。我們看下架構是如何實作這兩個需求的。對于體驗需求，主要有以下幾點：
- 架構對小程式做了邏輯處理和視圖渲染的分離以提升渲染性能
- 對于較重的元件（地圖）使用 Native 實作以提升性能
- 小程式公共資源預置在小程式架構以提升加載性能
- 背景保活機制提高二次啟動速度
對于管控需求，主要有兩點：
- 小程式開發隻能使用架構提供的自定義的模闆樣式
- JS 代碼運作在與 Webview 隔離的 JS 引擎中，無法操作浏覽器 DOM
mPaaS 技術架構與助力
支付寶小程式與 mPaaS
小程式這麼有優勢，那能否把支付寶小程式放到其他 APP 中運作呢？答案是肯定的，借助 mPaaS，小程式技術不僅在螞蟻金服内部使用，也能夠提供給外部使用者使用。
首先簡單介紹下什麼是 mPaaS，mPaaS 全稱是 Mobile Platform as a Service，即移動端的 PaaS 。是螞蟻金服獨創的移動研發平台，它源于支付寶近 10 年的移動技術的沉澱，為移動開發、測試、營運及運維提供雲到端的一站式解決方案，能有效降低技術門檻、減少研發成本、提升開發效率，協助生态夥伴快速搭建穩定高品質的移動 APP。
mPaaS 小程式
再來看下什麼是 mPaaS 小程式，它是在支付寶小程式的基礎上做了瘦身、去依賴的小程式 SDK，為了能便捷的輸出給其他 APP 快速地搭建出小程式平台。它保持和支付寶小程式一樣的模闆樣式和通用 API，僅僅少量的像授權這樣的開放的 API 需要客戶自定義開發。借助 mPaaS 小程式，可以做到一套小程式代碼，在支付寶和自己的 APP 上雙端投放和運作，甚至可以建構出自己的小程式生态體系。
mPaaS 小程式 IDE
小程式的開發除了可使用支付寶小程式開放平台提供的 IDE，還可以使用 mPaaS 版的小程式 IDE。通過 mPaaS 版的 IDE 可以導出本地的小程式包，後續在 mPaaS 釋出平台中使用這個本地包直接釋出。未來，小程式 IDE 将會與 mPaaS 直接打通，在 IDE 中可以直接完成 mPaaS 小程式的開發、測試和釋出這一系列的開發運維體驗。
mPaaS MDS
小程式技術的一個基礎的能力，就是小程式釋出系統。mPaaS 小程式的釋出服務是由 mPaaS 的移動釋出系統（MDS）提供的。MDS 提供多種釋出政策，能夠在正式釋出之進行多種類型的灰階。MDS 提供增量差分包更新能力，可減少更新包的體積，在移動端網絡不穩定場景中發揮優勢。
mPaaS MDS 控制台
目前，衆多開發者均基于 mPaaS 小程式實作了自身 App 業務子產品小程式化。借助小程式的開發标準快速覆寫 Android/iOS 雙端，小程式的文法并不難，對于新手而言上手也很快。
其中 CSDN App 即一個成功的案例，借助 mPaaS 小程式輕松地實作多個業務子產品改造，不僅獲得媲美原生應用的使用者體驗，同時有效規避“發版周期長”、“無法快速線上修複 Bug”等弊端，實作真正的動态與釋出能力。
當然 mPaaS 小程式帶來的驚喜不止如此，與支付寶小程式 1:1 的架構設計使得它能夠與衆多支付寶自研的端上能力無縫相容，除了釋出包大小得到了極緻優化進而節省流量和存儲，更可幫助開發者一鍵投放小程式至支付寶、淘寶，甚至轉成 HTML5 頁面。
END
關于知曉雲：cloud.minapp.com
知曉雲是專注于小程式開發的後端雲服務。
通過 Baas、FaaS 組合為小程式開發者提供最低門檻的Serverless 無服務架構接入體驗，它免去了小程式開發中伺服器搭建、域名備案、資料接口實作等流程，緻力于讓開發者更專注于業務邏輯的實作。