---
title: 启动时性能检测
summary: "介绍如何使用启动性能检测工具分析小程序从打开到首屏渲染的耗时情况。"
docType: default
tags: [启动性能检测工具, 启动耗时分析, 真机启动性能检测]
questions:
  - 启动时性能检测用于解决哪类问题？
  - 如何在真机上开启启动性能检测工具？
  - 启动性能检测适用于哪些场景？
  - 小程序启动耗时的排查阈值是多少？
  - 启动性能检测中有哪些重点关注的小程序指标？
  - 启动性能检测中的 App 指标包括哪些？
  - 启动耗时偏高时应该优先检查什么？
---

# 启动时性能检测

启动时性能检测用于观察小程序从打开到首屏完成渲染这一阶段的耗时情况，适合排查"打开慢""首屏白屏时间长"等问题。


## 开启步骤

在开始检测前，需要先进入调试工具入口。

1. 打开真机上的 Ray 小程序页面。
2. 进入调试工具：
   - **iOS**：点击右上角的 `...` 按钮，在底部弹层中点击 **调试工具**。
   - **Android**：长按右上角的 **X** 按钮，弹出 App 基础信息面板，点击下方的 **打开调试** 按钮。

<Image src="/images/guide/optimization/open-experience-score.png" width="200px" />

3. 在调试工具菜单中点击 **打开性能工具**。
4. 重新进入或重新触发一次小程序启动流程，观察启动相关指标。

<Image src="/images/guide/optimization/performance-tools.png" width="200px" />

## 适用场景

- 页面首次打开明显偏慢
- 版本更新后启动时间变长
- 首屏内容展示过晚
- 需要对优化前后的启动耗时做对比

## 重点关注指标

**小程序指标**

<div className="startup-metrics-table">

| 指标 | 含义 | 排查阈值 | 说明 |
| ---- | ---- | ---- | ---- |
| 启动耗时（首次） | 从点击小程序到页面渲染成功的耗时 | ＞3000ms | 首次打开通常会包含下载耗时 |
| 启动耗时（非首次） | 从点击小程序到页面渲染成功的耗时 | ＞1500ms | 使用本地缓存的代码包 |
| 下载耗时 | 小程序代码包的下载耗时 | ＞1000ms | 仅在无缓存时会触发下载 |
| 准备阶段耗时 | 从点击小程序到 JS 代码开始注入运行环境的耗时 | ＞500ms | 反映运行环境初始化速度 |
| 页面渲染耗时 | 小程序页面的渲染时长 | ＞500ms | 反映页面结构复杂度和首屏渲染压力 |
| 帧率 | 当前页面实时帧率 | ＜30 FPS | 数值越高页面越流畅 |
| 平均帧率 | 当前页面的平均帧率 | ＜50 FPS | 反映整体流畅度水平 |

</div>

> 以上排查阈值为行业通用参考值，实际标准以业务验收要求为准。

**App 指标**

| 指标 | 含义 |
| ---- | ---- |
| CPU | 当前 App 占用的 CPU 使用率 |
| Memory | 当前 App 占用的内存大小 |
| 启动耗时 | App 从点击启动到可用的耗时 |

## 结果判断建议

- **启动耗时偏高**：优先检查主包体积、首屏依赖逻辑是否过重。
- **下载耗时偏高**：优先检查代码包体积、图片和静态资源是否过大。
- **准备阶段耗时偏高**：通常说明运行环境初始化慢，可检查是否有过多同步逻辑阻塞了注入流程。
- **页面渲染耗时偏高**：通常说明首屏渲染内容过重或存在阻塞渲染的异步操作。

如果已经定位到问题，可以继续参考以下文档：

- [代码包体积优化](/cn/miniapp/develop/ray/guide/optimization/startup/package-size)
- [代码注入优化](/cn/miniapp/develop/ray/guide/optimization/startup/code-injection)
- [首屏渲染优化](/cn/miniapp/develop/ray/guide/optimization/startup/first-render)
