HARファイルとは？それを生成する方法

HARファイルとは

HARとは、HTTP Archiveの略で、WebブラウザとWebサイト間の情報を追跡するために使用されるフォーマットです。そして、HARファイルには、名前通りに.harという拡張子がついたファイルです。HARファイルの情報はJSON形式で保存されているため、情報を簡単に視覚化するためには、HARファイルビューアなどのツールを使用することができます。

Webサイトのパフォーマンスは非常に重要ですが、Webサイトはしばしば、読み込み時間が遅い、ページレンダリング処理が遅い、コンピューティングリソースが過剰に消費されるなどの問題が発生します。このような場合、HARファイルを生成して分析することができます。こうすることで、サイト管理者はウェブサイトのパフォーマンスの問題を修正し、最適なパフォーマンスを確保することができます。

さて、どのようにHARファイルを生成するのでしょうか？次の内容で答えを探しましょう。

HARファイルの生成方法

Google ChromeやFirefoxなどのブラウザでHARファイルを生成し、開くことができます。

1. Google Chrome ブラウザで HAR ファイルを生成する

以下、詳しい手順を説明します。

ステップ1：Chromeで、問題が発生しているページに移動します。

ステップ2：ブラウザウィンドウの右上にある縦3点アイコンをクリックし、「その他のツール」>「デベロッパーツール」のオプションをクリックします。

ステップ3：すると、ページの右側にデベロッパーツールが開かれます。そこで、「Network」タブをクリックし、「Preserve log」オプションを選択します。

ステップ4：レコードが自動的に開始され、「Network」タブの左上に赤い丸が表示されるはずです。そうでない場合は、「Ctrl+R」を押して、ブラウザのアクティビティーの記録を開始します。

ステップ5：現在閲覧しているウェブページを更新します。この目的は、Google Chromeの記録アクティビティで発生している問題を再現することです。

ステップ6：記録中に問題が発生することに成功したら、「Network」タブを右クリックし、「コンテンツ付きHARとして保存」をクリックして、記録したイベントのコピーを保存し、HARファイルを保存します。

2. Firefox ブラウザで HAR ファイルを生成する

以下、詳しい手順を説明します。

ステップ1：Firefoxで、問題が発生しているページに移動します。

ステップ2：ブラウザウィンドウの右上にある3つの点のアイコンをクリックし、「開発者ツール」>「ネットワーク」オプションをクリックします。

ステップ3: Firefoxの側面にデベロッパーネットワークツールが開きます。そして、ネットワークタブをクリックします。

ステップ4：行動を開始すると、録画が自動的に開始されるはずです。

ステップ5: 今いるウェブページを更新してください。この目的は、Firefoxのアクティビティを記録する際に発生している問題を再現することです。

ステップ6: 問題を再現した後、すべてのアクションが開発者ネットワークパネルに生成されていることがわかります。ファイル列の下の任意の場所を右クリックし、「すべてをハルとして保存」をクリックします。

おすすめ記事：PESファイル：その正体とWindows 10/11で開く方法

結語

この記事は、HARファイルの基本情報と、2種類のブラウザで生成する方法を紹介しました。この簡単なガイドが、HARファイルについての理解を深める一助となれば幸いです。この記事に関するご質問は、コメント欄にご記入ください。