Home ハウツー 最速のSalesforce Commerce Cloudサイトを入手する方法
Download
Applications

最速のSalesforce Commerce Cloudサイトを入手する方法

About The Author

Outline

2021年にリリースされるGoogleのページエクスペリエンスの更新は 、SEOルールブックをもう一度書き換えることになるでしょう。これにより、可視性のためのウェブサイトの速度の重要性が高まります。 新たに重み付けされたGoogleアルゴリズムは、全体的なユーザーエクスペリエンスでページをよりランク付けするため、遅いeコマースストアは以前よりもさらにランク付けされます。

この変更は、Salesforce Commerce Cloudでストアを運営している多くの大手小売業者や、他の種類のeコマースプラットフォームを使用している小売業者のSERPポジションに深刻な影響を与える可能性があります。 しかし、この変更は、イメージ最適化、遅延読み込み、CDN、タグマネージャなど、標準的な最適化戦略を超えて作業を進めるために必要な、偽装の恩恵と見なすこともできます。 またはAMPを実装します。

この記事では、Salesforce Commerce Cloud (SFCC)を高速化し、Googleの検索結果で上位にランクインする高速で高パフォーマンスのWebサイトを実行するための可能な方法を見ていきます。 または、貴重なお金をロード時間を1秒短縮しようとする代わりに、半分の労力でインスタントローディングWebサイトを配信する方法。

Googleの今後のランキング更新は、eコマースの状況を揺るがす巨人の気まぐれではありません。 これは、eコマースの現在のトレンドと完全に一致しており、非常にパフォーマンスが高く、スピーディなWebサイトに高い評価を与えます。 店舗は、価格とサービスの質だけでなく、全体的な体験をますます重視しています。

Salesforce Commerce Cloudは、他の多くのeコマースプラットフォームと同様に、主にコアビジネス機能に焦点を当てて設計されていることは周知の事実です。製品情報と価格設定を表示し、オペレーターに在庫を管理するための機能バックエンドを提供します。 ウェブサイトの速度の最適化は、プラットフォームの顧客、システムインテグレータ、デザイナー、開発者に任されています。

とんでもありません。 スピードの問題は、Magento、Shopify Plus、Oracle Commerce Cloud、BigCommerce、SAP Commerce Cloud(Hybris)など、人気のあるすべてのSaaS eコマースプラットフォームに浸透しています。 これらのプラットフォームを速度に合わせて最適化する方法については、ブログの他の記事で説明しています。

2020年4月には、500米国の大手インターネット小売業者(IR500)のGoogle Lighthouseスコアを調べ、どのeコマースプラットフォームが常に最速のサイトを提供しているかを調査しました。 残念ながら、結論は、ほとんどのIR500ウェブサイトは、eコマースプラットフォームに関係なく、驚くほど遅く動作するということでした 。 実際、当社のデータによると、社内システムは主要なeコマースプラットフォームを61%上回っています。

Salesforce Commerce Cloud、Magento、Shopify、SAP Commerce Cloud(Hybris)、Oracle Commerce Cloudの主要なeコマースプラットフォーム上のウェブサイトの平均スコアは18.7(15)の中央値)に過ぎませんでした。

Salesforce Commerce Cloudの平均スコアは18.5でした。 中央値は、それぞれ17とMagentoが13.5点であった。 対照的に、社内/自社開発のeコマースシステムを使用しているWebサイトの平均パフォーマンススコアは、IR500より15%高く、平均30.1でした。 おそらくこれは、IR500ウェブサイトの約5分の1が社内eコマースソリューションを使用している理由の1つです。

Salesforce Commerce Cloudは、拡張性に優れたクラウドベースのSaaS型eコマースプラットフォームです。 Salesforceは定期的に新しい機能を追加していますが、その一部はページの読み込みを減らすために使用されています。 実際、Commerce Cloud APIの新しいベータ版は 有望なようですが、判断するには時期尚早です。

Salesforce Commerce Cloudを高速化するためのオプションを見てみましょう。

画像の最適化は、多くのeコマースWebサイトの標準的な戦術です。 今日のエンタープライズeコマースサイトのイメージが非常に多いことを考えると、大規模なWebサイトに実装した場合、画像のわずかな節約でも、サイト全体での大幅な利益に累積的になる可能性があります。

このような最適化戦略には、

  • Closer Point of Presence(POP)から資産にサービスを提供するためのCDNの実装
  • アップロード時の画像のロスレス圧縮
  • 特に長い製品カテゴリのリストページで、折り目のはるか下に表示される遅延読み込み画像

Dynamic Imaging Service(DIS)は、 Salesforceストアへの画像の提供を合理化します。 これにより、小売業者は各画像のサイズの異なるバージョンをアップロードする必要がなくなります。

DISは単一の高解像度画像を取得し、動的に変換して店頭に提供します。 DIS変換パラメータを使用すると、画像のサイズ、トリミング、オーバーレイ、フォーマット、背景色、 および品質設定。

DISを使用すると、マーチャンダイジングやクリエイティブな画像を事前にバッチ処理して、Webフレンドリーにする必要がなくなります。 DISは、単一の画像を使用して、製品ページ、カテゴリページ、推奨製品セクション、検索結果など、各画像アプリケーションに適切なサイズを提供します。

短い答え:いいえ。 少なくとも単独ではない

多くのオペレーターはDISでサイトを高速化できると考えていますが、DISに関するドキュメントでは、利点として速度について直接言及していません。 DISの利点はインストールに依存しますが、画像がリアルタイムで処理されるため、必ずしも高速化につながるとは限りません。

Salesforce Commerce Cloudには、すぐに使えるフレームワークテンプレートがいくつか付属しています。

  • Storefrontリファレンスアーキテクチャ(SFRA)
  • モバイルファーストリファレンスアーキテクチャ(MFRA)
  • SiteGenesis(Salesforceのレガシーリファレンスアーキテクチャ)

Storefrontリファレンスアーキテクチャ は、最新のSalesforceフレームワークテンプレートです。 最先端のモバイルファーストのデザインのために設計されており、SFCCで店舗を構築するときに小売業者にアーキテクチャのリファレンスを提供することを目的としています。 Salesforce Commerce Cloud API、データオブジェクト、およびCommerce Cloud LINK Technology Partner Programを介したサードパーティのテクノロジーとの事前構築済みの統合が組み込まれています。 データオブジェクト、API、サードパーティの要素との事前に構築されたウィジェット/統合を使用します。 これは、古いDemandware Site Genesis(1.0および2.0)プログラムの進化版です。

Storefront Reference Architectureは、フロントエンドの変更(プライマリビジネスケース)に対するサイト開発のニーズを軽減するツールとしての目的であり、ページの読み込み速度を向上させるツールとしての目的ではありません。 これは、統合によってページにサードパーティのテクノロジーとスクリプトが導入され、本質的にページの速度が低下するためです。

簡単に言えばそうでもないです そのために設計されたものではありません

Salesforceリファレンスアーキテクチャは、適応型設計アプローチを採用しているため、モバイルの認識負荷とサーバー側の負荷時間を改善できます。 SFRAには、SFCCバックエンドとの事前接続された統合もいくつか含まれています。つまり、理論的には、カスタム組み込み統合よりも優れたパフォーマンスを発揮するはずです。

しかし、SFRAだけでは、ストアをはるかに速くすることはできません。 これにより、サイト開発が容易になり、総所有コストが削減されます。 ただし、場合によっては、サードパーティ製スクリプトとビルダーによって導入されたテクノロジーの数によっては、ロード時間が悪化することがあります。

全体として、SFRAは最小限の速度の利点しか提供しません。 主な理由は、ページ読み込み時間の75%がさまざまなサードパーティのJavaScript、画像、HTMLからのものであるためです。 そしてほとんどの場合、それを回避する方法はありません。 追加の時間損失は、デザイン、画像サイズ、画像の位置に起因する可能性がありますが、SFRAによって高速化されることはありません。

Salesforce Commerce Cloudストアを最適化して速度を上げる際には、さまざまな戦術を実装できます。 軽量テーマを使用したり、画像を最適化したり、タグの数を減らしたり(またはタグマネージャーを使用したり)、レンダリングをブロックするJavaScriptコードを削除したりすることができます。 これらすべての速度最適化技術に共通するのは、タップされ、要求されたコンテンツの配信を最適化することに重点を置いているということです。 タップ後に起こることを最適化しようとする一般的な戦術の例をいくつか紹介し ます。

  • 遅延読み込み
  • 不要なSalesforce Commerce Cloudアプリのアンインストール
  • 分断したリンクの除去
  • 「デッドウェイト」ページの削除
  • AMPによるモバイル・パフォーマンスの向上

しかし、これは戦いの半分にすぎません。 速度最適化の無限のサイクルを回避するには、すぐに実行する必要があります。 Webサイトを瞬時に(または1秒未満で)作成する には、顧客が何かをクリックする前に機能するテクノロジーの組み合わせが必要です。 これは、ユーザーのタップに反応するのではなく、ユーザーのタップを予測することを意味します。

ストアがSalesforce Commerce Cloudで実行されているか、その他のeコマースプラットフォームやバックエンドシステムで実行されているかにかかわらず、最速のエクスペリエンスを提供するには、スピード重視の高度なWebテクノロジーを実装する必要があります。 そのためには、まず頭を使わずにポータブルフロントエンドを構築する必要があります。

多くのスピード重視のウェブ技術では、バックエンドをフロントエンドから分離する必要があります。つまり、ストアのフロントエンドをポータブルにするか、ヘッドレスeコマースアーキテクチャにサブスクライブする必要があります。 そうすることで、フロントエンドとバックエンドに個別に速度重視の改善を実装することが容易になります。 また、選択したバックエンドで最速のウェブサイトを配信できることも意味します。

Salesforce Commerce Cloudストアでヘッドレスを行うことは、高速なプログレッシブWebアプリ(PWA)フロントエンドを構築するために必要です。 これを行うには、SFCCバックエンドに接続できる強固なAPIカバレッジが必要です。 次に、Webサイトを驚異的に高速化するさまざまな最先端テクノロジーの実装を開始できます。

  • 1高速なブラウジングトランジションを実現するポータブルフロントエンド
  • サーバーサイドレンダリング(SSR)とAMPのサポートにより、超高速の初回ロードを実現します。
  • 予測プリフェッチ
  • エッジコンピューティングを備えた最先端の CDN により、エッジでの動的コンテンツのキャッシュヒット率を最適化し、購入者の数秒前に5を維持

Salesforce Commerce Cloudが、これらのテクノロジーの実装と1秒未満のeコマースWebサイトのサポートにどの程度適しているかを調べてみましょう。

Open Commerce API(OCAPI)は、Salesforce Commerce Cloudで使用されるRESTful APIで、次の3つのコンポーネントAPIで構成されています。

  • Shop API—Commerce Cloudデジタルストアフロント機能へのアクセスを提供します。
  • データAPI:オブジェクト単位でのデジタルアプリケーションの構成および統合機能へのアクセスを提供
  • Meta API—Open Commerce APIで利用可能なリソースとドキュメントの正式な説明にアクセスできます。

Open Commerce APIの使用に関する一般的な情報については、APIの使用法を参照してください。

SFCCには、OCAPI APIに加えて、ベータ版の新しいCCAPIレイヤーがあることに注意することが重要です。

ベータ版は有望なようですが、迅速なヘッドレス店舗をサポートする程度を判断するには時期尚早です。

Salesforce Commerce Cloudは、AMPやSSRをそのままサポートしていません。 また、パイプラインの実装はヘッドレスアーキテクチャではサポートが困難になることがあります。

Salesforce Commerce Cloudでは、PWAツールをすぐに使用することはできません。

しかし、SFCCでプログレッシブウェブアプリを構築するには2つの選択肢があります。

  • SiteGenesisまたはStorefront Reference Architecture(SFRA)で直接PWAをゼロから構築する
  • Commerce Cloudと統合されたサービスとしてのフロントエンドでのITの構築

最新のPWAポータブルフロントエンドは、アプリのような速度を提供します。 ウェブサイトを探索するのがより速くなります。これは特にオンラインストアで顕著です。 ネイティブのような感覚は、SFCCのPWAを競合他社よりも早く感じるでしょう。

標準速度最適化では、総速度の利点に制限があります。 そのような努力はしばしば収益の減少によって支配され、ある時点で、最適化によって得られる利益や利益は投資された金額やエネルギーの量よりも小さいことを示唆している。

Edgioは、速度最適化の概念を元に戻し、買い物客がタップする前に、すべての重い荷物を持ち上げることができます。 高度な予測プリフェッチとエッジキャッシュを備えた最新のCDNを使用することで、タップ後にページレンダリングを最適化するためにスクランブルするのではなく、顧客が次に行うことを期待する内容に基づいて、キャッシュされたJSONデータをエッジからブラウザーにストリーミングできます。 このように、Edgioは常に買い物客の前にあなたのサイトの5を数秒先に保ちます。

Layer0(Edgio)は、数百万ページのeコマースや旅行サイトなどの大規模なデータベース駆動型Webサイトのロードを保証する唯一のプラットフォームです。 私たちの言葉を信じる必要はありません。私たちは、数十のタグ、リアルタイムの在庫、動的な価格設定など、数十の複雑な店舗を支援し、すべての店舗が1秒未満になるよう支援しました。 少し時間を取って、2つの超高速SFCCサイト、Shoe CarnivalまたはKate Spadeをスマートフォンで閲覧し、Layer0で達成可能な速度を体験してください。 私たちはあなたのために同じことをすることができます。

Layer0の目標は、Webを瞬時にシンプルにすることです。 Layer0のWebサイトでは、ページロードの中央値は320ミリ秒(FCP)で、2桁のオーガニックトラフィックとコンバージョンリフトが表示されます。

Layer0(現Edgio)は、開発、導入、プレビュー、実験、監視、 頭のないフロントエンドを動かしてみましょう これには、フルスタックプレビュー環境を備えたアプリケーション対応のCDN-as-JavaScript、組み込みのサーバーサイドレンダリング、高度なプリフェッチ、キャッシングとトラフィックルーティングの完全な制御が含まれます 。 Edgioは、あらゆる最適化作業をミリ秒ごとに圧縮します。 実際、Layer0上で実行されている大規模で動的なWebサイトのページロードの中央値は500ミリ秒未満です。

Shoe CarnivalのSalesforce Commerce Cloudストアは、Layer0(Edgio)で6秒のブラウジングから500ミリ秒に移行しました。

Layer0を使用すると、開発と展開から簡単なロールバックまで、迅速でヘッドレスSFCCストアを非常にシンプルにできます。 次はNuxt、React、Angular SAP/Spartacus、React Storefront、 VUE Storefront—すべての製品をサポートしています。

まとめとして、Salesforce Commerce CloudストアをLayer0で実行する利点をいくつかご紹介します。

速度

より高速なストアを運営することで、お客様に最高の体験を提供し、SERPでより高い評価を得るチャンスを増やすことができます。 KateSpade.comと ShoeCarnival.com は、Layer0で1秒未満の速度でロードされるSalesforce Commerce Cloudサイトのほんの一例です。 実際、シューズ・カーニバルは、最初のページの読み込みが3.4秒、閲覧が6秒であったのを、1 Secondの下で読み込まれるサイトに移行しました。 Layer0では、最初のロードが70.5%高速化され、ロード時間の中央値は1秒になりました。 その後のページロードは、驚くべき92%削減され、わずか500msにまで短縮されました。

シンプルさ

Layer0では、単純な作業ではないヘッドレスのトレンドをサポートしているにもかかわらず、Webをインスタントでシンプルにすることを目指しています。 Layer0のWebサイトでは、サーバーレスJavaScriptプラットフォームを使用してコードをワークフローの中心に置くだけで、開発者の速度と企業の俊敏性が20%向上しています。 Layer0を使用すると、フロントエンドを記述するようにルーティングルールを記述できます。これはフルスタックのJavaScript Everywhereプラットフォームです。

コラボレーション

新しいコードを書くたびに、プリプロダクション環境が自動的に生成されます。 QA担当者やビジネス関係者は、コードがマージされる前にテストしてフィードバックを提供できます。

2021年初頭にGoogleのページエクスペリエンスアップデートが公開されると、速度の遅いウェブサイトは、より速い競合他社に有利にランキングを失います。 ユーザーと検索エンジンにとってスピードは引き続き重要性を増し、トラフィックとコンバージョンリフトを提供します。

文章は壁にかかっています:オンライン小売業者は、標準以下のウェブサイトパフォーマンスを提供するための言い訳を持っていません。 今こそ行動を起こす時です。 これは、eコマースの弱者がより大きな競合他社に追いつくか、または勝つ機会です。 そしてそうする最も簡単な方法はあなたのウェブサイトをsub-secondにすることである。

Salesforce Commerce Cloudストアの最適化には多くの時間と労力がかかり、結果が保証されない場合があります。 しかし、私たちはあなたをカバーしています! Layer0を使用すると、競合他社を一気に駆逐できます。