explaingit

celeroncoder/flame-graph-skills

Analysis updated 2026-05-18

0Audience · developerComplexity · 1/5LicenseSetup · easy

TLDR

An AI agent skill that profiles web page performance like a flame graph, ranking the biggest measured bottlenecks and verifying fixes with re-measurement.

Mindmap

mindmap
  root((flame-audit))
    What it does
      Flame-graph style profiling
      Ranked bottleneck report
      Evidence-backed fix plan
      Re-measurement after fixes
    Tech stack
      Chrome DevTools
      Lighthouse
    Use cases
      Cold load profiling
      Interaction profiling
      Core Web Vitals check
    Audience
      Web developers
      AI agent builders

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Profile a cold page load or user interaction to find the biggest performance bottlenecks.

USE CASE 2

Get a ranked, evidence-backed fix plan instead of generic performance advice.

USE CASE 3

Re-measure a page after changes to confirm improvements are real.

What is it built with?

Chrome DevToolsLighthouse

How does it compare?

celeroncoder/flame-graph-skills00kaku/gallery-slider-block04amanrajj/netwatch
Stars00
LanguageJavaScriptRust
Last pushed2021-05-19
MaintenanceDormant
Setup difficultyeasyeasymoderate
Complexity1/52/53/5
Audiencedevelopergeneralops devops

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

Install via the skills registry command or copy SKILL.md and references/ into an agent's skills directory.

MIT license, use freely for any purpose including commercial use, as long as you keep the copyright notice.

In plain English

Flame Audit is an agent skill that helps an AI coding assistant find the parts of a web page that actually slow it down, using the same thinking as a CPU flame graph: the widest piece of work is the most important thing to fix, and stack depth shows what caused what. It captures a real performance trace and network activity, then turns that raw data into a short ranked report instead of a generic checklist of best practices. When used, it measures a cold page load or a specific interaction before suggesting anything, then ranks the three to five biggest bottlenecks across main-thread work, the largest contentful paint, JavaScript bundle size, rendering, and network activity. It keeps a clear line between what it actually measured and what it is only guessing based on reading the codebase. After changes are made, it re-runs the same trace so any claimed improvement is backed by a new measurement rather than assumed. Every audit follows the same format: a plain-language verdict naming the dominant bottleneck, a ranked list of the widest measured problem areas with their cost and confidence, Core Web Vitals scores, a look at which network transfers are slowing things down, a prioritized fix plan tied to the evidence, and a before-and-after comparison once fixes are applied. The skill prefers to gather its data through Chrome DevTools, and falls back to Lighthouse, a profile the user supplies directly, or a clearly labeled static review if neither is available. It installs either through a skills registry command or by copying the skill's files into an agent's skills directory, and its guiding rules are to measure before recommending, fix the biggest cost first, avoid claiming savings the data does not support, and stop once a page is already performing well. It is released under the MIT license.

Copy-paste prompts

Prompt 1
Use flame-audit to profile https://example.com on a cold load and focus on LCP and first-load JavaScript.
Prompt 2
Profile the checkout button interaction for INP and rank the widest measured bottlenecks.
Prompt 3
Interpret this Chrome Performance trace and identify the largest exclusive work on the main thread.
Prompt 4
How do I install and configure an agent skill from a skills registry into my coding assistant?

Frequently asked questions

What is flame-graph-skills?

An AI agent skill that profiles web page performance like a flame graph, ranking the biggest measured bottlenecks and verifying fixes with re-measurement.

What license does flame-graph-skills use?

MIT license, use freely for any purpose including commercial use, as long as you keep the copyright notice.

How hard is flame-graph-skills to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is flame-graph-skills for?

Mainly developer.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.