朱展：騰訊雲小程序解決方案

歡迎你們前往騰訊雲+社區，獲取更多騰訊海量技術實踐乾貨哦~

朱展，騰訊雲高級工程師，多年先後端開發經驗。目前負責騰訊雲小程序解決方案的演進，規劃和開發。

你們下午好，我今天給你們帶來的分享主題是騰訊雲小程序解決方案。首先作一個自我介紹，我叫朱展，來自騰訊雲，目前負責騰訊雲小程序解決方案，從事設計開發的工做。

開始以前作一個現場的調查，多少人有開發小程序的經驗，請舉手！謝謝！比我想象的多一點，多少人用太小程序的？相信你們都用過。

爲何這麼說你們都用過微信小程序呢？2017年3月份到2017年的11月份的增加趨勢比較平穩，有幾千萬億的量，2017年12月份出現了暴漲，那個點就是小遊戲的發佈，也就是跳一跳成爲國民遊戲的時間，你們都想辦法刷榜。在這個熱點事後，它的日活沒有出現斷崖式的降低，仍是維持到很高的水準，如今的日活大概就是這個樣子。這是咱們今天沙龍的背景。

小程序的架構

講咱們微信小程序解決方案以前，仍是想講一下小程序自己的架構，咱們作移動開發通常有兩個模式，第一種是web應用，也就是原生應用，還有混合式開發模式這兩種模式，它們的特色都是很鮮明的，好比說web應用，不須要安裝，分享起來很方便，傳播性比較好。原生應用通常須要安裝，並且安裝包的大小不等，幾十兆到幾百兆都很正常。

從開發來說，Web應用是免安裝的，原生應用要安裝，須要專業開發，從開發者技能上來講要求比較高。原生應用因爲對開發者要求比較高，它可以充分利用咱們終端的能力，很大的優勢是用戶體驗會比較好；小程序是結合了兩種開發模式的優勢，首先是免安裝的，一個用戶到微信裏面打開小程序，用完就走，不用作什麼安裝的動做。

同時，它的開發模式也是一種類web的模式，它的前端和咱們的h5的前端很類似，用JS開發起來的成本會簡單不少。用戶體驗上能夠媲美原生應用，後面咱們會着重分析一下。最重要的一點，小程序是基於微信這個平臺的，它會享有微信帶來的便利性，它具有跨平臺的開發能力。雖然咱們H5的應用通常來講也會具有跨平臺的能力，可是H5是基於開發web標準的，有過開發經驗的同窗知道，咱們的業務規範是一個漫長的過程，理想是美好的，現實是骨感的。可是小程序就沒有這個問題，微信天生是一個社交的軟件，它的傳播性和可分享意義很是好。咱們能夠經過微信的掃一掃打開小程序，能夠經過羣聊分享一個小程序，好比最近比較火爆的彈一彈小程序，其實它的傳播度很高。

小程序基本架構和用戶體驗

咱們看一下小程序底層的東西和它的用戶體驗，這個圖是小程序的基本架構圖，它的上層分兩塊，一層是是視圖層，也是webviews，另外一塊是線程，邏輯層，也就是appService，這兩層在兩個不一樣的線程裏面處理，跟傳統的web有根本的不一樣。傳統的web渲染的時候，若是邏輯裏面有很複雜的處理，每每會致使界面出現卡頓的現象。小程序沒有這個問題，若是沒有調用一些渲染的東西，不會致使你的界面的流暢度降低。因爲它們在不一樣的線程裏跑，這兩層不能進行直接的交互，必須經過一些手段，好比有一箇中間層去交互，它的基本功能是鏈接JS的運行環境和底層的系統，系統能力能夠實現JS和原生能力的互相調用，兩面的兩層互相通訊，用戶觸發某事件之後就會響應Serverless，若是想去更新界面的某一個內容，微信的api經過調用形式展示出來。

這張圖是介紹小程序渲染的一個圖，編譯打包的階段，咱們編寫小程序的時候會寫一個類WXML的東西，包含一個WCC的編譯工具，用戶在運行這個小程序的時候，會和你的邏輯層傳入的數據作一個編譯，渲染成最終的界面，這就是最簡單的一個局部更新的過程。

這是小程序加載的幾種簡單的示意圖，小程序在手機加載的時候，要在CDN上面拉一個小程序的包，小程序在手機架構的時候可能有一個等待的時間，當此次安裝包緩存到本地之後，下次再打開時候直接從緩存裏面讀取安裝包的內容，若是有新的版本，小程序也不會等新版本更新完了再打開APP，而是直接用上一層緩存的小程序，等你再啓動的時候，使用新的安裝包替換舊的。

冷加載和熱加載的區別

熱加載是小程序推出以後，咱們在系統層面實現的東西，小程序跑的線程是在後臺運行的，沒有被銷燬的，這個時間大概是5分鐘左右。在這個時間內，你訪問小程序的時候，直接從後臺遷到前臺，成本相對比較低。

小程序還提供了一個Webview預加載的性能，除了當前看到的Webview的視圖之外，在後臺還能夠看到一個新的Webview，你切換的時候，由於Webview的初始化時間比較費性能的，在小程序這個級別，若是想達到比較順滑的體驗，須要作一些預處理。

小程序開發者在服務端會面臨的問題

除了保障小程序的流暢性之外，小程序還提供一些原生的組件，有過H5開發經驗的都知道，有時候寫比較長的列表和H5應用，和一些原生應用的對比很明顯，H5的表滑動的時候，特別是對一些老的安卓系統感受很明顯。既然體驗達不到個人要求，就用原生組件代替Web組件。

小程序爲何這麼快？剛纔提到了安裝包緩存，分包加載。小程序解決方案進化歷程，小程序是客戶端的一種新的創新，我猜小程序的開發者多半是web前端，或者是終端開發人員，他們可能對小程序的服務端有些欠缺。

咱們總結了一下，小程序開發者在服務端會面臨一些問題，好比說要處理不少非業務性的邏輯。舉個例子來講，若處理一個用戶登錄，在小程序這裏要考慮會話怎麼保存？你和客戶端的協議怎麼樣？你還要了解服務器的應用知識，你的服務器怎麼配，你的服務器怎麼擴容，個人小程序爆款怎麼辦？對於一些有開發經驗的開發者來講不是問題，對於更多的客戶端的開發同窗，這些都是很棘手的問題，對整個體系要了解。就拿登陸舉個例子，下面這張圖是微信官方提供的登錄流程圖，這個圖看起來有點複雜，若是細緻瞭解就知道它要作什麼，有沒有更好的辦法呢？這個圖上的一些難點在這兒，微信登錄的時候，小程序發起的時候到服務器端，怎麼作會話的協議？服務器端怎麼存？微信提供了一個APP存在哪兒？還有用戶須要保存的，你若是存就會帶來安全問題，用微信推薦的方案，你本身都要去處理。

第二個場景是Websocket信道服務，開發成本高；穩定性難保證；各類異常狀況須要考慮，與業務耦合高。

Wafer解決方案

針對這些狀況，咱們在2016年的時候推出來了一個叫Wafer的解決方案，拿剛纔的會話場景來講，咱們叫wafer的會話服務器，封裝複雜邏輯，兼顧安全性和便利性，只關注咱們提供的幾個接口就好了。咱們這個會話服務器，也是支持獨立的，能夠方便地作一個橫向的擴展。

針對剛纔提到的Websocket，提出一個信道服務器，它是一個paas級的應用，給每一個開發者提供惟一的訪問地址，供開發者在程序裏面使用，小程序和信用服務器，獲取websocket，而後是到業務服務器。

總結起來有這幾點：配合SDK無需開發，直接使用；平臺提供穩定性和性能保障；自動實現斷線重連；獨立信用服務器，消息搬運工。

Wafer架構

這是當時wafer提的一個架構圖，由於咱們wafer1當時提出來，是針對企業客戶的，比較看中安全性的擴展性，在這方面作了不少的工做，咱們把信道服務器單獨提出來，這個方案如今看起來有點問題，特別是在微信開放，當小程序開發我的註冊以後，它的問題就浮現出來了，好比說架構太不專業了，每個節點都須要負載均衡，證書也須要本身處理。wafer的服務器須要各個開發者本身去管理，代碼須要本身去部署。

針對wafer1不足之處，咱們在2017年上半年提出wafer2的解決方案，它是wafer1的簡化版，把wafer1作了一些簡化合並，兼顧的安全性和便利性，好比說它把會話服務器和業務服務器作了合併；在wafer1時代咱們會讓用戶自行部署他的服務器，如今在這兒咱們進行託管式的管理，用戶能夠購買本身的服務器，可是不須要作服務器端的配置，還會自動免費部署SSL證書，咱們和微信作一個深度的合做，把wafer2的解決方案提進微信開發者空間裏去。

這個圖是微信開發者工具的界面，右上方有騰訊雲的一些功能和有一些解決方案，好比說上傳代碼到開發環境，使用devtools啓動單步調試等。

針對開發環境咱們免費提供免費的域名，一鍵分配運行環境，經過一系列的綁定和關聯以後免費搭起小程序基本的框架。

系統支持針對Node.js遠程調試，試工具集成，支持設置斷點，查看變量值，它的功能很強大，用過的人都說好。

咱們也把騰訊雲的一些特色和亮點，以及比較有特點的能力，經過API的形式暴露給小程序開發者，經過一個接口完成身份證識別的功能和圖片OCR的識別功能。

智能語音咱們經過API的形式暴露給開發者，你只須要調一個接口，就能夠完成語音轉文字的功能。

操做過程

如今介紹一下操做過程，咱們使用wafer2把騰訊雲賬號和小程序的賬號作一個關聯，建立一個小程序的號碼，有客戶代碼和服務器代碼。客戶端代碼和服務器代碼的地址，小程序編譯的時候就知道上傳到雲服務器上，這些都是界面的功能，上傳之後仍是支持安裝包，以及安裝後重啓的功能。

剛纔提到了免費分配域名，須要在客戶端配置域名之後快速的搭建小程序的先後臺，按照這個流程來，整個過程大概10分鐘左右。咱們也提供了多種demo，供你們瞭解騰訊雲的使用方法，用到上傳服務器和上傳圖片的功能。

介紹完wafer2以後，咱們就在想，咱們還可以作一些什麼？由於wafer2爲開發者封裝了不少功能，好比說咱們的登錄，還有信道服務器，還須要開發者本身部署服務，雖然咱們作了一些託管，可是你還要考慮服務器的擴能，或者是負載均衡，咱們在想登錄不用本身的服務器就能夠登錄，並且直接託管到咱們的雲端，能不能不用本身寫服務器的運行環境，直接放在咱們的雲函數上面。這也是咱們後面一段時間的研究方向。

Q/A

Q：剛纔有提到信道服務，若是做爲企業的話，數據放在私有云裏面，是否是理解全部的信道服務都放在騰訊雲上面？
A：對的，可是您的數據咱們不會存儲的。

Q：剛纔wafer2有一個服務器存在的，能夠登錄嗎？
A：不能夠，本身部署服務器有不少環境的問題。

Q：Node.js和PXP在網上也炒做很厲害，能不能在各個方面作一個比較嗎？最後給一個建議，到底哪一個比較好一些？或者Node.js有沒有坑？
A：對於我來講，這兩種語言，我本身是沒有偏好的，我會看開發者的偏好，可是從能力上來講，其實咱們在微信開發小程序裏面，提供了js的功能，這個問題沒有辦法正面回答你。

Q：若是這兩種方案，Node.js和pxp哪種比較好？
A：Node.js它是一個比較新的技術架構，Pxp是偏向傳統的，要根據你的業務場景作分析。

更多分享資料，請戳下面的連接：
小程序雲端解決方案.pdf

問答
微信小程序如何與數據庫交互？
相關閱讀
黃文俊：Serverless小程序後端技術分享
施德來：有贊電商小程序的實踐
鄒偉：如何開發一款小遊戲

此文已由做者受權騰訊雲+社區發佈，原文連接：https://cloud.tencent.com/dev...