Lightning Aura Components Developer Guide (Lightning Aura コンポーネント開発者ガイド)
jJavaScript コードへの Lightning Locker の影響のベンチマーク
このベンチマークにより、コンポーネントをテストするアプリケーションを作成することなく、Lightning Locker が有効な場合と無効な場合のパフォーマンスの違いを確認できます。
例
例を見てください。一連のネストしたループのパフォーマンスについて研究しましょう。
- 次のコードをコードコンソールに張り付けます。
-
[Benchmark (ベンチマーク)] をクリックします。
結果ウィンドウの [FASTEST] 列には、Lightning Locker が無効な場合に 6.5 倍の速さでコードが実行されることが示されています。この速度の違いがセキュリティのコストであり、このパフォーマンス損失を受け入れることができるかどうかは、各事例によって異なります。
このベンチマークアクションにより、コードを調整し、実行時に変更がどのように影響するかを確認できます。計算が集中するコードのセクションを最適化する場合、この迅速な反復プロセスが役立ちます。
向上したパフォーマンスの例
Lightning Locker のオーバーヘッドを軽減する方法を示すため、HTML の文字列を使用する同じテーブルを作成し、ベンチマークを実行して、違いを評価します。
- 次のコードをコードコンソールに張り付けます。
-
[Benchmark (ベンチマーク)] をクリックします。
この例のループ内に document.createElement() などの DOM API コールがないため、build() 関数のパフォーマンスは、Locker が有効であるか無効であるかに関係なく似ています。Lightning Locker が無効な場合、コードは 1.08 倍の速さで実行されます。複数の DOM API コールが含まれる前の例では 6.5 倍の速さでした。
一般に、簡単な JavaScript は DOM API よりもはるかに高速であり、DOM へのコードセクションの接続頻度が高いほどコードの実行時間が遅くなります。Locker のほとんどのオーバーヘッドの原因は DOM API にあります。ここでは、DOM への接続回数を減らすことでコードを加速化します。これにより、Locker 全体のオーバーヘッドも大幅に軽減されます。