コンテンツにスキップ

CPU使用量のプロファイリング

WorkerがCPU集約型のタスクを実行するのに時間がかかりすぎると、応答が遅くなるか、時間制限のためにWorkerが起動しない可能性があります。

DevToolsでのプロファイリングは、CPUを過剰に使用しているコードを特定し、修正するのに役立ちます。

本番環境で特定の関数の実行時間を測定するのは難しい場合があります。なぜなら、Workersはセキュリティ上の理由からI/Oのみにタイマーをインクリメントするからです。しかし、ローカル開発ではDevToolsを使用してCPU実行時間を測定することが可能です。

プロファイルの取得

CPUプロファイルを生成するには:

  • wrangler devを実行してWorkerを起動します
  • ターミナルからdを押してDevToolsを開きます
  • “Profiler”タブをクリックします
  • StartをクリックしてCPU使用量の記録を開始します
  • 新しいタブからWorkerにリクエストを送信します
  • Stopをクリックします

これでCPUプロファイルが取得できました。

プロファイルの例

CPUプロファイルの読み方を学ぶために、例を見てみましょう。次のWorkerがあるとします:

index.js
const addNumbers = (body) => {
for (let i = 0; i < 5000; ++i) {
body = body + " " + i;
}
return body;
};
const moreAddition = (body) => {
for (let i = 5001; i < 15000; ++i) {
body = body + " " + i;
}
return body;
};
export default {
async fetch(request, env, ctx) {
let body = "Hello Profiler! - ";
body = addNumbers(body);
body = moreAddition(body);
return new Response(body);
},
};

どの部分のコードが応答時間を遅くしているのかを見つけたいと思います。DevToolのプロファイリングを使用して、CPUを多く消費しているコードを特定し、問題を修正するにはどうすればよいでしょうか?

まず、上記のように、wrangler devを実行した後にdを押してDevToolsを開きます。次に、“Profiler”タブに移動し、Startを押してプロファイルを取得し、リクエストを送信します。

CPUプロファイル

この画像の上部のチャートはプロファイルのタイムラインを示しており、特定のリクエストにズームインするために使用できます。

下のチャートは、リクエスト中に実行された操作に使用されたCPU時間を示しています。このスクリーンショットでは、上部に”fetch”時間が表示され、その下にaddNumbersmoreAdditionsの2つの関数のサブコンポーネントが表示されています。各ボックスにマウスをホバーさせると、詳細情報が表示され、ボックスをクリックすると関数のソースコードに移動します。

このグラフを使用して、「何がCPU時間を消費しているのか?」という質問に答えることができます。addNumbers関数は非常に小さなボックスを持ち、0.3msのCPU時間を表しています。moreAdditionsボックスは大きく、2.2msのCPU時間を表しています。

したがって、応答時間を速くしたい場合は、moreAdditionsを最適化する必要があります。

また、視覚化を「チャート」から「ヘビー(ボトムアップ)」に変更して別のビューを得ることもできます。

CPUプロファイル

これにより、各関数に割り当てられた相対的な時間が表示されます。リストの上部には、moreAdditionsが明らかにWorkerの中で最も遅い部分であることが示されています。また、ガーベジコレクションも大きな割合の時間を占めているため、メモリの最適化が有用である可能性があります。

追加リソース

CPUプロファイラの使用方法について詳しくは、GoogleのDevToolsにおけるCPUのプロファイリングに関するドキュメントを参照してください。

メモリに関する洞察を得るためにDevToolsを使用する方法については、メモリ使用量のドキュメントを参照してください。