Constellationアプリケーションのパフォーマンスデバッグツール

DX APIインタラクションのデバッグは、サーバーとクライアントの通信を最適化し、ネットワーク関連のパフォーマンスのボトルネックを特定することに重点を置いています。 

Tracerツール

Tracerツールは、Constellationアプリケーションの重要なパフォーマンスデバッグ機器であり、サーバー側の処理とDX APIの相互作用のタイミングに関する詳細なインサイトを提供します。

Constellationアプリケーションはステートレスアーキテクチャで動作し、各ユーザーアクションが個別のDX API呼び出しをトリガーします。この予測可能なリクエストパターンにより、Tracerツールは処理サイクル全体にわたってパフォーマンス特性をキャプチャして分析できます。その結果、開発者はパフォーマンスの問題が認証のオーバーヘッド、ルール処理の非効率性、セットアップ操作、コアビジネスロジック、または応答生成プロセスに起因しているかどうかを特定します。

この分析では、ステップページのコンセプトを理解することが重要であり、ルールの実行中に重要な役割を果たします。Pega Platformのステップページは、アクティビティで使用できるクリップボードページ、またはステップによって作成された新しいページへの参照です。アクティビティの各ステップに、ステップの実行期間中のプライマリページとなる指定されたステップページを含めることができます。Tracerツールを使用して、Constellation DX API呼び出し中に実行されるルールの現在のステップページを開いたり、特定のページを監視するように設定したりできます。 

特定のDX APIをトレースするには、Dev Studioで対応するService RESTルールを開き、「Actions」メニューから「Trace」をクリックします。Constellation Portalからユースケースを実行します。

次の画像に示すように、「Trace」ボタンはDev Studioの「Actions」メニューにあります。

ビューをトレースし、クライアントに渡されるビューのメタデータを調査するには、Tracerツール設定のView Rules設定を有効にします。 

次の画像に示すように、Tracerツールの設定を開き、Tracerが関連情報をキャプチャするためのView Rulesチェックボックスを選択する必要があります。

Tracerの「View Start」エントリーをクリックして、ビューのメタデータ、コンテキストメタデータ、および依存関係にアクセスします。

次の画像で、メタデータにアクセスする手順を示します。

次のTracer操作は、特にConstellationのパフォーマンス分析に役立ちます。 

• 完全なリクエスターセッションパフォーマンス分析のための完全なトレース実行。対話のライフサイクル全体をキャプチャし、複数のAPI呼び出しにわたる包括的なパフォーマンス評価を可能にします。
• DX API呼び出しのデバッグのためのサービスRESTルールのトレース。APIパフォーマンス特性とタイミング分析に関する詳細なインサイトを提供します。この機能は、サービスRESTシミュレーションシナリオで特に価値があることが証明され、開発者は制御された条件下でパフォーマンスをテストできます。
• Constellation DXAPI呼び出し中に実行されたルールのための現在のステップページへのアクセス。開発者は個々のルールレベルで処理状態とパフォーマンスのボトルネックを調べることができます。
• APIのやり取り中に特定のページを監視するように構成できるページウォッチ機能。重要なアプリケーションコンポーネントに関するターゲットを絞ったパフォーマンス分析を提供します。

複雑なデバッグシナリオにおける明確性を改善するために、Tracer resultsウィンドウはリクエストIDでイベントをグループ化します。この組織的なアプローチは、複数のリクエストを同時にアクティブにすることができ、それぞれが個別の分析と最適化の考慮が必要な異なるパフォーマンス特性を持つため、Constellationアプリケーションにとって不可欠であることがわかります。

次の画像に示すように、Tracer resultsウィンドウは、リクエストIDごとにイベントをグループ化します。

下の図に示されているように、APIパフォーマンスデバッグを強化するには、DebugPegaAPI動的システム設定を「true」に設定します。

「true」に設定すると、このオプションは、Pega API Rest Service Infoステートメントに追加フィールドを記録します。これは、ページの指示とフィールドレベルのセキュリティのデバッグに役立ちます。

DebugPegaAPIルールが有効になると、次の情報がPegaのログファイルに保存されます。

• DX API呼び出しのリクエストボディで使用される入力値
• DX APIによって実行されるアクション
• DX APIでエラーや例外が発生するビュー内のフィールド
• エラーと例外の原因の説明
• エラーコードと例外番号

ブラウザーDevTools

最新のブラウザーでは、Constellationパフォーマンス分析に不可欠な強力な組み込みデバッグ機能が提供されています。これらのツールは、パフォーマンスのボトルネックが頻繁に発生するクライアント側の実行環境への直接アクセスを提供します。

Browser DevToolsには、Chrome、Firefox、EdgeではF12を押すことでアクセスできます。いくつかのタブには、特定のパフォーマンスデバッグ機能があります。 

• Applicationタブ：ローカルストレージとセッションストレージにキャッシュされたアイテムを検査できます。
• Consoleタブ：作業スクリプトをWebページに表示し、デバッグコマンドの実行を可能にします。主なパフォーマンスデバッグコマンドには次のものが含まれます。 
  • PCore.getDataPageUtils() - パフォーマンス分析のために、アプリケーションのデータストアにキャッシュされたデータページを一覧表示します。 Constellationアプリケーションのデータページは、ブラウザーのデータストア内のクライアント側にキャッシュされます。パフォーマンスの問題は、多くの場合、非効率的なデータキャッシュや過剰なデータ取得に起因します。
  • クライアント側の実行を測定するためのパフォーマンスタイミングコマンド：
    • console.time('label') および console.timeEnd('label') - 特定の操作の実行時間を測定します。
    • console.timeLog('label') -処理中に,中間タイミングチェックポイントに記録します。
    • performance.now() -正確なパフォーマンス測定のための高解像度タイムスタンプを提供します。
    • performance.mark() および performance.measure() -詳細な分析のためのカスタムパフォーマンスマーカーを作成します。
• Networkタブ：クライアントとサーバー間のネットワークリクエストとAPIの相互作用を監視し、DX API通信パターンを可視化します。DX API呼び出し（Fetch/XHRによるフィルタリングの選択）を、詳細なリクエストおよび応答情報とともに表示します。このタブをデバッグに効果的に使用するには、デバッグするアクションを実行する前にネットワークログをクリアし、API呼び出しを監視しながらConstellationアプリケーションワークフローを実行します。DX APIエンドポイントのペイロードサイズ、応答時間、ステータスコードに注意してください。個々のリクエストをクリックすると、特定のAPI呼び出しを調べ、詳細なタイミング情報、リクエストヘッダー、応答データを表示できます。この分析は、アプリケーション全体のパフォーマンスに影響を与えるデータフェッチの遅延、大きすぎるペイロード、非効率的なAPIインタラクションパターンを特定するのに役立ちます。TracerツールのDX API呼び出しは、ブラウザーのDevToolsのネットワークトレースに表示されるDX API呼び出しと一致する必要があります。

補足：

次の画像では、Networkタブ(1)の目的は、ブラウザーによって発行されたすべてのネットワークインタラクションを表示することです。Constellationの自己検出は、まずConstellationが行ったDX API呼び出しを観察し、それぞれでやりとりされるJSONデータを観察することから始まります。

XHRは、XHRLHttpRequestの略で、クライアント側のコードが、コードの実行時にアドホックHTTPリクエストを実行するために使用する基盤となるライブラリです。 

Fetch/XHRフィルター(2)は、ブラウザーによって取得された他のタイプのコンテンツを表示せずに、DX API呼び出しを表示する場合に便利です。項目3の左側には、Networkタブでキャプチャされたすべてのイベントを削除するClearアイコンがあります。 

次の画像では、ChromeブラウザーのDevToolsメニュー内のこれらのタブの位置を示しています。

クライアント側のインタラクションのデバッグは、Reactコンポーネントのレンダリング、Redux状態管理、UIの応答性の最適化に対処します。

React DevTools 

React DevToolsは、React固有のパフォーマンスデバッグ機能を提供するオープンソースのブラウザー拡張機能です。このツールは、ChromeやFirefoxで利用でき、スタンドアロンアプリケーションとして、以下が可能です。 

• コンポーネントの再レンダリングパフォーマンスと頻度を監視する 
• Reactコンポーネント階層を検査する
• コンポーネントのライフサイクルパフォーマンスを分析する 
• コンポーネントのレンダリング時間と最適化の機会をプロファイルする 

React DevToolsはブラウザーのDevToolsと統合され、ConstellationなどのReactベースのアプリケーション用に特別に設計された、パフォーマンスプロファイリング機能を備える「Components」とよばれる専用のReactタブを追加します。 

Redux DevTools 

Redux DevToolsは、Reduxの状態管理パフォーマンスをデバッグするための強力なブラウザー拡張機能です。これは、Constellationのクライアント側のデータ管理を理解する際に、特に価値があります。Reduxツールは、開発者がアプリケーションの状態を経時的に検査および追跡し、ディスパッチされたアクションを表示し、状態の変化を分析するのに役立ちます。Redux DevToolsは、アクションの追跡と再生、Reduxストアの検査、状態変異の監視のための視覚的なインターフェイスを提供することで、複雑な状態ロジックのデバッグを大幅に簡素化します。

次の表では、お好みのブラウザーの拡張機能へのリンクが示されています。

The UI Inspector

UI Inspectorは、画面上のUIコンポーネントを選択して、UI階層内のその場所に関するインサイトを得ることができる、組み込みのPega Platformツールです。また、メタデータ、フィールドプロパティ、ビュープロパティなど、Constellation UIコンポーネントに関する情報を視覚化することもできます。

次の問題に答えて、理解度をチェックしましょう。