小程序分包加载、独立分包、分包预加载等

一、小程序分包加载

小程序的代码通常是由许多页面、组件以及资源等组成,随着小程序功能的增加,代码量也会逐渐增加,
体积过大就会导致用户打开速度变慢,影响用户的使用体验。分包加载是一种小程序优化技术。将小程序不同功能的代码,分别打包成不同的子包,在构建时打包成不同
的分包,用户在使用时按需进行加载在构建小程序分包项目时,构建会输出一个或多个分包。每个使用分包小程序必定含有一个主包主包:包含默认启动页面、TabBar 页面以及所有分包都需用到公共资源的包
分包:根据开发者的配置进行划分出来的子包

在这里插入图片描述

二、小程序分包后加载顺序

在小程序启动时:默认会下载珠宝并启动主包内页面,当用户进入分包内某个页面时,微信客户端会把对应分包
下载下来,下载完成后再进行展示。

在这里插入图片描述
注意:
目前小程序分包大小有以下限制:
1.整个小程序分包大小不超过 20MB
2.单个分包/主包大小不能超过 2MB

三、配置分包加载以及打包、引用原则

小程序如果需要进行分包加载,需要在 app.json 中,通过 subPackages 或者 subpackages 定义分包结构每个分包结构含三个常用字段:
1. root :分包的根目录,该目录下的所有文件都会被打包成一个独立的包
2. name:分包的别名,用于在代码中应用该分包
3. pages:指定当前分包中包含哪些页面

示例:
在项目 app.json 中配置

"subPackages": [{"root":"modules/goodModule","name":"goodModule","pages": ["pages/list/list","pages/details/details"]}]

在使用页面中 如点击跳转到分包页面
== 需要在路径之前添加上分包的根目录路径 root 路径才可以==

<navigator url="/modules/goodModule/pages/list/list">跳转到商品列表分包页面 </navigator>

四、配置分包加载以及打包、引用原则

打包原则:
1.tabBar 页面必须在主包内
2.最外层的 pages 字段,属于主包的包含的页面
3.按 subpackages 配置路径进行打包,配置路径外的目录将被打包到主包中
4.分包之间不能相互嵌套,subpackage 的根目录不能是另外一个 subpackage 内的子目录
引用原则:
1.主包不可以引用分包的资源,但分包可以使用主包的公共资源
2.分包与分包之间资源无法相互引用,分包异步化时不受此条限制 

五、独立分包的配置

独立分包:是指能够独立于主包和其它分包运行的包
从独立分包中页面进入小程序时, 不需要下载主包,当用户进入普通分包或主包内页面时,主包才会被下载
开发者可以及那个功能相对独立的页面配置到独立分包中,因为独立分包不依赖主包就可以运行,可以很大
程度提升分包页面的启动速度。
给 subPackages 定义的分包结构添加 independent 字段,即可声明对应分包为独立分包

示例:
打开 app.json 文件

"subPackages": [{"root":"moudles/marketMoudle","name":"marketMoodule","pages":["pages/market/market"],"independent": true}]

注意:
1.对立分包中不能依赖主包和其它分包中的资源
2.主包中的 app.wxss 对对立分包无效
3. App只能在主包内定义,独立分包中不能定义App,会造成无法预期的行为

六、分包预下载

分包预下载是指访问小程序某个页面时,预先下载其它分包中的代码和资源,当用户需要访问分包中的页面时,
已经预先下载的代码和资源,因此可以直接使用,从而提高用户的使用体验。
小程序色分包预下载需要在 app.json 中通过 preloadRule 字段设置预下载规则

示例
打开 app.json 文件

 "preloadRule": {"pages/index/index":{// 访问哪个路径时进行预加载"network": "all",// 需要在什么情况下的网络进行预下载"packages": ["goodModule"]//需要提前预加载的分包的目录或别名},// 预下载独立分包的预下载子包"moudles/marketMoudle/pages/market/market":{"network": "all","packages": ["marketMoodule"]}}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/41153.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如果在已经打开的网页里面,我点击了一个链接,这个链接在新的标签页打开,如何能得到新的标签页其返回的数据收发数据。

要在已打开的网页中点击一个链接并在新标签页中打开&#xff0c;然后捕获新标签页中的所有HTTP请求和响应&#xff0c;你可以使用Selenium库结合selenium-wire插件。下面是一个示例代码&#xff0c;展示了如何实现这一功能&#xff1a; python import json from selenium imp…

【微信小程序开发实战项目】——花店微信小程序实战项目(4)

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;开发者-曼亿点 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 曼亿点 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a…

Nginx的安装与配置 —— Linux系统

一、Nginx 简介 1.1 什么是 Nginx Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件&#xff08;IMAP/POP3&#xff09;代理服务器&#xff0c;在BSD-like 协议下发行。其特点是占有内存少&#xff0c;并发能力强&#xff0c;事实上nginx的并发能力在同类型的网页服务…

Linux系统部署MongoDB开源文档型数据库并实现无公网IP远程访问

文章目录 前言1. 安装Docker2. 使用Docker拉取MongoDB镜像3. 创建并启动MongoDB容器4. 本地连接测试5. 公网远程访问本地MongoDB容器5.1 内网穿透工具安装5.2 创建远程连接公网地址5.3 使用固定TCP地址远程访问 &#x1f4a1; 推荐 前些天发现了一个巨牛的人工智能学习网站&am…

现代农业利器:土壤检测仪器的应用与未来

在现代农业发展的浪潮中&#xff0c;土壤检测仪器以其精准、高效的特点&#xff0c;成为了农业生产的得力助手。这些看似不起眼的设备&#xff0c;实际上在保障农产品质量、提高农业生产效率方面发挥着举足轻重的作用。 一、土壤检测仪器&#xff1a;现代农业的“眼睛” 土壤检…

Vector的扩容过程是怎样的

Vector的扩容过程在C中是一个动态调整内存空间以容纳更多元素的过程。这一过程主要发生在向Vector中添加元素时&#xff0c;如果当前Vector的容量不足以容纳新元素&#xff0c;就会触发扩容操作。以下是Vector扩容过程的详细步骤&#xff1a; 扩容机制 判断是否需要扩容&…

记录第一次写脚本

使用csh语言&#xff0c;Linux系统操作的 写和执行csh&#xff08;C Shell&#xff09;脚本不需要额外的软件&#xff0c;只需要一个支持csh的终端环境。 1.检查是否安装了C Shell 在终端terminal运行以下命令 which csh 如果返回路径&#xff0c;比如/bin/csh&#xff0c…

SpringBoot 启动流程六

SpringBoot启动流程六 这句话是创建一个上下文对象 就是最终返回的那个上下文 我们这个creatApplicationContext方法 是调用的这个方法 传入一个类型 我们通过打断点的方式 就可以看到context里面的东西 加载容器对象 当我们把依赖改成starter-web时 这个容器对象会进行…

STM32-HAL-FATFS(文件系统)(没做完,stm32f103zet6(有大佬的可以在评论区说一下次板子为什么挂载失败了))

1STM32Cube配置 1-1配置时钟 1-2配置调试端口 1-3配置uart 1-4配置SDIO&#xff08;注意参数&#xff09;&#xff08;其中他的初始化的异常函数给注释&#xff0c;SD卡文件写了&#xff09; 配置了还要打开中断和DMA可在我的其他文章中看一样的 1-5配置FatFs (只改了图选中…

java中响应式编程:@FunctionalInterface用法实例

在Java中&#xff0c;Function<T, R>接口是Java 8引入的函数式接口之一&#xff0c;主要用来代表一个输入参数并产生一个结果的函数。它是响应式编程和函数式编程风格的重要组成部分&#xff0c;特别是在处理流&#xff08;Stream&#xff09;和异步操作时非常有用。 Fu…

QT c++函数模板与类模板的使用

QT c类模板的使用 #pragma once#include <QtWidgets/QMainWindow> #include "ui_QtWidgetsApplication5.h"class QtWidgetsApplication5 : public QMainWindow {Q_OBJECTpublic:QtWidgetsApplication5(QWidget *parent nullptr);~QtWidgetsApplication5();te…

Arthas实战(4)- 线程死锁问题排查

一、 准备测试应用 新建一个 SpringBoot应用&#xff0c;写一段线程死锁的代码&#xff1a; GetMapping("/threadLock") public void threadLock() {Thread thread1 new Thread(() -> {synchronized (resource1) {System.out.println(Thread.currentThread().g…

Solution

(解决方案)可行性研究报告暨设计方案-zengwenfeng.doc 基本上都要300-500多页&#xff0c;大型【纯软件】&#xff0c;县级0-200万&#xff0c;市级项目500-1500万不等&#xff0c;省部级1000-10000万不等都有。本例为过往已完成项目案例目录结构。搞方案都要准备1-3个月呢。所…

go语言 类型和常量

go语言 类型和常量 一、基础类型 Go语言是一种静态类型语言&#xff0c;这意味着所有变量的类型在编译时必须明确&#xff0c;并且一旦定义&#xff0c;类型就不能改变。 1.数字类型 整数类型 int8&#xff1a;占1个字节&#xff0c;范围是-128到127。int16&#xff1a;占2…

房屋租赁管理小程序的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;用户管理&#xff0c;中介管理&#xff0c;房屋信息管理&#xff0c;房屋类型管理&#xff0c;租房订单管理&#xff0c;租房信息管理 微信端账号功能包括&#xff1a;系统首页&#xff0c;房屋信息&a…

极狐GitLab 将亮相2024空天信息大会暨数字地球生态峰会,携手中科星图赋能空天行业开发者

GitLab 是一个全球知名的一体化 DevOps 平台&#xff0c;很多人都通过私有化部署 GitLab 来进行源代码托管。极狐GitLab &#xff1a;https://gitlab.cn/install?channelcontent&utm_sourcecsdn 是 GitLab 在中国的发行版&#xff0c;专门为中国程序员服务。可以一键式部署…

测试类型介绍-功能测试入门指南

1. 功能测试定义​ 功能测试&#xff0c;作为软件质量保证的关键环节&#xff0c;专注于验证软件是否按预期执行其指定功能。它直接面向用户需求&#xff0c;确保每一个功能点都能正确无误地工作。简而言之&#xff0c;功能测试是检查软件功能是否符合设计规范的过程。 2. 为…

Django文档简化版——Django快速入门——创建一个基本的投票应用程序

Django快速入门——创建一个基本的投票应用程序 准备工作1、创建虚拟环境2、安装django 1、请求和响应&#xff08;1&#xff09;创建项目&#xff08;2&#xff09;用于开发的简易服务器&#xff08;3&#xff09;创建投票应用&#xff08;4&#xff09;编写第一个视图1、编写…

Qualcomm QCA206x EasyMesh For Ubuntu

1. 引言 关于EasyMesh概念我们这里就不再过多的赘述&#xff0c;此篇文档的目的是&#xff0c;让广大初学者&#xff0c;有一个很方便的平台进行EasyMesh的学习和测试。 2. X86 Ubuntu平台 2.1 硬件环境准备 备注&#xff1a;QCA206x WiFi module推荐使用移远的FC64E/FC66E。…

Mysql笔记-v2【7月5日更新】

零、 help、\h、? 调出帮助 mysql> \hFor information about MySQL products and services, visit:http://www.mysql.com/ For developer information, including the MySQL Reference Manual, visit:http://dev.mysql.com/ To buy MySQL Enterprise support, training, …