この記事の対象
- サイト運営担当のエンジニア
- ページ全体の読み込み速度を管理監督する部門担当の方
この記事の目的
- 対象ページの読み込み・表示完了を遅延させるリスクのある Kaizen タグ設置ケースを理解する
1. 遅延させるリスクがある Kaizen タグの設置ケース
対象ページ HTML に Kaizen タグを直接設置する場合です。
- script タグを HTML に直接記述するので、Kaizen タグの読み込みは同期的に行われます。
- ＝タグ読み込み完了するまで、後続のページ表示処理が止まります。
- ＝万が一 Kaizen タグを配信している弊社 CDN サーバに障害が起きた際、最悪のケースとして元ページの表示処理が数十秒止まるリスクもあります。
ただしページ HTML に Kaizen タグを直接埋め込むメリットもあります:
- <head> タグ内に Kaizen タグを設置した場合、A/B テストによる改善デザイン案の画面反映が最速で行われる為、見た目が一瞬チラつく等の視覚的な混乱を回避できます。
2. 遅延させるリスクが無い Kaizen タグの設置ケース
Google Tag Manager (GTM)等のタグ配信ツールを使って Kaizen タグを配信する場合です。
- GTM 等のタグ配信ツールを使うと Kaizen タグは非同期処理によってページに読み込まれます。
- ＝非同期処理なので、元ページの読み込みや表示処理を疎外しません。
- ＝万が一弊社 CDN サーバに障害が起きたとしても、同様に元ページの処理に影響は与えません。
ただし直接ページに Kaizen タグを埋め込む場合と比較すると、以下の事象は回避できません:
- Kaizen タグが非同期で読み込まれる = タグ読み込み完了タイミングが、ページ表示完了後になる可能性もある。その際、A/B テストによる改善デザイン案の画面反映が「一瞬画面がチラつく」「突然異なる画面表示に差し替わる」等の視覚的なマイナス印象をユーザーに与える可能性があります。
タグ読み込み以降の各種 Kaizen タグ実施処理は、元ページの読み込みに影響は与えません
以下の詳細な処理シーケンス図に示す通り、Kaizen タグが実施する各種処理 (特に通信が発生する処理) についてはすべて「非同期処理」で実装されている為、元ページの読み込みに影響は与えません。
0 コメント