Codex Rencal Frontend Performance Trace Analysis
Read Rencal browser performance recordings to rank long frames, layout events and expensive scripts, then compare the same interaction after a change.
中文Install in Codex
Open Rencal in Codex with a browser trace in recordings and the project's just analysis recipe. An existing analyzer summary can also be reviewed first.
- Review `.agents/skills/performance-analysis/SKILL.md` and its requirements at the pinned GitHub commit.
- Create `.agents/skills/performance-analysis/` in your project and save the reviewed file as `.agents/skills/performance-analysis/SKILL.md`.
- Start Codex from that project's root, then type `$performance-analysis` and select the matching skill.
Example task
Identify the first investigation target from this sample analyzer summary.
{"interaction":"changing calendar month","longestFrameMs":33,"topScript":"buildGrid","scriptSelfMs":19,"layoutMs":3}What to check
Prioritize how `buildGrid=19ms` relates to `longestFrame=33ms`. Check for repeated grid work and re-record the same interaction to verify.
Original SKILL.md on GitHub · Updated
Frequently asked question
How should I compare after an optimization?
Record the same operation under similar conditions, then compare the longest frame and prior script hotspot.