# Code injection optimization

Optimizations for Mini Program code injection can be obtained fromOptimizing code volumeandOptimized execution timeTwo angles.

# 1. use[Injection on demand]((ability/lazyload#Injection on demand))

Recommended for all Mini programs

Typically, at Mini Program startup, all of the code packages that the launch page depends on (master package, subcontract, plugin package, extension library, etc.) JS The code is injected into all of them, including other pages that are not visited and custom components that are not used. JS The code will be executed immediately. This causes a lot of unused code to be injected into the Mini Program runtime environment, affecting injection time and memory footprint.

Self-base library version 2.11.1 Up, can be opened byInjection on demandFeature reduces the startup time and runtime memory of Mini Programs by avoiding unnecessary code injection and execution.

{
  "lazyCodeLoading": "requiredComponents"
}

Note: With on-demand injection enabled, the page JSON All components defined in the configuration and app.json in usingComponents Configured global custom components are treated as dependencies of the page and injected and loaded. Suggest that the developerTimely removal JSON A declaration that custom components are not used in, and try toAvoid declaring low-usage custom components globally, otherwise it may affect the effect of on-demand injection.

# 2. use[Time injection]((ability/lazyload#Time injection))

After opening the aboveInjection on demandCharacteristics under the premise that can be achieved byTime injectionFeature allows some custom components not to be injected at startup, but to be injected when they are actually rendered, further reducing the startup and first screen time of Mini Programs.

# 3. Reduced synchronization during startup API The invocation of

In the Mini Program startup process, developer code is injected and sequentially executed synchronously App.onLaunch, App.onShow, Page.onLoad, Page.onShow。

Initialize the code in the Mini Program (Page, App Beyond the definition) and the several life cycles associated with the above startup, it should be triedReduce or do not call synchronization APIThe vast majority of synchronization API Will be Sync End, but there are some exceptions, such as getSystemInfo。

synchronization API Although simpler to use, it will block the current JS Threads, affecting code execution. Use asynchronous whenever possible, if not necessary API Instead of synchronization, and will initiate non-essential synchronization of the process API The call is delayed until the start is complete.

Common developers are prone to calling too often at startup API There are:

# 3.1 getSystemInfo /getSystemInfoSync

For historical reasons, both interfaces are implemented synchronously. Because getSystemInfo The interface carries too much content, and a single call may take longer.

If not necessary, it is recommended that the developerCache the result of the call, avoid repeated calls.Should be invoked as much as possible during startup。

It is recommended that priority be given to the split getSystemSetting/getAppAuthorizeSetting/getDeviceInfo /getWindowInfo /getAppBaseInfo Get information on demand, or use an asynchronous version getSystemInfoAsync。

# 3.2 [getStorageSync ]((wx.getStorageSync ))/[setStorageSync ]((wx.setStorageSync ))

getStorageSync /setStorageSync Should be used only for persistent storage of data,Does not apply to runtime data delivery or global state managementToo much read and write storage during startup can also significantly affect the time taken for Mini Program code injection.

For simple data sharing, you can use App Add Global Data Object to complete:

// app.js
App({
  globalData: { // Globally shared data
    userName: 'WeChat' 
  }
})

// pages/index.js
const app = getApp()
Page({
  onLoad() {
    const { userName } = app.globalData 
  }
})

# 4. Avoid complex calculations during startup

Initialize the code in the Mini Program (Page, App Beyond the definition) and start the related several lifetimes, should beAvoid performing complex logicComplex operations can also block the current JS Thread, affecting the startup time. It is recommended that complex operations be delayed until the startup is complete.