レガシーUIでのシングル・ページ・アプリケーションのWebサイトのテスト

重要: 新しいシングル・ページ・アプリケーションWebサイトのテストを参照してください

シングル・ページ・アプリケーション(SPA) Webサイト上にA/BおよびMVTキャンペーンを作成できます。

SPAサイトでは通常、パフォーマンスとユーザー・エクスペリエンスを向上させるために、Angular、Backbone.js、Ember.js、Vue.js、Meteor、React、カスタム実装などの一般的なJavaScriptフレームワークが使用されます。

従来のWebページには、サイトの各ページに対応する個別のHTMLページがあります。リンクをクリックすると、URLが変更され、Webサイト全体がリロードされます。SPAサイトでは、ヘッダー、ナビゲーション、ページ・レイアウトなどの共有コンポーネントのリロードが回避されるため、一般的に処理が高速になります。Maxymiserを使用すると、サイトを視覚的に変更できるため、ユーザーがサイトにいる間にページが完全にリロードされなくてもテストできます。

シングル・ページ・アプリケーションのサポートを有効にすると、キャンペーンのレンダリング・ロジックが次のように変更されます。

  • 最初のページ・ロード時にはキャンペーン・コンテンツは返されません。かわりに、レンダリングおよびルーティング・スクリプトが返され、テスト・ページがロードされるまで待機します。
  • 現在のURLがキャンペーンのURLのいずれかとマッチすると、コンテンツが後続のリクエストで返されます。
  • URLの変更およびブラウザの履歴APIに基づいて容易にウォッチおよびアクティブ化できるように、新しいルーティング・スクリプトが追加されます。
  • ビジュアル・エディタを使用して設定されるクリック・アクションおよびページ・ビュー・アクションにも同じロジックが適用されます。

SPAサポートを有効にする手順は、次のとおりです。

  1. キャンペーンを開き、「Content」タブをクリックします。
  2. スクリプト・アイコンスクリプト・アイコンのイメージをクリックします。
  3. 「Rendering」をクリックします。
  4. 「Enable support for Single Page Applications」を選択します。「Manually request Campaign content」オプションが自動的に有効になります。
    「Enable support for Single Page Applications」が選択された状態のスクリプト・パネルが左側で選択されているキャンペーンの「Content」タブのイメージ
  5. キャンペーン要素のURLを入力します。

完全リフレッシュが行われなくても、キャンペーンによって、適切なページでキャンペーン・エクスペリエンスが自動的にアクティブ化されて配信されるようになります。

シングル・ページ・アプリケーション, SPA, 共有コンポーネント, Angular, React, Vue.js, Backbone.js, Ember.js, Meteor, スクリプト・パネル