為什么小程序比較快？
安裝包緩存
分包加載
雙線程
webview預加載
native組件
什么是wxs?
https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/
與 WXML 是在同一個線程運行的，避免了跨線程通信的開銷
雙線程
- 邏輯層：創建一個單獨的線程去執行 JavaScript，在這個環境下執行的都是有關小程序業務邏輯的代碼
- 渲染層：界面渲染相關的任務全都在 WebView 線程里執行，通過邏輯層代碼去控制渲染哪些界面。一個小程序存在多個界面，所以渲染層存在多個 WebView 線程
- 雙線程通信
- 在渲染層把 WXML 轉化成對應的 JS 對象。
- 在邏輯層發生數據變更的時候，通過宿主環境提供的 setData 方法把數據從邏輯層傳遞到 Native，再轉發到渲染層。
- 經過對比前后差異，把差異應用在原來的 DOM 樹上，更新界面。
- 優點：不會阻塞，可以有多個webview,頁面切換更流暢
- 缺點：
- 在 page-frame 上無法調用業務 JS。
- 跨線程通信的成本很高，不適合需要頻繁通信的場景。
- 業務 JS 無法直接控制 DOM。
所以引入了wxs
運行機制
冷啟動 熱啟動
更新機制
- 冷啟動時如果發現有新版本，將會異步下載新版本的代碼包，并同時用客戶端本地的包進行啟動，即新版本的小程序需要等下一次冷啟動才會應用上。
- 如果需要馬上應用最新版本，可以使用 wx.getUpdateManager API 進行處理。
運行機制
- 小程序沒有重啟的概念
- 當小程序進入后臺，客戶端會維持一段時間的運行狀態，超過一定時間后（目前是5分鐘）會被微信主動銷毀
- 當短時間內（5s）連續收到兩次以上收到系統內存告警，會進行小程序的銷毀
view
- wcc index.wxml
- wcsc index.wxss
- component 使用Polymer框架實現Web Component
- Native Component 目前Native實現的組件有canvas video map textarea;Native組件層在WebView層之上
webview預加載
每次小程序進入除了當前頁面,Native預先額外加載一個WebView
當打開指定頁面時，用默認數據直接渲染，請求數據回來時局部更新
返回顯示歷史View
退出小程序，View狀態不銷毀
邏輯層
數據綁定 Binding
單向數據流
- 識別哪個UI元素被綁定了相應的對象。
- 監視對象狀態的變化。
- 將所有變化傳播到綁定的視圖上。
生命周期 Life Cycle
渲染層和邏輯層之間通信，是通過 Native 轉發實現的。
邏輯層通過 Page 實例的setData方法傳遞數據到渲染層。由于需要兩個線程的一些通信消耗，為了提高性能，每次只設置需要改變的最小單位數據。
生命周期順序：onLoad -> onShow -> onReady。
mina-lifecycle.png
API
通過WeixinJSBridge和Native 進行通信
路由 Router
小程序優點
- 提前新建WebView，準備新頁面渲染。
- View層和邏輯層分離，通過數據驅動，不直接操作DOM。
- 使用Virtual DOM，進行局部更新。
- 全部使用https，確保傳輸中安全。
- 加入rpx單位，隔離設備尺寸，方便開發。
優化
分包加載
https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages.html
setData原理
setData函數用于將數據從邏輯層發送到視圖層（異步），同時改變對應的this.data的值（同步）。邏輯層需要更改界面時，只要把修改后的 data 通過 setData 傳到渲染層。傳輸的數據，會轉換為字符串形式傳遞，故應盡量避免傳遞大量數據。渲染層會根據前面提到的渲染機制重新生成 VD（虛擬 DOM）樹，并更新到對應的 DOM 樹上，引起界面變化。
一次交互，通過setDATA引起頁面變化，要進過4次通信，強交互的場景會出現卡頓，所以引入原生組件
渲染層 -> Native（點擊事件）。
Native -> 邏輯層（點擊事件）。
邏輯層 -> Native（setData）。
Native -> 渲染層（setData）。
數據預加載 先App中請求數據,在index.js使用數據
安全與管控
- 客戶端系統有 JavaScript 的解釋引擎，則可以創建一個單獨的線程去執行 JavaScript，這個環境下只執行有關小程序業務邏輯的代碼。界面渲染相關的任務呢，就丟到 webview 線程里面，通過邏輯層代碼去控制渲染哪些界面。
- 把開發者的 JS 邏輯代碼放到單獨的線程去運行，因為不在 Webview 線程里，所以這個環境沒有 Webview 任何接口，自然的開發者就沒法直接操作 DOM，也就沒法動態去更改界面或者抓取頁面數據。
- 同時小程序不支持動態載入腳本，XSS 漏洞自然也無縫可鉆
- 官方審核
- 每個微信小程序需要事先設置一個通訊域名，小程序只可以跟指定的域名與進行網絡通信
- 須使用 HTTPS 發起網絡請求。請求時系統會對服務器域名使用的 HTTPS 證書進行校驗，如果校驗失敗，則請求不能成功發起。
- token機制避免CSRF 在小程序中調用wx.login()，能拿到一個code作為用戶登錄憑證（有效期五分鐘）。在開發者服務器后臺，開發者可使用code換取openid和session_key等信息（code只能使用一次）
