プロファイリングとトレース

トレース

CPUプロファイリングまたはサンプリングプロファイリングは、ビルド中のJavaScriptの実行を追跡するプロファイルを生成し、コードベースのどの部分で、ビルド中にどのくらいの時間が費やされたかを特定するために使用できます。トレースはより高レベルのプロファイルであり、Parcelの実行の特定のフェーズ、呼び出されたプラグイン、各フェーズで費やされた時間を追跡します。

Parcelトレースを使用すると、「ビルド中に最も時間を費やしているプラグインはどれですか？」や「プロジェクト内のどのファイルの変換に最も時間がかかりますか？」などの質問に答えることで、ビルドを最適化できます。これらの質問は、CPUサンプリングプロファイルによって提供されるデータでは簡単に答えることはできませんが、Parcelトレースを使用することで答えることができます。

トレースを実行するオーバーヘッドは比較的少ないですが、ゼロではありません。ビルド中にサンプリングプロファイルを実行するよりも、間違いなくコストが低くなります。特に、生成されるJSONファイルは、使用しているプラグインの数とビルドのサイズによっては非常に大きくなる可能性があります。トレースを有効にするかどうかを決定する際には、これらの要素を考慮してください。

使用方法

CLI

CLIでトレースを生成するには、--trace CLI引数を使用してParcelを起動します。Parcelは、プロジェクトのルートにトレースJSONファイルを生成します。ビルドが開始されると、Parcelはトレースを書き込むファイル名をログに記録します。

API

APIを使用する場合にトレースを生成するには、トレースイベントを有効にするために、ParcelオプションでshouldTrace: trueを渡す必要があります。さらに、ParcelにトレースJSONファイルを作成させるには、additionalReportersを介してトレーサレポーターを追加する必要があります。例:

import {Parcel} from '@parcel/core';

let bundler = new Parcel({
  // ...
  shouldTrace: true,
  additionalReporters: [{
    packageName: '@parcel/reporter-tracer',
    resolveFrom: __dirname,
  }],
});

フォーマット

トレースJSONファイルは、Chromeトレースフォーマットを使用しており、CPUプロファイルと同様ですが、分析方法は少し異なります。

Parcelトレースは、タイプXの完了イベントのみで構成されます。生のイベントは次のようになります。

{"ts":6020131,"pid":11738,"tid":4,"ph":"X","name":"@parcel/transformer-js","cat":"transform","args":{"name":"src/index.html"},"dur":11642},

トレースの分析

ParcelトレースをChrome DevToolsに読み込むことはできますが、そのツールにおけるこの種のプロファイルの分析オプションは非常に限られています。これは、データがDevToolsが設計されているための典型的なデータではないためです。たとえば、トレースイベントには、より詳細な分析に役立つメタデータが含まれていますが、このメタデータはDevToolsからアクセスできません。さらに、中規模から大規模なビルドでは、サイズが大きいため、Chrome DevToolsに読み込むことができないほどの量のデータが生成される可能性があります。

Parcelトレースを分析するための推奨ツールは、Googleによって構築されたPerfettoです。これは、大規模なトレースやブラウザ以外のトレースの処理を目的として特別に設計されています。特に、これらのトレースを分析するためのPerfettoの最も便利な部分は、データをUIを介してクエリできるSQLiteデータベースに読み込むことです。これにより、前述のような質問に答えることができます。

クエリの例

以下は、Parcelビルドに関するいくつかの有用な統計情報を生成するために、Perfettoの「クエリ（SQL）」機能に入力できるクエリの例です。これらの結果の期間は、サンプリングされた合計時間であることに注意してください。Parcelのマルチスレッド実装を考えると、これらの合計時間の一部はParcelビルドのウォールタイムを超える可能性があります。

ビルドのフェーズごとの内訳は？

これは、ビルド、バンドル、パッケージングというビルドの主要なフェーズごとの内訳を提供する高レベルのクエリであり、特定のフェーズが予想よりも長くかかっているかどうかを大まかに特定するのに役立ちます。

select
  name, SUM(CAST(dur AS double)/1000/1000) as dur_ms
from
  slice s
where
  s.category = "Core"
group by name
order by dur_ms desc

ビルドで最も時間を費やしているプラグインは何ですか？

これは、Parcelが最も時間を費やしているプラグインを大まかに特定するのに役立ちます。これらのいくつかはコアプラグインになりますが、カスタムプラグインまたはその他のサードパーティプラグインを使用しているビルドでは、これらのプラグインのいずれかが予想外に多くの時間をかけているかどうかを特定するのに役立つクエリであり、最適化の機会を特定するのに役立ちます。

select
  s.category, name, SUM(CAST(dur AS double)/1000/1000) as dur_ms
from
  slice s
left join
  args using(arg_set_id)
where
  args.flat_key = "args.name"
group by s.category, name
order by dur_ms desc

ビルドで最も時間を費やしているBabelプラグインはどれですか？

これは、ビルドでまだ必要とされ、@parcel/transform-babelによって実行されているBabelプラグインのうち、最も時間を費やしているものを特定するのに役立ち、そのため削除またはParcel変換に置き換えることを優先できます。

select
  name, SUM(CAST(dur AS double)/1000/1000) as dur_ms
from
  slice s
left join
  args using(arg_set_id)
where
  args.flat_key = "args.name" AND
  s.category LIKE "transform:@parcel/transformer-babel%"
group by name
order by dur_ms desc