> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# フリッカー管理とパフォーマンス

> フリッカーの原因を理解し、Kameleoonアプリケーションファイルに組み込まれたアンチフリッカー技術を適用することで、Kameleoon A/Bテストでのフリッカーを排除します。

フリッカーには通常、2つの主な原因があります。

* スクリプトが、ブラウザがすでにページまたはその一部を表示した後にロードおよび実行される場合。このタイミングの問題は、KameleoonがWebサイトにどのように実装されているかに直接関連しています。Kameleoonのロードが遅すぎる場合、またはタグ管理システム内に統合されている場合、フリッカーを避けることはできません。
* 実験のバリエーションを処理するエンジンが遅すぎて、変更を十分な速度で実行できない場合。

Kameleoonのスクリプトには、A/Bテストがスムーズに実行されるようにするユニークな[アンチフリッカーエンジン](#実験でフリッカーを防ぐ方法)が含まれており、テストバリエーションが遅延なく表示され、より良いユーザーエクスペリエンスとより信頼性の高いテスト結果につながります。

## この技術の主な利点:

Kameleoonのアンチフリッカー技術がユニークで強力である理由は以下のとおりです。

* **非同期スニペット**:Kameleoonは信頼性の高いCDN(Cloudflare)からスクリプトを非同期にロードし、最初のページロードをノンブロッキングにすることを保証し、その後のページロードを高速化するためにブラウザキャッシュを活用します。Kameleoonは99.99%を超えるサービスレベル契約(SLA)を維持しています。

* **小さなスクリプトサイズ**:TypeScriptを使用して作成されたアプリケーションファイルは、わずか29 kB(Brotliで圧縮)のサイズで、最初のページのロード時間を最小限に抑えます。

* **前処理アプローチ**:Kameleoonスクリプトは、使用している機能とオプションに基づいて、特定のセットアップに必要なコンポーネントからのみ生成されます。

* **ユニークなアンチフリッカーエンジン**:エンジンはDOMイベントをリアルタイムにキャプチャし、実験バリエーションに関連するコンポーネントの表示を完全にレンダリングされる前に変更します。

* **ネットワークコールの削減**:スクリプトは複数のトラッキングイベントを1つのビーコンコールにまとめ、必要なネットワークコールの総数を大幅に削減します。

* **単一スクリプトロード**:複数のファイルを必要とする他のプラットフォームとは異なり、Kameleoonは1つの統合スクリプトをロードします。これによりHTTPリクエストの数が削減されます。

* **遅延実験ロード**:Kameleoonでは、最初のページロード時にアプリケーションファイル`engine.js`(以前は`kameleoon.js`という名前)に含める実験を、ケースバイケースで選択でき、[重要でない実験を遅延](../faq#can-i-delay-non-essential-experiments-until-after-the-first-page-load)させて最初のロード後に実行できます。

* **リアルタイム更新**:ブラウザキャッシュに妨げられることなく、より頻繁な更新を提供するため、Live Update Experiments機能は「LIVE-UPDATE」とラベル付けされた実験を1分以内に更新します。

## 実験でフリッカーを防ぐ方法

アプリケーションファイルをロードする際に発生するフリッカーを排除するには、[アンチフリッカー付き非同期タグ](../implementation-and-deployment/standard-implementation#アンチフリッカー付き非同期タグ)を使用してください。

スニペットには「ブロッキングCSSルール」が含まれており、スクリプトがブラウザによってダウンロードされる間、ページのすべてのコンテンツを最初は非表示にします。Kameleoonはアプリケーションコードがロードされた時点(通常50ミリ秒未満)で、このルールを削除します。指定されたタイムアウト期間(デフォルト1000ミリ秒)内にアプリケーションコードがロードされない場合、空白ページが無限に表示されるのを防ぐためにルールも削除されます。このアプローチにより、Kameleoonがどのような状況でもWebサイトを妨害できないことが保証されます。

<Note>
  タイムアウトは、Kameleoonインストールタグで調整可能な`kameleoonLoadingTimeout` JavaScript変数で管理されます。デフォルトでは、この変数は**1000ミリ秒**に設定されています。Kameleoonはこの値を維持することを推奨します。この変数は、Kameleoonアプリケーションファイルのロードを待つ間に、Kameleoonインストールタグがサイトの表示を妨げることができる最大時間を示します。

  タイムアウトが発生した場合、Kameleoonコードが最終的にロードされたときに、選択された構成により次の動作が決まります。Kameleoon[プロジェクト](/user-manual/project-management/manage-your-projects#add-a-new-project)の詳細確認設定で2つのオプションがあります。

  1. **Kameleoonを完全に無効化:** タイムアウトが発生した場合、その特定の訪問者に対して実験やパーソナライゼーションは実行されません。

  2. **Kameleoonコードを通常通り実行:** この場合、コードが遅れて実行され、ページにフリッカーが発生する可能性があります。

  デフォルトのタイムアウト値を調整しない場合、通常の状況(適切なインターネット速度など)ではタイムアウトは比較的まれで、訪問者の約2\~3%でのみ発生することに留意してください。
</Note>

推奨されませんが、同期タグを実装することもできます。同期ロードの場合、タグがHTMLの`<head>`セクションに含まれている限り、自動的な保証が提供されます。この保証は、ブラウザがKameleoonアプリケーションファイルを完全にダウンロードして実行するまでコンテンツをレンダリングしないため存在します。ただし、ブロッキング方式でリソースをロードすることはベストプラクティスとは見なされません。

正しい方法を実装しても、A/Bテストソリューションの基盤となるエンジンがフリッカー防止に最適化されていない場合、フリッカー効果が発生する可能性があります。Kameleoonは、グラフィカルエディタを通じて行われたあらゆる変更に対して、これらの最適化を自動的に保証します。カスタムJavaScriptコードを利用するバリエーションのためにAPIが用意されており、スムーズなエクスペリエンスを保証します。問題を避けるため、これらのAPIを正しく使用してください。手書きのポーラーや他のカスタムコードを使うのではなく、要素への変更や、ページに要素が表示されるのを待つ操作はすべて、[JavaScript APIメソッド](../../apis/activation-api-js/api-reference/api-reference#kameleoonapicore)、特に`Kameleoon.API.Core.runWhenElementPresent()`を使用して実行してください。

<Note>
  バリエーション用のJavaScriptコードを実装する際は、行いたい変更と、それが適用される特定のDOM要素を考慮してください。これらの要素に対する適切なCSSセレクタを特定したら、変更呼び出しを`Kameleoon.API.Core.runWhenElementPresent()`に提供するコールバック関数内に囲ってください。このアプローチには2つの重要な利点があります:第一に、要素がDOMに存在した後にのみコードが実行されるようにするため、コードが時期尚早に実行された場合に発生する可能性のある問題を防ぎます。第二に、不要なフリッカー効果のリスクを排除します。
</Note>

## フリッカー管理がパフォーマンスに与える影響

パフォーマンスモニタリングソリューションは価値ある洞察を提供しますが、特に実験プラットフォームに関しては全体像を示すものではありません。

真のパフォーマンスとは、速度、正確性、シームレスなユーザーエクスペリエンスの提供との適切なバランスを見つけることです。Kameleoonはこのバランスを効果的に達成しています:実験スニペットは、パフォーマンスとユーザーエクスペリエンスの両方を最適化するように特別に作られています。Kameleoonはエンジンと、プラットフォームで設定したあらゆる構成(実験、ゴール、カスタムスクリプトを含む)を含む単一のスクリプトをロードします。その後に追加のスクリプトはロードされません。

アンチフリッカーエンジンを一時的に無効化するとモニタリングツールのパフォーマンスメトリクスが改善する可能性がありますが、フリッカーを導入することでユーザーエクスペリエンスと結果の正確性を損ないます。このトレードオフは受け入れられません。
