合理使用 App.onLaunch

App.onLaunch是进入小程序的第一个生命周期函数,很多开发者会在App.onLaunch中执行一些初始化操作。如果使用不当,会显著影响首屏显示速度。

# 使用建议

  1. 避免在 App.onLaunch 中执行耗时很长的任务。有可能的话,将任务推移到页面显示完成后执行。
  2. 减少、避免在 App.onLaunch 中调用一些同步 API。使用异步 API 代替同步,并尽量减少、延后首页面显示非必需的 API 调用。
  3. App.onLaunch 中的页面请求放在 Page.onInit 生命周期中:一些开发者为了提前首页面网络请求,会将数据请求代码放到 App.onLaunch 中执行;高版本的基础库提供了 Page.onInit,如果 App.onLaunch 耗时较短,则可以认为将页面网络请求放在自身的 Page.onInit 中,效果与 App.onLaunch 近似。

# 示例

App({
    onLaunch: function () {
        const key = 'app-launch-id';
        // 模拟长任务
        let count = 3000;
        while (count--) {
            const value = swan.getStorageSync(key);
            swan.getStorageSync(key, value ? +value : 1);
        }
    }
});

从下图可以明显地看出,App.onLaunch 的耗时越长,首页面白屏的时间越长。

长耗时的 App.onLaunch(count = 3000)
短耗时的 App.onLaunch(count = 300)