oo

ページ監査ツールについて

important

この機能は現在、ベータ機能のフラグが立っている。 詳しくは Beta Feature Flags を参照してください。

Page Audit(ページ監査)ツールは、サーバーのレンダリング時間、コンポーネントの種類、コンポーネントのオリジン、キャッシュの状態などのパフォーマンス関連情報と、潜在的なパフォーマンス問題に関する警告メッセージを表示します。

ページ監査ツールの表示と使用には、少なくとも2つの パーミッション が必要です。 Site and Asset Library Administration → Site Builder → Pages で設定します:

  1. サイトおよびアセットライブラリ管理 の「一般権限」でのアクセス

  2. ページの下にある パーミッションを更新する

ページ監査は、ユーザーがパフォーマンスに関連する問題を特定し、解決するのに役立つ強力なツールです。

ページ監査ツールの使用

ページ監査ツール(Page Audit tool)は、ページ上部のアプリケーションバーに表示されます。

  1. Page Audit ツールアイコンをクリックすると、右側に情報が表示されるサイドバーが開きます。

    Performanceタブの下に、ページ上の全コンポーネントのリストが表示されます。

    各コンポーネントには、コンポーネントの名前、レンダリング時間(ミリ秒)、タイプ(フラグメント、コレクション、ウィジェットなどのタイプを識別するラベル)、キャッシュステータスを示す情報カードと、コンポーネントと対話するためのアイコンがあります。

    PageSpeed Insightsの下に、Googleの PageSpeed Insights サービスが設定されている場合、Liferay DXPのための特定の推奨事項を見ることができます(APIキーが必要です)。

  2. カードにカーソルを合わせると、ページ内のコンポーネントがハイライトされます。

  3. Locate(Locate icon) をクリックして、コンポーネントを見つけ、ページの中央に配置します。

  4. フラグメントで、 開く(Open in) をクリックして、フラグメントライブラリに移動します。

  5. (オプション) カードをクリックすると、コンポーネントに関する 警告と基本情報 が表示されます。

  6. (オプション) 利用可能なツール (Search、Filter、Sort) を使って、コンポーネントを整理したり、見つけたりします。

パフォーマンス・タブ・ツール

パフォーマンス」タブの下には、ナビゲーションを容易にするツールがある。

検索 特定のコンポーネントを名前から検索します。

フィルタ: ナビゲーション(AllまたはFrom Master - マスターページからのコンポーネント)、キャッシュステータス(CachedまたはNot Cached)、コンポーネントタイプ(Fragment、Widget、Collectionなど)でフィルタリングします。

並べ替え: コンポーネントをレンダリング時間でソートします。 デフォルトでは、アイテムはレンダリング時間が遅いものから速いものへと並べられます。

Tools under the Performance tab help you organize and find components around the page.

警告と基本情報

コンポーネントカードをクリックすると、そのコンポーネントに関する警告と基本情報が表示されます。

警告は、ページコンポーネントのパフォーマンスに問題がある可能性を示しています。

警告

警告は、ページコンポーネントのパフォーマンスに問題がある可能性を示しています。 また、問題を解決し、ページを最適化するための提案も含まれています。

これが警告のリストだ:

コンポーネント 警告 可能な解決策
コレクション・ディスプレイの断片 ページネーションが無効になっています。 コレクションアイテムの数が200を超えると、この設定はページのパフォーマンスに深刻な影響を与える可能性があります。 代わりにページネーションを使用することを強くお勧めします。 コレクション表示のページネーションを有効にする
画像の断片 大きな画像ファイルサイズが使用されています。 アダプティブメディアの設定、遅延読み込み、画像サイズの縮小などをご検討ください。 アダプティブ・メディアの設定、遅延読み込みの有効化、より小さな画像ファイルのアップロード

基本情報

コンポーネントカードは、コンポーネントの基本情報を表示します。 以下はそのリストである:

warning

レンダリング時間は概算であり、様々な要因(サーバーの状態や負荷など)によって若干の変動があります。

詳細 説明
サーバー描画時間 ミリ秒単位のレンダリング時間
コンポーネント種別 コンポーネントのタイプ:フラグメント、ウィジェット、コレクション
作成元 コンポーネントの生成元 (例えば、表示されているページと同じページに生成元がある場合は、このページ)
キャッシュのステータス コンポーネントのキャッシュ状態:キャッシュされているかどうか。