注冊

小程序啟動加載實現(xiàn)原理

2020-09-27
導(dǎo)讀:運行機制 小程序啟動會有兩種情況,一種是「冷啟動」,一種是「熱啟動」。 假如用戶已經(jīng)打開過某小程序,然后在一定時間內(nèi)再次打開該小程序,此時...

運行機制

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

更新機制

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

運行機制

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

 

四、View (頁面視圖)

視圖層由 WXML 與 WXSS 編寫,由組件來進行展示。

將邏輯層的數(shù)據(jù)反應(yīng)成視圖,同時將視圖層的事件發(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標準

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

 

4、View - Native Component

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

 

五、WebView預(yù)加載

每次小程序進入除了當前頁面,Native預(yù)先額外加載一個WebView

當打開指定頁面時,用默認數(shù)據(jù)直接渲染,請求數(shù)據(jù)回來時局部更新

返回顯示歷史View

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

六、App Service(邏輯層)

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

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

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

4、每個頁面有獨立的作用域,并提供模塊化能力。

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

運行環(huán)境

IOS - JSCore

Android - X5 JS解析器

DevTool - nwjs Chrome 內(nèi)核

1、App Service - Binding

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

 

2、App Service - Life Cylce

 

3、App Service - API

API通過WeixinJSBridge和Native 進行通信

 

4、App Service - Router

  • navigateTo(OBJECT)

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

  • redirectTo(OBJECT)

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

  • navigateBack(OBJECT)

關(guān)閉當前頁面,返回上一頁面或多級頁面。可通過 getCurrentPages()) 獲取當前的頁面棧,決定需要返回幾層。

重磅推薦:小程序開店目錄

第一部分:小商店是什么

第二部分:如何開通一個小商店

第三部分:如何登錄小商店

第四部分:開店任務(wù)常見問題

第五部分:小商店可以賣什么

第六部分:HiShop小程序特色功能

第七部分:小程序直播

第八部分:小程序收貨/物流

第九部分:小程序怎么結(jié)算

第十部分:小程序客服

第十一部分:電商創(chuàng)業(yè)

第十二部分:小程序游戲開發(fā)