經過頁面預加載（preload）提高小程序的響應速度

GitHub: https://github.com/WozHuang/mp-extend

主要目標

若是小程序在打開新頁面時須要經過網絡請求從接口中獲取所用的數據，在請求完成以前頁面都會由於沒有數據而呈現一片空白，解決這個問題常見的解決方案有：

1. 先使用從緩存中取出上一次的數據，等到請求結束後再使用請求獲得的數據（這個對於變更不大的數據是徹底可行的，可是對於變更大或者之內容爲主的功能並不合適）

2. 在加載時顯示骨架屏（知乎和餓了麼的移動端有的地方是這麼作的）

3. 前一個頁面預加載下一個頁面的數據，達到秒開的效果

很明顯，緩存並不普遍適用，骨架屏只是一個比loading圖標好看的佔位符，而預加載可以徹底符合要求。

可是在小程序中若是要實現預加載的功能便須要在頁面中操做其餘頁面（包括尚未建立實例的頁面），會使代碼嚴重耦合，不利於維護，須要一個更清晰的結構來實現預加載功能。

設計思路

1. 小程序中實現預加載能力的關鍵即是可以調用其餘頁面的函數，須要獲取其餘頁面對象。可是部分頁面尚未加載出來，getCurrentPages方法獲取不到，所以須要把被預加載的頁面的PageOption（就是在建立頁面時傳入Page函數的對象）給保存起來

2. 那些沒有被建立的頁面並無setData方法，須要模擬一個setData方法，把獲取到的數據暫存起來，在onLoad階段再調用 setData呈現到視圖上

3. 頁面應當能夠主動被預加載，可是在沒有被預加載的時候也應該可以正常打開

源碼實現

preload源碼依賴於mp-extend提供的全局混入能力。

1. 重寫Page函數，保存須要預加載頁面的PageOption

2. 擴展小程序頁面的生命週期 onPreload，與onLoad功能功能基本相同，可以接收來自url的參數，在主動預加載時被調用

3. 提供 this.$preload(url) 方法，用於主動預加載某個頁面，若是頁面實例未建立就把預加載的數據保存起來，等到頁面onLoad時再調用setData呈現到視圖上

最終效果

參考資料

wxpage
微信小程序之提升應用速度小技巧