During the development of WeChat Mini Programs , as the business continues to iterate, the size of the program package is getting larger and larger. Using sub-package loading is a problem that developers must face.
Under normal circumstances, when the Mini Program is started for the first time, the entire code package will be downloaded, so if the code package is too large, it will affect the first startup time of the Mini Program, so WeChat officially sets a size limit for the Mini Program code package.
Official introduction: pages.json page routing | uni-app official website
1. Why use subcontracting?
1. Reduce initial loading time: If the entire Mini Program page is very large and contains a large number of files and codes, it may take a long time for initial loading.
2. Optimize the size of the small program package: When the small program project becomes very large, the size of a single package may exceed the limit of the small program platform.
3. On-demand update and maintenance: By separating different functional modules or pages into different subpackages, independent update and maintenance can be achieved.
Tip: When the applet starts, it will download the main package by default and start the pages in the main package. When the user enters a page in the sub-package, the client will download the corresponding sub-package.
Note: Reasonable use of subpackages can better optimize the loading time of applets and improve user experience.
2. Check the subpackage size
You can view the project and subpackage information in the WeChat development tools->details->basic information panel. If subpackage is not used, the total size of the applet cannot exceed 2MB. If subpackage is used, the total size can reach 20MB, and each package cannot exceed 2MB.
3. How to use subcontracting?
1. Create a new directory subPackages under the root directory, other names are also ok
2.pages.json place subPackages
3. You can generate a path style with one click and create a new page under the directory
4. Test whether the creation is successful and the subcontract page is successful
Note: During the development process, you can use uni.navigateTo or wx.navigateToor wx.redirectToother navigation methods to jump to the pages in the subpackage. It should be noted that the full path needs to be specified when navigating across packages, eg pages/subpageA/subpageA.
4. Packing principle
- After declaration
subpackages, it willsubpackagesbe packaged according to the configuration path, andsubpackagesdirectories outside the configuration path will be packaged into the main package - The main package can also have its own pages, the outermost pages field.
subpackagesubpackageThe root directory of a cannot be a subdirectory within anothertabBarThe page must be inside the main package
5. Citation principles
packageAJS files cannot be required , but JS files withinpackageBthe main package can be required ; this restriction is not imposed when using subpackage asynchronizationpackageApackageAThe template cannot be importedpackageB, butpackageAthe template in the main package can be requiredpackageAunusablepackageBresources, but can usepackageAresources inside the main package,
6. Low version compatibility
The compatibility of the old version of the client is handled by WeChat background compilation. The background will compile two code packages, one is the code after subcontracting, and the other is the compatible code of the whole package. New clients use subpackages, while old clients still use the whole package. The full package will put subpackage the paths inside each page into pages.