jpskill.com
📦 その他 コミュニティ

network-debugging

Debug network issues using browser tools and network analysis. Diagnose connection problems, latency, and data transmission issues.

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux 
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o network-debugging.zip https://jpskill.com/download/21482.zip && unzip -o network-debugging.zip && rm network-debugging.zip
🪟 Windows (PowerShell) 
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/21482.zip -OutFile "$d\network-debugging.zip"; Expand-Archive "$d\network-debugging.zip" -DestinationPath $d -Force; ri "$d\network-debugging.zip"

完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。

💾 手動でダウンロードしたい(コマンドが難しい人向け)
  1. 1. 下の青いボタンを押して network-debugging.zip をダウンロード
  2. 2. ZIPファイルをダブルクリックで解凍 → network-debugging フォルダができる
  3. 3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
  4. 4. Claude Code を再起動
⬇ .zip でダウンロード(推奨) ⬇ .skill 形式(上級者用) 元のソース ↗

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →
最終更新
2026-05-18
取得日時
2026-05-18
同梱ファイル
6

📖 Skill本文(日本語訳)

※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。

ネットワークデバッグ

目次

概要

ネットワークデバッグは、アプリケーションのパフォーマンスに影響を与える接続の問題、遅延の問題、データ転送エラーを特定します。

使用する場面

  • ロード時間の遅延
  • リクエストの失敗
  • 断続的な接続
  • CORS エラー
  • SSL/TLS の問題
  • API 通信の問題

クイックスタート

最小限の動作例：

Chrome DevTools Network Tab:

Columns:
  - Name: Request file/endpoint
  - Status: HTTP status code
  - Type: Resource type (xhr, fetch, etc)
  - Initiator: What triggered request
  - Size: Resource size / transferred size
  - Time: Total time to complete
  - Waterfall: Timeline visualization

Timeline Breakdown:
  - Queueing: Waiting in queue
  - DNS: Domain name resolution
  - Initial connection: TCP handshake
  - SSL: SSL/TLS negotiation
  - Request sent: Time to send request
  - Waiting (TTFB): Time to first byte
  - Content Download: Receiving response

---
Network Conditions:

Throttling Presets:
  - Fast 3G: 1.6 Mbps down, 750 Kbps up
// ... (see reference guides for full implementation)

リファレンスガイド

references/ ディレクトリにある詳細な実装：

ガイド 内容
Browser Network Tools ブラウザのネットワークツール
Common Network Issues よくあるネットワークの問題
Debugging Tools & Techniques デバッグツールとテクニック
Checklist チェックリスト

ベストプラクティス

✅ DO

  • 確立されたパターンと慣例に従う
  • クリーンで保守しやすいコードを書く
  • 適切なドキュメントを追加する
  • デプロイ前に徹底的にテストする

❌ DON'T

  • テストや検証をスキップする
  • エラー処理を無視する
  • 設定値をハードコードする
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開

Network Debugging

Table of Contents

Overview

Network debugging identifies connectivity issues, latency problems, and data transmission errors that impact application performance.

When to Use

  • Slow loading times
  • Failed requests
  • Intermittent connectivity
  • CORS errors
  • SSL/TLS issues
  • API communication problems

Quick Start

Minimal working example:

Chrome DevTools Network Tab:

Columns:
  - Name: Request file/endpoint
  - Status: HTTP status code
  - Type: Resource type (xhr, fetch, etc)
  - Initiator: What triggered request
  - Size: Resource size / transferred size
  - Time: Total time to complete
  - Waterfall: Timeline visualization

Timeline Breakdown:
  - Queueing: Waiting in queue
  - DNS: Domain name resolution
  - Initial connection: TCP handshake
  - SSL: SSL/TLS negotiation
  - Request sent: Time to send request
  - Waiting (TTFB): Time to first byte
  - Content Download: Receiving response

---
Network Conditions:

Throttling Presets:
  - Fast 3G: 1.6 Mbps down, 750 Kbps up
// ... (see reference guides for full implementation)

Reference Guides

Detailed implementations in the references/ directory:

Guide Contents
Browser Network Tools Browser Network Tools
Common Network Issues Common Network Issues
Debugging Tools & Techniques Debugging Tools & Techniques
Checklist Checklist

Best Practices

✅ DO

  • Follow established patterns and conventions
  • Write clean, maintainable code
  • Add appropriate documentation
  • Test thoroughly before deploying

❌ DON'T

  • Skip testing or validation
  • Ignore error handling
  • Hard-code configuration values

同梱ファイル

※ ZIPに含まれるファイル一覧。`SKILL.md` 本体に加え、参考資料・サンプル・スクリプトが入っている場合があります。