---
title: FPS Performance Analysis
docType: default
---

# FPS Performance Analysis

FPS (Frames Per Second) performance analysis observes page smoothness during runtime. It is used to diagnose issues like scrolling lag, animation frame drops, and unresponsive interactions.

## How to Enable

1. Open the page to be tested on a real device.
2. Access the debugging tool:
   - **iOS**: Tap the `...` button in the top-right corner, then tap **Debugging Tools** in the bottom sheet.
   - **Android**: Long-press the **X** button in the top-right corner, the App basic info panel will appear, then tap **Open Debug** at the bottom.
3. Tap **Open vConsole** in the debugging tool menu.
4. Find the **Perf** tab, then tap **"Open FPS monitor"** to enable performance monitoring.
5. Perform scrolling, switching, animations, and drag operations on the page, and observe frame rate changes.

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

## Applicable Scenarios

- Noticeable lag when scrolling lists
- Animations are not smooth
- Frame drops in high-frequency interaction scenarios
- Need to compare runtime smoothness before and after optimization

## Key Metrics

| Metric | Description | Notes |
| ------ | ----------- | ----- |
| FPS | Frames rendered per second | Higher values mean smoother pages |

For more metrics, see the [Debugging Guide](/en/miniapp/develop/ray/guide/debug-guide).

## How to Interpret Results

- **Consistently low FPS**: Usually indicates the overall rendering load of the page is too heavy.
- **FPS drops significantly when scrolling**: Prioritize checking long list rendering, node count, and redundant re-renders.
- **FPS drops during animations**: Check if animations are driven by frequent data updates and whether a lighter animation approach can be used.
- **Momentary frame drops during specific operations**: Usually related to synchronous computation, batch updates, or large data processing.

If you have identified the issue, refer to the following documents:

- [Using setData Wisely](/en/miniapp/develop/ray/guide/optimization/runtime/setdata)
- [Render Performance Optimization](/en/miniapp/develop/ray/guide/optimization/runtime/render)