mcpField
C
cloudflare-web-perf

cloudflare-web-perf

github.com/podoテスト・品質29174 回インストール1 日前に更新
リポジトリ

cloudflare-web-perf について

Cloudflare のウェブパフォーマンススキルのカタログ用スタブです。完全版のインストール方法と、Core Web Vitals の監査および Cloudflare 固有の修正内容を説明します。

主な機能

  1. 01完全版スキルの導入状況確認
  2. 02グローバルまたはプロジェクト単位での導入
  3. 03Core Web Vitals の監査
  4. 04描画とレイアウトの問題特定
  5. 05Cloudflare 固有の修正適用

活用シーン

  1. 01ウェブパフォーマンススキル完全版の導入
  2. 02LCP、INP、CLS、TTFB の監査
  3. 03描画ブロックリソースや画像の問題調査

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/podo/design-agent-skills --skill cloudflare-web-perf

インストール後、Claude Code で/cloudflare-web-perfを入力して読み込まれたか確認します。

同梱ファイルstub.yaml

詳細

cloudflare-web-perf

カタログのスタブ — 完全版スキル:cloudflare/skills

判断ツリー

  1. 完全版スキルはすでにインストールされていますか? この場所にあるスキルに、まだ das: ブロックがあるか確認します。

    • グローバル:grep -q "^das:" ~/.agents/skills/cloudflare-web-perf/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • プロジェクト:grep -q "^das:" .agents/skills/cloudflare-web-perf/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • das: ブロックがない → 完全版スキルがインストール済みです。呼び出して続行してください
    • das: ブロックがある → ステップ 2 に進みます
  2. スコープを検出してからインストールします。

    スコープを検出するには:

    [ -e ~/.agents/skills/cloudflare-web-perf ] && echo "global" || echo "project"
    

    グローバル(-g を付けてインストール):

    npx skills add cloudflare/skills --skill cloudflare-web-perf -g -y
    

    プロジェクト(-g を付けずにインストール):

    npx skills add cloudflare/skills --skill cloudflare-web-perf -y
    

    Claude Code: 会話から離れずに実行するには、どちらかのコマンドを ! で始まるチャットメッセージとして送信します。

インストール後の呼び出し

  • スキル名:cloudflare-web-perf
  • トリガーフレーズ:「ウェブパフォーマンス」、「Core Web Vitals」、「LCP」、「CLS」、「レンダリングブロック」

機能

Core Web Vitals(LCP(Largest Contentful Paint)、INP(Interaction to Next Paint)、CLS(Cumulative Layout Shift))と TTFB を監査して修正する、Cloudflare 公式スキルです。レンダリングをブロックするリソース、最適化されていない画像、レイアウトが不安定になる原因を特定します。Workers、Cache Rules、Image Optimization を使用した、Cloudflare 固有の修正方法も含まれています。

コメント