Claude Code Plugins

Community-maintained marketplace

Feedback

.claude/skills/web-performance/SKILL.md

@daishiman/AIWorkflowOrchestrator
2
0

|

Install Skill

1Download skill
2Enable skills in Claude

Open claude.ai/settings/capabilities and find the "Skills" section

3Upload to Claude

Click "Upload skill" and select the downloaded ZIP file

Note: Please verify skill by going through its instructions before using it.

SKILL.md

name .claude/skills/web-performance/SKILL.md
description Next.jsアプリケーションのパフォーマンス最適化を専門とするスキル。 📖 参照書籍: - 『High Performance Browser Networking』(Ilya Grigorik): パフォーマンス測定 📚 リソース参照: - `resources/Level1_basics.md`: レベル1の基礎ガイド - `resources/Level2_intermediate.md`: レベル2の実務ガイド - `resources/Level3_advanced.md`: レベル3の応用ガイド - `resources/Level4_expert.md`: レベル4の専門ガイド - `resources/code-splitting.md`: Code Splittingリソース - `resources/dynamic-import.md`: Dynamic Importリソース - `resources/font-optimization.md`: Font Optimizationリソース - `resources/image-optimization.md`: Image Optimizationリソース - `resources/legacy-skill.md`: 旧SKILL.mdの全文 - `scripts/analyze-bundle.mjs`: Analyze Bundleスクリプト - `scripts/log_usage.mjs`: 使用記録・自動評価スクリプト - `scripts/validate-skill.mjs`: スキル構造検証スクリプト - `templates/dynamic-import-template.md`: Dynamic Importテンプレート - `templates/image-component-template.md`: Image Componentテンプレート - `resources/requirements-index.md`: 要求仕様の索引(docs/00-requirements と同期) Use proactively when handling web performance tasks.
version 1.0.0
level 1
last_updated Wed Dec 24 2025 00:00:00 GMT+0000 (Coordinated Universal Time)
references [object Object]

Web Performance

概要

Next.jsアプリケーションのパフォーマンス最適化を専門とするスキル。

詳細な手順や背景は resources/Level1_basics.mdresources/Level2_intermediate.md を参照してください。

ワークフロー

Phase 1: 目的と前提の整理

目的: タスクの目的と前提条件を明確にする

アクション:

  1. resources/Level1_basics.mdresources/Level2_intermediate.md を確認
  2. 必要な resources/scripts/templates を特定

Phase 2: スキル適用

目的: スキルの指針に従って具体的な作業を進める

アクション:

  1. 関連リソースやテンプレートを参照しながら作業を実施
  2. 重要な判断点をメモとして残す

Phase 3: 検証と記録

目的: 成果物の検証と実行記録の保存

アクション:

  1. scripts/validate-skill.mjs でスキル構造を確認
  2. 成果物が目的に合致するか確認
  3. scripts/log_usage.mjs を実行して記録を残す

ベストプラクティス

すべきこと

  • resources/Level1_basics.md を参照し、適用範囲を明確にする
  • resources/Level2_intermediate.md を参照し、実務手順を整理する

避けるべきこと

  • アンチパターンや注意点を確認せずに進めることを避ける

コマンドリファレンス

リソース読み取り

cat .claude/skills/web-performance/resources/Level1_basics.md
cat .claude/skills/web-performance/resources/Level2_intermediate.md
cat .claude/skills/web-performance/resources/Level3_advanced.md
cat .claude/skills/web-performance/resources/Level4_expert.md
cat .claude/skills/web-performance/resources/code-splitting.md
cat .claude/skills/web-performance/resources/dynamic-import.md
cat .claude/skills/web-performance/resources/font-optimization.md
cat .claude/skills/web-performance/resources/image-optimization.md
cat .claude/skills/web-performance/resources/legacy-skill.md

スクリプト実行

node .claude/skills/web-performance/scripts/analyze-bundle.mjs --help
node .claude/skills/web-performance/scripts/log_usage.mjs --help
node .claude/skills/web-performance/scripts/validate-skill.mjs --help

テンプレート参照

cat .claude/skills/web-performance/templates/dynamic-import-template.md
cat .claude/skills/web-performance/templates/image-component-template.md

変更履歴

Version Date Changes
1.0.0 2025-12-24 Spec alignment and required artifacts added