微信小程序的線程架構

小程序的線程架構

每一個小程序包含一個描述總體程序的app實例和多個描述頁面的page。

其中app由3個文件構成：

app.json 公共配置文件

app.wxss 公共樣式文件

app.js 主體邏輯文件

page頁面最多由4個文件構成：

page.jason 頁面配置

page.wxml 頁面結構

page.wxss 頁面樣式

page.js 頁面主體邏輯

app.js和page.js中包含小程序在生命週期的每一個階段相應的事件。

典型的app.js代碼結構以下：

App({
    onLaunch:function(){
        //小程序啓動時執行的初始化工做
    },
    onShow:function(){
        //程序啓動或從後臺進入前臺時，觸發執行的操做
    },
    onHide:function(){
        //程序從前臺進入後臺時，觸發執行的操做
    },
globalConf:{
    indexDate:'',
    matchData:''
},
dataCache:{},
globalData:''
})

典型的page.js代碼結構以下：

Page({
    Data:{

}
    onLoad:function(){
        //頁面加載時，執行的初始化工做
    },
    onReady:function(){
        //頁面就緒後，觸發執行的操做
    },
    onShow:function(){
        //頁面打開時，觸發執行的操做
    },
    onHide:function(){
        //頁面隱藏時，觸發執行的操做
    },
    onUnload:function(){
        //頁面關閉時，觸發執行的操做
    },
    //Events handler
        viewTap:function(){
            this.setData({
                text:'set some data for updating view.'
            })
}
})

 一個完整的小程序執行的過程或生命週期以下：

app.onLaunch-->app.onShow-->page1.onLoad-->page1.onShow-->page1.onReady

(打開程序，第一個頁面page1加載完成)

-->page1.onHide-->page2.onLoad-->page2.onShow-->page2.onReady 

(從第1個頁面打開第2個頁面)

-->page2.onUnload-->page1.onShow-->...-->app.onUnload 

(關閉page2，返回page1...退出小程序)

 

一個page的生命週期開始於onLoad事件，在整個生命週期內onLoad、onReady、onUnload這三個事件各執行一次，onHide和onShow事件在每次頁面隱藏和顯示時都會觸發。

當用戶手動觸發小程序的退出箭頭時，小程序僅觸發app.Hide，下次進入小程序時會觸發app.onShow以及當前頁的page.onShow。僅當小程序在後臺運行超過必定時間未被喚起、或者用戶手動在小程序的控制欄裏點擊退出程序、或者小程序內存佔用過大被系統關閉時，小程序將被銷燬，會觸發app.onUnload事件。

每一個小程序分爲2個線程，view與appServer。

view 線程	appServer線程
.wxml + wxss   ios:safari Android:X5瀏覽器 開發工具：chrome	.js   ios:JavaScriptCore Android:X5內核 開發工具：nwjs

 

view線程負責解析渲染頁面（wxml和wxss文件）。

appServer線程負責運行js。appServer線程運行在jsCore（安卓下運行在X5中，開發工具運行在nwjs中）。因爲js不跑在WebView裏，就不能直接操縱DOM和BOM，這就是小程序沒有window全局變量的緣由。