小程序啟動(dòng)加載實(shí)現(xiàn)原理

運(yùn)行機(jī)制

小程序啟動(dòng)會(huì)有兩種情況，一種是「冷啟動(dòng)」，一種是「熱啟動(dòng)」。 假如用戶已經(jīng)打開過某小程序，然后在一定時(shí)間內(nèi)再次打開該小程序，此時(shí)無需重新啟動(dòng)，只需將后臺(tái)態(tài)的小程序切換到前臺(tái)，這個(gè)過程就是熱啟動(dòng)；冷啟動(dòng)指的是用戶首次打開或小程序被微信主動(dòng)銷毀后再次打開的情況，此時(shí)小程序需要重新加載啟動(dòng)。

更新機(jī)制

小程序冷啟動(dòng)時(shí)如果發(fā)現(xiàn)有新版本，將會(huì)異步下載新版本的代碼包，并同時(shí)用客戶端本地的包進(jìn)行啟動(dòng)，即新版本的小程序需要等下一次冷啟動(dòng)才會(huì)應(yīng)用上。 如果需要馬上應(yīng)用最新版本，可以使用wx.getUpdateManager API 進(jìn)行處理。

運(yùn)行機(jī)制

• 小程序沒有重啟的概念
• 當(dāng)小程序進(jìn)入后臺(tái)，客戶端會(huì)維持一段時(shí)間的運(yùn)行狀態(tài)，超過一定時(shí)間后（目前是5分鐘）會(huì)被微信主動(dòng)銷毀
• 當(dāng)短時(shí)間內(nèi)（5s）連續(xù)收到兩次以上收到系統(tǒng)內(nèi)存告警，會(huì)進(jìn)行小程序的銷毀

四、View (頁面視圖)

視圖層由 WXML 與 WXSS 編寫，由組件來進(jìn)行展示。

將邏輯層的數(shù)據(jù)反應(yīng)成視圖，同時(shí)將視圖層的事件發(fā)送給邏輯層。

1、View - WXML

wxml編譯器：wcc 把wxml文件 轉(zhuǎn)為 js 執(zhí)行方式：wcc index.wxml

2、View - WXSS

• WXSS(WeiXin Style Sheets)
• wxss編譯器：wcsc 把wxss文件轉(zhuǎn)化為 js 執(zhí)行方式： wcsc index.wxss

3、View - Component

• 小程序的組件基于Web Component標(biāo)準(zhǔn)

• 使用Polymer框架實(shí)現(xiàn)Web Component

4、View - Native Component

• 目前Native實(shí)現(xiàn)的組件有 <canvas/> <video/> <map/> <textarea/>
• Native組件層在WebView層之上

五、WebView預(yù)加載

每次小程序進(jìn)入除了當(dāng)前頁面,Native預(yù)先額外加載一個(gè)WebView

當(dāng)打開指定頁面時(shí)，用默認(rèn)數(shù)據(jù)直接渲染，請(qǐng)求數(shù)據(jù)回來時(shí)局部更新

返回顯示歷史View

退出小程序，View狀態(tài)不銷毀

六、App Service(邏輯層)

邏輯層將數(shù)據(jù)進(jìn)行處理后發(fā)送給視圖層，同時(shí)接受視圖層的事件反饋

1、App( ) 小程序的入口；Page( ) 頁面的入口

3、提供豐富的 API，如微信用戶數(shù)據(jù)，掃一掃，支付等微信特有能力。

4、每個(gè)頁面有獨(dú)立的作用域，并提供模塊化能力。

5、數(shù)據(jù)綁定、事件分發(fā)、生命周期管理、路由管理

運(yùn)行環(huán)境

IOS - JSCore

Android - X5 JS解析器

DevTool - nwjs Chrome 內(nèi)核

1、App Service - Binding

• 數(shù)據(jù)綁定使用 Mustache 語法（雙大括號(hào)）將變量包起來，動(dòng)態(tài)數(shù)據(jù)均來自對(duì)應(yīng) Page 的 data，可以通過setData方法修改數(shù)據(jù)。
• 事件綁定的寫法同組件的屬性，以 key、value 的形式，key 以bind或catch開頭，然后跟上事件的類型，如bindtap, catchtouchstart，value 是一個(gè)字符串，需要在對(duì)應(yīng)的 Page 中定義同名的函數(shù)。

2、App Service - Life Cylce

3、App Service - API

API通過WeixinJSBridge和Native 進(jìn)行通信

4、App Service - Router

• navigateTo(OBJECT)

保留當(dāng)前頁面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁面，使用navigateBack可以返回到原頁面。頁面路徑只能是五層

• redirectTo(OBJECT)

關(guān)閉當(dāng)前頁面，跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁面。

• navigateBack(OBJECT)

關(guān)閉當(dāng)前頁面，返回上一頁面或多級(jí)頁面?？赏ㄟ^ getCurrentPages()) 獲取當(dāng)前的頁面棧，決定需要返回幾層。