performance-investigation

작성자: sveltejs

성능 회귀를 조사하고 최적화 기회를 찾습니다

npx skills add https://github.com/sveltejs/svelte --skill performance-investigation

Quick start

  1. Start from a branch you want to measure (for example foo).
  2. Run:
pnpm bench:compare main foo

If you pass one branch, bench:compare automatically compares it to main.

Where outputs go

  • Summary report: benchmarking/compare/.results/report.txt
  • Raw benchmark numbers:
    • benchmarking/compare/.results/main.json
    • benchmarking/compare/.results/<your-branch>.json
  • CPU profiles (per benchmark, per branch):
    • benchmarking/compare/.profiles/main/*.cpuprofile
    • benchmarking/compare/.profiles/main/*.md
    • benchmarking/compare/.profiles/<your-branch>/*.cpuprofile
    • benchmarking/compare/.profiles/<your-branch>/*.md

The .md files are generated summaries of the CPU profile and are usually the fastest way to inspect hotspots.

Suggested investigation flow

  1. Open benchmarking/compare/.results/report.txt and identify largest regressions first.
  2. For each high-delta benchmark, compare:
    • benchmarking/compare/.profiles/main/<benchmark>.md
    • benchmarking/compare/.profiles/<branch>/<benchmark>.md
  3. Look for changes in self/inclusive hotspot share in runtime internals (runtime.js, reactivity/batch.js, reactivity/deriveds.js, reactivity/sources.js).
  4. Make one optimization change at a time, then re-run targeted benches before re-running full compare.

Fast benchmark loops

Run only selected reactivity benchmarks by substring:

pnpm bench kairo_mux kairo_deep kairo_broad kairo_triangle
pnpm bench repeated_deps sbench_create_signals mol_owned

Tests to run after perf changes

Runtime reactivity regressions are most likely in runes runtime tests:

pnpm test runtime-runes

Helpful script

For quick cpuprofile hotspot deltas between two branches:

node benchmarking/compare/profile-diff.mjs kairo_mux_owned main foo

This prints top function sample-share deltas for the selected benchmark.

Practical gotchas

  • bench:compare checks out branches while running. Avoid uncommitted changes (or stash them) so branch switching is safe.
  • Each bench:compare run rewrites benchmarking/compare/.results and benchmarking/compare/.profiles.

sveltejs의 다른 스킬

performance-investigation
sveltejs
성능 회귀를 조사하고 최적화 기회를 찾습니다.
official
svelte-code-writer
sveltejs
Svelte 5 문서 조회 및 코드 분석을 위한 CLI 도구로, 내장된 자동 수정 기능을 제공합니다. 세 가지 핵심 명령어로 구성됩니다: list-sections는 사용 가능한 문서를 탐색하고, get-documentation은 특정 주제의 전체 문서를 가져오며, svelte-autofixer는 코드를 분석하고 수정 제안을 합니다. Autofixer는 --svelte-version 플래그를 통해 Svelte 4 및 5를 대상으로 지정할 수 있고, --async 옵션으로 비동기 모드를 지원합니다. 인라인 코드(이스케이프된 $ 문자 포함)와 파일 경로를 모두 분석 대상으로 받아들입니다.
official
svelte-core-bestpractices
sveltejs
빠르고, 견고하며, 현대적인 Svelte 코드를 작성하기 위한 지침입니다. Svelte 프로젝트에서 Svelte 컴포넌트를 작성, 수정 또는 분석하라는 요청을 받을 때마다 이 스킬을 로드하세요.
official
svelte-code-writer
sveltejs
Svelte 5 문서 조회 및 코드 분석을 위한 CLI 도구. Svelte 컴포넌트(.svelte) 또는 Svelte…를 생성, 편집 또는 분석할 때 반드시 사용해야 합니다.
official
svelte-core-bestpractices
sveltejs
Guidance on writing fast, robust, modern Svelte code. Load this skill whenever in a Svelte project and asked to write/edit or analyze a Svelte component or…
official
scenario-writer
sveltejs
사용자의 설명을 바탕으로 생성할 새 시나리오를 선택하고, ai-scenario-writer 하위 에이전트에 작성을 위임한 후 정확성을 검증합니다.
official
writing-opencode-plugins
sveltejs
OpenCode 플러그인, @opencode-ai/plugin, @opencode-ai/plugin/tui, 플러그인 훅, 커스텀 도구, TUI 라우트, 슬롯, 키맵, 패키징. 생성 시 사용...
official
scenario-writer
sveltejs
사용자의 설명을 바탕으로 새로운 시나리오를 선택하고, ai-scenario-writer 하위 에이전트에게 작성을 위임한 후 정확성을 검증합니다.
official