React Native Best Practices
vercel-labs/openreview
A prioritized rule set for React Native and Expo apps covering list performance, animation, navigation, UI patterns, state, rendering, monorepos and configuration.
Analyzes Meta VR and Horizon OS VR performance using Perfetto traces — frame timing, CPU/GPU bottlenecks, render pass analysis.
$ npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install meta-quest/agentic-tools hz-perfetto-debug --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/meta-quest/agentic-tools.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/hz-perfetto-debug .claude/skills/hz-perfetto-debug && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "hz-perfetto-debug" agent skill from https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debug into .claude/skills/hz-perfetto-debug/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "hz-perfetto-debug", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debugType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install meta-quest/agentic-tools hz-perfetto-debug --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/meta-quest/agentic-tools.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/hz-perfetto-debug .agents/skills/hz-perfetto-debug && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "hz-perfetto-debug" agent skill from https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debug into .agents/skills/hz-perfetto-debug/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "hz-perfetto-debug", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install meta-quest/agentic-tools hz-perfetto-debug --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/meta-quest/agentic-tools.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/hz-perfetto-debug .cursor/skills/hz-perfetto-debug && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "hz-perfetto-debug" agent skill from https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debug into .cursor/skills/hz-perfetto-debug/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "hz-perfetto-debug", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/meta-quest/agentic-tools.git --path skills/hz-perfetto-debug--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install meta-quest/agentic-tools hz-perfetto-debug --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/meta-quest/agentic-tools.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/hz-perfetto-debug .gemini/skills/hz-perfetto-debug && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "hz-perfetto-debug" agent skill from https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debug into .gemini/skills/hz-perfetto-debug/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "hz-perfetto-debug", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install meta-quest/agentic-tools hz-perfetto-debugInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/meta-quest/agentic-tools.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/hz-perfetto-debug .github/skills/hz-perfetto-debug && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "hz-perfetto-debug" agent skill from https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debug into .github/skills/hz-perfetto-debug/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "hz-perfetto-debug", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install meta-quest/agentic-tools hz-perfetto-debug --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/meta-quest/agentic-tools.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/hz-perfetto-debug .opencode/skills/hz-perfetto-debug && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "hz-perfetto-debug" agent skill from https://github.com/meta-quest/agentic-tools/tree/main/skills/hz-perfetto-debug into .opencode/skills/hz-perfetto-debug/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "hz-perfetto-debug", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
hz-perfetto-debugAnalyzes Meta VR and Horizon OS VR performance using Perfetto traces — frame timing, CPU/GPU bottlenecks, render pass analysis.
Hz Perfetto Debug is an agent skill from meta-quest/agentic-tools. Analyzes Meta VR and Horizon OS VR performance using Perfetto traces — frame timing, CPU/GPU bottlenecks, render pass analysis. Use when profiling frame drops, jank, or thermal issues on Meta VR devices. Build paths: all Meta VR app stacks; use hz-quest-verify-first if the build path is unclear.
Its SKILL.md is about 2.8k tokens, which your agent loads only when the skill is triggered. The skill folder holds 6 other files, including reference files (for example `references/analyzing-traces.md`, `references/capturing-traces.md` and `references/frame-timing.md`).
It sits in Mobile, covering Mobile performance. The repository describes itself as: Agent Skills for Meta Quest/Horizon OS VR Development. The licence is Apache-2.0.
12 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 3a8553d. It shows what the files ask for, not the result of running them.
Pre-approves these tools, so the agent can use them without asking each time:
Bash(metavr:*)Bash(hzdb:*)Bash(npx:*)From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
npxFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md. Its commands use npx, which can reach the network depending on how they are called.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Hz Perfetto Debug loads about 2.8k tokens when it runs, and up to ~12k if it reads all its reference files. Until then it costs about 79 tokens; SKILL.md has 1,204 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from meta-quest/agentic-tools at commit 3a8553d, republished under its Apache-2.0 licence (© meta-quest). 1,204 words, ~2,791 tokens.
.claude/skills/hz-perfetto-debug/SKILL.md (or your agent's skills folder). This skill also uses 5 other files; get the full folder from GitHub.Use this skill when investigating VR performance issues on Meta VR devices:
These are the hard deadlines for each refresh rate. If a frame exceeds its target, the compositor must reproject or the user sees a stale frame.
| Refresh Rate | Frame Time Budget | Notes |
|---|---|---|
| 120 Hz | 8.3 ms | Supported on Quest 2, Quest 3, Quest 3S |
| 90 Hz | 11.1 ms | Supported on Quest 2, Quest Pro, Quest 3, Quest 3S |
| 72 Hz | 13.9 ms | Default on all Quest devices |
| 60 Hz | 16.7 ms | Media apps only (Quest 2); interactive apps must use 72 Hz+ |
Missing a frame deadline by even 1 ms causes a stale frame (reprojection). Stale frames above 10% of total frames indicate a serious performance problem.
Perfetto tracing is powered by the metavr CLI — install the standalone binary on your PATH (see the metavr-cli skill), or invoke via npx with no install:
metavr --versionExamples below use the bare metavr command; if you use the npm distribution, prefix with npx -y. Connect your Meta VR device via USB with developer mode enabled before capturing traces.
# Capture a 5-second trace from the currently running VR app
metavr perf capture
# Specify duration and target app
metavr perf capture --duration 10000 --app com.example.myapp
# Enable GPU render stage tracing for detailed pass analysis
metavr perf capture --gpu-render-stage
# Enable XR runtime metrics
metavr perf capture --xr-runtime
# Custom output name
metavr perf capture -o my-session-nameThe capture auto-detects the foreground VR app if --app is not specified. CPU scheduling and GPU metrics tracing are enabled by default. The trace is pulled to your local machine automatically.
metavr perf tracesReturns .pftrace files sorted by modification time (newest first). Searches standard directories including ~/Documents, ~/Downloads, and the current working directory.
metavr perf load <trace-file>Loads and processes the trace for analysis. Accepts a hex session ID, filename (with or without .pftrace extension), or a full/relative path.
metavr perf contextReturns a structured performance analysis including:
metavr perf query <session-id> "SELECT ts, dur, name FROM slice WHERE name LIKE '%PlayerLoop%' LIMIT 20"Executes arbitrary SQL against the loaded Perfetto trace database. All Perfetto tables are available: slice, thread_track, thread, process, counter, counter_track, args, sched_slice, and more.
metavr perf thread-state <session-id> <utid>
# With time range
metavr perf thread-state <session-id> <utid> --start-ts 1000000 --end-ts 5000000000Returns a thread state breakdown showing how much time the thread spent running, sleeping, blocked, or waiting for CPU. Useful for identifying whether a thread is CPU-bound, I/O-bound, or starved.
metavr perf gpu-counters <session-id> --start-ts 100,200,300 --end-ts 150,250,350Returns GPU metric counters (mean, standard deviation, quantiles) for GPU frame ranges. Requires at least 20 frames for statistical accuracy. Metrics include texture fetch rates, shader ALU capacity, vertex processing, and fragment shading statistics.
Follow these steps in order for a thorough performance investigation.
Before analyzing, confirm the trace is usable:
SELECT
(MAX(ts) - MIN(ts)) / 1e9 AS duration_seconds,
COUNT(*) AS total_slices
FROM sliceIf the trace has fewer than 1000 slices or is under 1 second, it may not contain enough data for meaningful analysis. Capture a new trace with metavr perf capture.
Find the application process (not system services):
SELECT upid, pid, name
FROM process
WHERE name NOT LIKE 'com.oculus%'
AND name NOT LIKE '/system%'
AND name NOT LIKE 'com.android%'
AND name IS NOT NULL
ORDER BY pidFor known apps, filter directly by package name.
Look for engine-specific markers:
| Engine | Key Markers |
|---|---|
| Unity | PlayerLoop, UnityMain, PhaseSync, PostLateUpdate.FinishRendering |
| Unreal | UGameEngine::Tick, FEngineLoop::Tick, RHI Thread |
| Native OpenXR | xrWaitFrame, xrBeginFrame, xrEndFrame without engine markers |
Identify the threads that matter for VR rendering:
SELECT t.utid, t.tid, t.name, p.name AS process_name
FROM thread t
JOIN process p USING(upid)
WHERE p.name = '<target-process>'
ORDER BY t.nameCritical threads to locate:
| Thread | Purpose |
|---|---|
| Main thread (UnityMain / GameThread) | Game logic, physics, scripts |
| Render thread (UnityGfx / RenderThread) | Draw call submission |
| GPU completion (GPU completion / RHI Thread) | GPU fence waiting |
| Worker threads (Job.Worker / TaskGraph) | Parallel workloads |
Once you have a thread's utid, use metavr perf thread-state <session-id> <utid> to get a quick breakdown of its running/sleeping/blocked time.
Find frame start/end markers to segment per-frame analysis:
PlayerLoop slices on the main thread define frame boundariesFEngineLoop::Tick slices on the game threadxrWaitFrame to xrEndFrame sequencesFind what consumes the most time per frame:
SELECT name, COUNT(*) AS call_count, SUM(dur)/1e6 AS total_ms, AVG(dur)/1e6 AS avg_ms
FROM slice
WHERE track_id IN (
SELECT id FROM thread_track WHERE utid = <main_thread_utid>
)
GROUP BY name
ORDER BY total_ms DESC
LIMIT 20Functions called excessively per frame can indicate batching issues:
SELECT name, COUNT(*) AS calls
FROM slice
WHERE track_id IN (
SELECT id FROM thread_track WHERE utid = <utid>
)
AND dur < 100000
GROUP BY name
HAVING calls > 1000
ORDER BY calls DESCSee the GPU analysis reference for detailed render pass breakdown, surface analysis, and GPU counter interpretation.
| Concept | Description |
|---|---|
| Slice | A timed span of execution (function call, frame, render pass). Has ts (start), dur (duration), name, and track_id. |
| Track | A timeline lane. Thread tracks hold slices for a specific thread. Counter tracks hold metric values over time. |
| Thread (utid) | Unique thread ID within the trace. Use utid (not tid) for joins — tid can be reused. |
| Process (upid) | Unique process ID within the trace. Use upid (not pid) for joins. |
| Timestamps | All timestamps are in nanoseconds. Divide by 1e6 for milliseconds, 1e9 for seconds. |
| Counter | A time-series metric (GPU utilization, clock frequency, temperature). Stored in the counter table. |
| Args | Key-value metadata attached to slices. Accessed via the args table joined on arg_set_id. |
| Metric | Target | Warning | Critical |
|---|---|---|---|
| Frame time (90 Hz) | < 11.1 ms | > 11.1 ms | > 16.7 ms |
| Stale frame rate | < 5% | > 10% | > 25% |
| Main thread utilization | < 80% of budget | > 80% | > 95% |
| GPU utilization | < 85% of budget | > 85% | > 95% |
| Frame variance (std dev) | < 1 ms | > 2 ms | > 4 ms |
| Draw calls per frame | < 100 | > 200 | > 500 |
PlayerLoop. This is normal and intentional — do NOT flag as wasted time.SetPass call counts, which indicate materials are not being batched.UObject::ProcessEvent. High counts indicate Blueprints should be converted to C++.__StaticExec suffix in trace names.surface#0 are not descriptive — correlate them with the resolution and MSAA level to identify what they render.UnityMain may appear as UnityMai or similar.utid (not tid) when joining thread-related tables in SQL queries.For detailed guides on specific topics, see:
© meta-quest, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 5 other files (references) in skills/hz-perfetto-debug of meta-quest/agentic-tools.
Open the folder on GitHubat commit 3a8553d
Hz Perfetto Debug next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Hz Perfetto Debug this skillmeta-quest/agentic-tools | 215 | — | ~2.8k | Automated safety check: Pass | Apache-2.0 | |
| React Native Best Practicesvercel-labs/openreview | 1.7k | 17 repos | ~1.1k | Automated safety check: Pass | MIT | |
| Dongle Crash Analysishaumacher/phoneblock | 367 | — | ~1.9k | Automated safety check: Notes | GPL-3.0 | |
| Perfetto Trace Analysisjameshnsears/QuoteUnquote | 100 | 2 repos | ~1.7k | Automated safety check: Pass | Apache-2.0 | |
| React Native Best Practicescallstackincubator/agent-skills | 1.7k | 4 repos | ~3.1k | Automated safety check: Pass | MIT | |
| Kototoro Browse Source ScrollKototoro-app/Kototoro | 613 | — | ~793 | Automated safety check: Pass | Apache-2.0 |
vercel-labs/openreview
A prioritized rule set for React Native and Expo apps covering list performance, animation, navigation, UI patterns, state, rendering, monorepos and configuration.
haumacher/phoneblock
Decode and analyze an ESP32 dongle crash report (uploaded .coredump).
jameshnsears/QuoteUnquote
Analyzes Perfetto traces to find the root cause of latency, memory, or jank issues in Android apps.
callstackincubator/agent-skills
Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations.
Kototoro-app/Kototoro
Diagnose and fix Kototoro Browse/Explore page content source scrolling jank when many sources exist.
LUC4N3X/Levyra-deepsound
Automatically use for Android runtime performance investigations involving Perfetto/System Trace, jank, latency, startup, CPU scheduling, blocking, memory, I/O, IPC, graphics, power, or measured…
meta-quest/agentic-tools
Guides porting existing Android 2D apps to Meta VR and Horizon OS — input adaptation, panel layout, and design requirements.
meta-quest/agentic-tools
Upgrades Meta VR apps to newer Horizon OS SDK versions — migration guides, deprecated API replacements, changelog.
meta-quest/agentic-tools
Builds WebXR experiences for Meta VR and Horizon OS using the Immersive Web SDK (IWSDK) — ECS architecture, Three.js integration, spatial UI.
meta-quest/agentic-tools
Build multi-window Meta Horizon OS experiences with the MetaVrx Layout SDK in Jetpack Compose or React Native.
meta-quest/agentic-tools
Scaffolds new Meta VR and Horizon OS projects after the build path is selected — Standard Android, Meta Spatial SDK, Unity, Unreal, or WebXR.
meta-quest/agentic-tools
Build and iterate on React Native apps for Meta VR / Horizon OS with Expo.
Categories
Analyzes Meta VR and Horizon OS VR performance using Perfetto traces — frame timing, CPU/GPU bottlenecks, render pass analysis. Hz Perfetto Debug is an agent skill from meta-quest/agentic-tools. Analyzes Meta VR and Horizon OS VR performance using Perfetto traces — frame timing, CPU/GPU bottlenecks, render pass analysis.
Hz Perfetto Debug fits situations like: profiling frame drops; thermal issues on Meta VR devices.
Run `npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a claude-code`. Or copy the skill folder (skills/hz-perfetto-debug in meta-quest/agentic-tools) into .claude/skills/hz-perfetto-debug in your project. Claude Code loads it when a task matches its description.
Run `npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a codex`. Or copy the skill folder (skills/hz-perfetto-debug in meta-quest/agentic-tools) into .agents/skills/hz-perfetto-debug in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add meta-quest/agentic-tools --skill hz-perfetto-debug -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/hz-perfetto-debug, .gemini/skills/hz-perfetto-debug, .github/skills/hz-perfetto-debug and .opencode/skills/hz-perfetto-debug in your project.
Going by SKILL.md and its folder, Hz Perfetto Debug needs the command-line tools its instructions call (npx). Our summary lists: Node.js. Its frontmatter pre-approves these tools: Bash(metavr:*), Bash(hzdb:*), Bash(npx:*).
SKILL.md contains no URLs. Its commands use npx, which can reach the network depending on how they are called. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Hz Perfetto Debug is published under the Apache-2.0 licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.
About 2.8k tokens (SKILL.md is roughly 11k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 9.2k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with Hz Perfetto Debug: React Native Best Practices (vercel-labs/openreview, 1.7k stars), Dongle Crash Analysis (haumacher/phoneblock, 367 stars), Perfetto Trace Analysis (jameshnsears/QuoteUnquote, 100 stars) and React Native Best Practices (callstackincubator/agent-skills, 1.7k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
meta-quest (a GitHub organization) maintains it in meta-quest/agentic-tools, which has 215 GitHub stars. The repository holds 34 skills in this directory. The repository was last updated on September 24, 2026.
Source: meta-quest/agentic-tools on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.