Devtools

DevToolsを使用すると、ライブセッション中であってもセッション履歴であっても、リアルタイムでブラウザセッションを監視およびデバッグできます。DevToolsはコンテンツが豊富で、3つの主要なイベントカテゴリを網羅しています。

Console

Consoleパネルには、ページからのリアルタイムのログ出力が表示されます。プレイグラウンドでは、console.logなどのステートメントを追加することで、変数値の検査、関数実行のトレース、論理エラーの特定を迅速に行うことができます。これは、自動化スクリプトや複雑なワークフローのデバッグに特に役立ちます。

• ライブログとエラー監視: ページのJavaScriptによって生成されたリアルタイムのログ、警告、エラーメッセージを表示し、コードの問題を迅速に見つけます。
• 自動化スクリプトのデバッグ: コンソールは、自動化スクリプトをデバッグするための不可欠なツールです。重要な情報を出力し、スクリプトの実行フローを追跡し、潜在的なサーバー側のエラーを表示することで、デバッグ効率を大幅に向上させます。

Network

Networkパネルは、各リクエストの基本的な詳細の概要を明確に示し、個々のエントリをクリックして展開することで、応答ヘッダーなど、完全なリクエスト情報を検査できます。

• パフォーマンス分析: ネットワークリクエストのタイムラインと読み込み時間を分析することにより、大きな画像や遅いAPI応答など、ページの読み込み速度を低下させるボトルネックを特定します。
• リクエストとレスポンスの検査: 個々のリソースのプロパティ（HTTPヘッダー、コンテンツ、サイズなど）を調べ、期待どおりに読み込まれていることを確認します。キャッシングポリシーなどの設定を確認するために、すべてのリソースのヘッダーとレスポンスを検索することもできます。

Elements

Elementsパネルを使用すると、現在のページのHTML構造と関連付けられたCSSスタイルを直接表示できます。

ライブセッションを最大限に活用したいですか？Scrapelessブラウザコンソールを使用すると、要素の検査、リアルタイムでのスクリプトの実行、クラウドでの直接デバッグを行うことができます。開発とトラブルシューティングのスピードアップに役立つ使用方法については👉Brand-New Real-Time Browser Console Is Live