更新时间：2024-02-02 11:05:48收藏订阅更新我的文档设置返回文档小程序的性能与用户访问体验息息相关，小程序良好的性能可以保障用户使用的流畅性，提升用户的使用体验。如果遇到以下问题，可能导致用户流失。●打开一个小程序，在内容显示前，过长的等待时间将直接影响用户的去留。●频繁的错误页会让用户觉得不可靠，降低信任感。●滑动卡顿，点击无响应也会给用户带来不好的交互体验。因此，在日常业务功能开发时，需要关注小程序的性能，使用户有良好的使用体验。运行原理与传统的 h5 应用不同，小程序运行架构分为 webview 和 worker 两个部分。webview 负责渲染，worker 则负责存储数据和执行业务逻辑。1webview 和 worker 之间的通信是异步的。这意味着当调用 setdata 时，数据并不会立即渲染，而是需要从 worker 异步传输到 webview。2数据传输时需要序列化为字符串，然后通过 evaluatejavascript 方式传输，数据大小会影响性能。小程序启动流程简介如图所示，小程序启动流程主要包括几个阶段：1资源准备 当用户点击小程序时，客户端会读取小程序的基本信息和包信息，并遵循一定机制进行包下载、更新。同时进行小程序运行环境的准备，如 worker 线程、webview 容器、原生 titlebar / tabbar、小程序基础库等。2代码注入 小程序逻辑层注入业务 js 代码并运行，其间会触发小程序的 app.onlaunch / app.onshow 生命周期。渲染层会进行渲染准备。3首次渲染 小程序框架根据初始数据开始创建页面和自定义组件，并进行绘制，绘制完成时触发 page.onready 生命周期。此刻，认为小程序首屏启动完成。4业务渲染 在完成首次渲染后，后续根据业务形态，通过 setdata 完成完整页面内容绘制，并触发 firstpaint / firstcontentfulpaint / largestcontentfulpaint。
