• 智能小程序的启动流程
  • 1. 用户点击打开小程序
  • 2. 下载小程序包
  • 3. 启动智能小程序框架
    • 3.1 初始化智能小程序框架逻辑层
    • 3.2 初始化智能小程序框架渲染层
  • 4. 执行页面级的生命周期

智能小程序的启动流程

智能小程序的性能损耗主要发生在页面数据的获取及页面渲染，下图展示了用户从入口点击到首屏渲染的全流程：

创新互联是一家专注于成都做网站、网站制作、成都外贸网站建设与策划设计,碧江网站建设哪家好?创新互联做网站,专注于网站建设十多年,网设计领域的专业建站公司;建站业务涵盖:碧江等地区。碧江做网站价格咨询:18980820575

基于上图描述的流程，我们接下来继续展开，如何针对该流程的各个环节，采取针对性的优化手段：

1. 用户点击打开小程序

此处是小程序加载的起点。

2. 下载小程序包

小程序在用户第一次打开时会下载最新版本的小程序包。如果包体积过大，会导致下载时间增长。那么可以考虑使用分包能力，并减少不必要的动态库和插件的使用。

我们将会在使用分包和合理使用动态库章节介绍该流程的优化方式。

3. 启动智能小程序框架

此时逻辑层和渲染层开始同步初始化：

3.1 初始化智能小程序框架逻辑层

1. 加载动态库和插件：动态库和插件提供了扩展小程序能力的机制。因为其加载方式是串行的，所以如果引用了不合适的动态库和插件，会导致一定程度性能退化。开发者需要平衡功能和性能的关系，合理使用动态库章节将会详细介绍该流程的优化方式。

2. 加载逻辑代码：逻辑代码指的是App、页面、自定义组件和使用的其他模块的js模块的集合。如果逻辑代码体积过大会影响逻辑层的启动速度。因此开发者需要考虑按需加载模块，减少代码体积。

3. 执行onLaunch：加载完必要的资源后，智能小程序框架会执行App.onLaunch相关回调。如果App.onLaunch中执行过多同步阻塞式的逻辑，会导致后续流程阻塞，影响逻辑层启动速度。合理使用 App.onLaunch章节将会详细介绍该流程的优化方式。

完成加载动态库和插件、加载逻辑代码和执行onLaunch后，智能小程序框架逻辑层会收集initData（渲染层进行页面绘制的必要信息，包含了小程序App、页面和自定义组件的初始数据）。initData收集的早晚是衡量逻辑层性能的关键点。

3.2 初始化智能小程序框架渲染层

1. 加载模板和样式文件：包含app.css、page.css和page.swan等相关文件。这些文件一般较小，对整体性能影响不大。

2. 加载SJS：SJS是智能小程序的一套自定义脚本语言。SJS会产生额外的加载逻辑，对性能影响较大，建议仅在必要情况下使用此能力，提升启动性能。

3. 加载当前页面所有使用到的自定义组件：此处使用到的自定义组件包括插件和动库中使用的组件，如果页面使用到的自定义组件较少，那么可以虑直接将逻辑写入页面模板中，并且酌情使用插件和动态库，我们在合理使用自定义组件章节介绍了该流程的优化。

完成模板和样式文件、SJS和当前页面所有使用到的自定义组件加载后，智能小程序框架渲染层初始化完成。如果逻辑层初始化相对渲染层较慢，那么就是渲染层等待initData到达；反之则是initData到达后，等待渲染层初始化完成。

智能小程序框架完成初始化后，会触发首次内容绘制。

4. 执行页面级的生命周期

首次内容绘制完成后，渲染层向逻辑层发送firstRendered事件，逻辑层开始执行生命周期。以生命周期中页面onLoad为例，假设开发者在onLoad中请求页面主数据（小程序希望首屏展示给用户的数据）。为了加速主数据的请求速度，可以使用onInit生命周期，提前请求主数据。在onInit请求首屏主数据章节将介绍如何优化小程序主数据请求。

完成以上所有流程后，会触发首次有意义的渲染。

本文题目：创新互联百度小程序教程：智能小程序的启动流程
路径分享：http://www.zyruijie.cn/qtweb/news44/5544.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联