勝手にスピードテスト Powered by SpeedCurve

ECプラットフォームで通販サイトの表示スピードに違いはあるのか？【主要5カートサービスの表示速度とコアウェブバイタルを分析】

「ecbeing」「EC-cube」「EC-ORANGE」「Shopify」「CommerceCloud 」の表示スピードと「コアウェブバイタル」の違いを分析

2022年3月16日 8:00

Eコマースおいて、Web表示スピードの「速い」「遅い」というコンディションの違いにはどんな要因があるのでしょうか？その多くは、個々のWebサイトの状態に原因があるとされていますが、利用しているECカートのプラットフォームに依存している可能性もあるのでしょうか？その可能性がゼロではなければ、今後のECサイト新設やリニューアル時に、プラットフォームの各機能だけでなく、「表示スピードの速さ」を選定条件に入れるべきなのかもしれない――。こうした疑問を調査してみました。（この記事はPCでの閲覧をおすすめいたします）

結論！ ECプラットフォームによる表示スピードの差異はない。設計や構築方法、運用ルールで「速い」「遅い」が発生

EC関係者の間で、さまざまな課題に関してよくあがる声が「カート依存問題」です。そこでWeb表示スピード研究会ではWebサイトの表示スピード依存の疑問について、「SpeedCurve」を使い、メジャーな5つのEコマース向けプラットフォームを導入しているECサイト150URLを、延べ3万7800回計測してみました。

各プラットフォームは、機能性、コスト優位性だけではなく、多くは利用企業のビジネス要件、ニーズに応じて導入されています。今回の計測は特徴が異なる、2つのグループ（A、B）に分けて、計測、考察しています。

グループA：ECパッケージ型・提供プラットフォーム

今回の計測対象：EC-CUBE、ecbeing、EC-ORANGE
特徴：利用企業のニーズに併せて、オンプレミス環境、クラウド環境のインフラ、サーバ構成を選択することが可能で、構成の自由度が比較的高い

グループB：ECクラウド型・提供プラットフォーム

今回の計測対象：CommerceCloud 、Shopify
特徴：SaaSサービス提供企業側により、インフラ、サーバ環境、EC機能がオールインワンで提供されるため、利用企業でのサーバー構築、インフラ運用が不要

結果としては、「ECパッケージ型での提供プラットフォーム」「ECクラウド型での提供プラットフォーム」の各グループでは、双方ともランキング順位には偏向は見られないものの、環境設定、チューニングによって大きなバラつきが生じていることがわかりました。

つまり、「ECパッケージ型での提供プラットフォーム」「ECクラウド型での提供プラットフォーム」のそれぞれのメリットを生かすも殺すも、サイトの設計や構築方法、運用ルール次第ということ。つまり、ECサイトの表示スピードが「速い」「遅い」は、設計や構築方法、運用ルールで変わるということ浮き彫りになりました。

昨今の変化スピードが速く、競合サイト間での競争も激しい環境で、EC事業会社は常に短期間でECサイトの機能改善、リニューアルを継続して行っていく必要があります。

プラットフォームの計測データからわかったことは、「プラットフォームを活用すると、スクラッチ開発より比較的、短期間でビジネス要件を達成できるというメリットはありつつも、Web表示スピードのばらつきは、事業会社が主体的に意思を持ってコントロールしなければならない」ということ。

そのため、めざすべき顧客体験を損なわないように、Web表示スピードを担保するための日々の活動は、スクラッチのシステムと同様に、必要不可欠な日々の改善チューニングである、と強く感じる結果となりました。

まずは「ECパッケージ型」を計測、それぞれで大きな違いはあるか？

具体的に計測結果データを見ていきましょう。

今回、選んだのは「ecbeing」「EC-ORANGE」「EC-CUBE」Salesforceの「Commerce Cloud」「Shopify」です。調査対象サイトには、それぞれの公式サイトに掲載されている「導入事例」から、それぞれ10サイトを選定して計測しました。（詳細は調査概要を参照）

計測対象ページは①トップページ ②リストページ（カテゴリページ）③商品詳細ページの3つとし、それぞれの中央値（median）を平均した値で比較しています。

グループA：「ECパッケージ型・提供プラットフォーム」の表示速度ランキング（ECパッケージ型・提供プラットフォーム／計30サイト）　

速度順位	サイト名	Speed Index （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS	採用プラットフォーム
1	ファミリア公式オンライン	2.01	2.10	516	0.44	EC-ORANGE
2	ルピシアオンラインストア	2.10	2.61	116	0.17	ecbeing
3	Back Market JP	2.15	2.32	133	0.00	EC-CUBE
4	三栄自動車レンタカー	2.16	2.03	54	0.00	EC-CUBE
5	ダイドードリンコ公式通販	2.24	2.34	430	0.00	ecbeing
6	ノエビアグループショッピングモール	2.37	2.38	438	0.00	ecbeing
7	BMハンガー	2.42	2.17	187	0.01	EC-CUBE
8	JILL STUART Beauty公式オンラインショップ	2.54	3.03	169	0.18	ecbeing
9	SAKE CABINETオンラインストア	2.93	2.46	191	0.05	EC-CUBE
10	nano・universe ONLINE STORE	3.11	4.30	2397	0.83	ecbeing
11	トレンザオンライン	3.20	4.75	3	0.06	EC-CUBE
12	KONAMI STYLE	3.21	2.26	565	0.00	EC-ORANGE
13	瀬戸口精肉店	3.25	3.00	394	0.14	EC-CUBE
14	mipe	3.33	5.13	14	0.03	EC-CUBE
15	コナミスポーツクラブオンラインショップ	3.71	4.51	283	0.72	EC-ORANGE
16	TAMIYA SHOP ONLINE	3.89	4.13	88	0.61	ecbeing
17	COREZO	4.09	3.77	4	0.04	EC-ORANGE
18	au Wowma! ふるさと納税	4.31	4.62	435	0.15	EC-ORANGE
19	blanche étoile	4.32	2.75	0	0.04	EC-CUBE
20	WORK-UNIFORM	4.38	4.12	150	0.00	EC-ORANGE
21	BEAMS（ビームス）公式サイト	4.52	3.13	1000	0.61	ecbeing
22	タカラトミーモール	4.57	4.51	513	0.00	ecbeing
23	unico公式通販サイト	5.60	4.83	1922	0.26	ecbeing
24	お口の恋人ロッテオンラインショップ	5.67	6.33	421	0.29	ecbeing
25	NISHIKIYA KITCHEN	6.46	3.86	19	0.13	EC-CUBE
26	マイロイヤルカナン	6.97	6.23	635	0.19	EC-ORANGE
27	小田急オンラインショッピング	7.20	3.15	336	0.32	EC-ORANGE
28	ANNABELLE	7.79	7.30	319	0.22	EC-CUBE
29	はるやまオンラインストア	9.25	5.37	730	0.17	EC-ORANGE
30	P.S.FAオンラインストア	11.07	4.46	677	0.12	EC-ORANGE

グループB：「ECクラウドサービス型・提供プラットフォーム」の表示速度ランキング（ECクラウドサービス提供プラットフォーム／計20サイト）

続いて「ECクラウドサービス型」の計測データです。

速度順位	サイト名	Speed Index （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS	採用プラットフォーム
1	アディダス	2.05	1.43	1754	0.08	Commerce Cloud
2	ゴーゴーカレー	2.69	3.13	374	0.00	Shopify
3	Northmall （ノースモール）	2.89	3.00	618	0.06	Commerce Cloud
4	LOVOT（ラボット）	3.06	2.90	904	0.09	Commerce Cloud
5	Furbo	3.10	2.54	1950	0.00	Shopify
6	FUJIFILM Prints＆Gifts	3.54	3.56	1222	0.01	Commerce Cloud
7	BARNEYS NEW YORK	3.72	4.95	652	0.37	Commerce Cloud
8	Kakimori	3.87	2.73	91	0.00	Shopify
9	amirisu	3.88	3.65	260	0.02	Shopify
10	BODYBOSS	3.89	2.44	952	0.00	Shopify
11	ワコール	4.25	2.66	159	0.00	Commerce Cloud
12	BASE FOOD	4.54	4.02	784	0.09	Shopify
13	PUMA	4.54	5.01	1218	0.60	Commerce Cloud
14	土屋鞄製作所	4.60	3.68	983	0.01	Shopify
15	KURAND	4.63	4.14	544	0.07	Shopify
16	ホームセンター通販のカインズ	4.74	5.37	250	0.01	Commerce Cloud
17	京都醸造	5.30	3.23	5	0.00	Shopify
18	Allbirds（オールバーズ）	5.47	5.33	8	0.00	Shopify
19	ミズノ公式通販サイト	6.82	6.35	2116	0.52	Commerce Cloud
20	アシックスオンラインストア	7.44	6.61	2867	0.67	Commerce Cloud

Web表示スピード、「コアウェブバイタル」数値の差はどの程度か？

2つのグループのWeb表示スピードのランキング、「コアウェブバイタル」にはどのような特徴が見えてくるでしょうか？

グループA：ECパッケージ型・提供プラットフォーム

表示スピードの評価を表すSpeedIndexでは「ファミリア公式オンライン」（EC-ORANGE）が1位です。「コアウェブバイタル」指標の総合評価を見てみると、グリーンが多い「blanche étoile」（EC-CUBE）がトップで、１位の「ファミリア公式オンライン」とのSpeedIndex差は0.9秒で、そこまで差が開いていません。

1位と5位のサイトにおけるSpeedIndex差は僅か0.23秒なので、表示速度上位グループでは、適切なチューニング、Web表示スピード対策が実施されていると考えられます。

グループB：ECクラウドサービス・提供プラットフォーム

表示スピードの評価を表すSpeedIndexでは「アディダス」（Commerce Cloud）がトップです。「コアウェブバイタル」指標の総合評価を見てみると、グループAと異なり、オールグリーンのECサイトは今回の計測対象では確認できませんでした。

こちらも、1位と5位のSpeedIndex差は約1.05秒なので、表示速度上位グループは適切なチューニング、Web表示スピード対策が実施されていると考えられます。

プラットフォーム別の平均値を見る

各グループのプラットフォームを比較すると、計測前の仮説ではもっと大きな差が出ると考えていましたが、平均値で見た場合、SpeedIndex、「コアウェブバイタル」の各指標に関しては、プラットフォームの違いによる明確な差異、特筆すべき違いは見られないと言っていいでしょう。

各グループのサンプル数が15サイト、10サイトなので、もう少し多くすれば違いが出てくるかもしれません。

グループA：ECパッケージ型提供・プラットフォーム別の平均値

プラットフォーム	Speed Index （秒）	Backend （秒）	Start Render （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS
EC-CUBE	3.80	0.92	2.66	3.58	131	0.07
ecbeing	3.66	0.87	2.32	3.76	749	0.30
EC-ORANGE	5.62	0.87	2.71	4.06	433	0.22

※各プラットフォーム5サイトずつ、合計15サイト

グループB：ECクラウドサービス型・提供プラットフォームの平均値

プラットフォーム	Speed Index （秒）	Backend （秒）	Start Render （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS
Shopify	4.20	0.77	2.98	3.49	595	0.02
Commerce Cloud	4.30	0.77	2.15	4.18	1176	0.24

※各プラットフォーム5サイトずつ、合計10サイト

サンプル数が少ないため参考値となるが、SpeedIndexでは「EC-CUBE」と「ecbeing」が良い数値。「コアウェブバイタル」では、EC-CUBEとShopifyが良好となった。

プラットフォーム別のばらつき。最小値と最大値の差を見ると？!

プラットフォームにおける各指標の幅の最小と最大の差に着目してみました。

SpeedIndexとBackendでは「Shopify」が比較的安定しています。またStartrenderでは「ecbeing」が最小値でした。幅が少ないほど安定した結果が出せるともいえます。注目したいのは「コアウェブバイタル」です。

どのプラットフォームでもオールグリーンを獲得できる可能性があることがわかります。CLSに関しては「Shopify」が最大値でも0.09のグリーンと良好となっています。

ECパッケージ編

プラットフォーム		Speed Index （秒）	Backend （秒）	Start Render （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS
EC-CUBE	最大	7.79	3.67	5.65	7.30	394	0.22
	最小	2.15	0.38	1.20	2.03	0	0.00
	差分	5.64	3.28	4.45	5.28	394	0.22
EC-ORANGE	最大	11.07	1.17	4.10	6.23	730	0.72
	最小	2.01	0.56	1.13	2.10	4	0.00
	差分	9.06	0.61	2.97	4.13	726	0.72
ecbeing	最大	5.67	1.41	3.50	6.33	2397	0.83
	最小	2.1	0.57	1.50	2.34	88	0.00
	差分	3.57	0.85	2.00	3.99	2309	0.83

ECクラウドサービス編

プラットフォーム		Speed Index （秒）	Backend （秒）	Start Render （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS
Shopify	最大	5.47	0.89	5.23	5.33	1950	0.09
	最小	2.69	0.33	1.45	2.44	5	0.00
	差分	2.78	0.55	3.78	2.88	1944	0.09
Commerce Cloud	最大	7.44	1.32	4.15	6.61	2867	0.67
	最小	2.05	0.41	0.93	1.43	159	0.00
	差分	5.39	0.92	3.22	5.18	2707	0.67

BackendとSpeedIndexで安定しているのは「Shopify」。Startrender（描画が始まる）が一番良いのは「ecbeing」だった。

同一プラットフォームにおける差異の幅

グループA：ECパッケージ型での提供プラットフォーム

プラットフォーム	SpedIndex 最小、最大値の差（秒）
ecbeing	3.57
EC-CUBE	5.64
EC-ORANGE	9.06

グループB：ECクラウドサービスでの提供プラットフォーム

プラットフォーム	SpedIndex 最小、最大値の差（秒）
Shopify	2.78
CommerceCloud	5.39

ブレがもっとも少ないのが「Shopify」です。続いて「ecbeing」となりました。

SpeedIndexは、Web表示スピードを評価するGoogle推奨の従来からの指標で、「コアウェブバイタル」の評価項目にも影響が大きく無視はできないのですが、各サイトにおけるSpeedIndexの数値の最小と最大の差は予想より大きく数値のバラツキに大きな違いがあることがわかります。

計測データからわかるように、なぜプラットフォームによって平均値に大きな差が生じているのか？つまり「ブレ幅が大きい理由、要因は何か？」という疑問が沸きます。

筆者の長年のWeb表示スピード研究からの私見ですが、設計や構築方法に大きな要因があると考えられます。Web表示スピードの差が生じる主な要因は、以下の3つのポイントがあると考えています。

ポイント①
Web表示スピードに関して、顧客視点での計測、課題分析（リアルユーザー情報の把握）

ポイント②
フロンエンド、バックエンドのWebシステム性能管理

ポイント③
CDNの適切な設定、パフォーマンスチューニング

それぞれのECサイトのプラットフォームに関して、標準構成そのままではなく、Web表示スピードに関する適切な目標値とチューニングを意識して実行する必要があります。そうすることで顧客体験（UX）を損なわない、快適なWeb表示スピードを実現できると言えます。

ECクラウドサービス型・提供プラットフォームも、設計・構築方法によっては大きな違いがでるという事実

最後にECクラウドサービス型・提供プラットフォームの計測データに関してもう少し深い分析・考察をしてみます。今回の調査では「Shopify」とセールスフォースの「Commerce Cloud」がこれに該当します。

Web表示スピード研究会でも、ECクラウドサービス型・提供プラットフォームのWebサイト表示スピード改善の対策アプローチ、研究を進めています。

インフラ、ネットワークを含めてプラットフォームとして提供される方式のため、Web表示スピード差は、それほど表れにくいだろうという仮説がありました。しかし、実際の計測データを見てみると、状況は少し異なるようです。

今回は大手企業での採用・導入が増えている「Commerce Cloud」について考察します。

番外編：Salesforce「CommerceCloud」のSpeedIndexランキング

速度順位	サイト名	Speed Index （秒）	Backend （秒）	Start Render （秒）	LCP （秒）	TBT （ミリ秒）（※注①）	CLS
1	アディダス	2.05	0.52	0.93	1.43	1754	0.08
2	Northmall （ノースモール）	2.89	1.32	2.20	3.00	618	0.06
3	LOVOT（らぼっと）	3.06	0.42	1.53	2.90	904	0.09
4	FUJIFILM Prints & Gifts	3.54	0.54	2.20	3.56	1222	0.01
5	BARNEYS NEW YORK	3.72	0.81	1.93	4.95	652	0.37
6	ワコール	4.25	1.08	2.28	2.66	159	0.00
7	PUMA	4.54	0.63	2.05	5.01	1218	0.60
8	ホームセンター通販のカインズ	4.74	0.83	4.15	5.37	250	0.01
9	ミズノ公式通販サイト	6.82	0.41	1.58	6.35	2116	0.52
10	アシックスオンラインストア	7.44	1.10	2.60	6.61	2867	0.67

1位のアディダスと10位のアシックスの違いを見てみましょう。

アディダス：SpeedIndex 2.05秒、Backend 0.52秒、StartRender 0.93秒
アシックス：SpeedIndex 7.44秒、Backend 約1.1秒、StartRender 2.60秒

アディダスは、「Commerce Cloud」の中でも、非常に高速なWebサイトです。「Commerce Cloud」の各指標では、TBT（FIDの代替え指標）以外、LCP、CLSは良好（Green）を獲得、実現しています。このレベルの数値を考えると、速度のモニタリング、Web表示スピードのチューニングなどは、しっかり対策プロジェクトとして実行されていると予想されます。

ところが、10位のアシックスのデータを見ると、SpeedIndexで7.44秒（アディダスの3.6倍）、Backendで約1.1秒（アディダスの約2.1倍）という遅い数値です。同じプラットフォームといえども、大きな違いが生じています。以前にも発表していますが、同じカテゴリーでの表示スピードのよしあしはSEOランクにも大きく影響すると考えられます。

遅延の原因はさまざまですが、SaaSプラットフォームそのものの性能差以外の要素として、フロントエンドの構築方法、サードパーティのタグ、APIによる基幹システムの連携などの要因が関係して、Web表示スピードに差が出ていると予測します。

結論として、SaaS型のサービスといえども構築方法によって大きな差が生まれるといえるでしょう。Web表示スピードと「コアウェブバイタル」のモニタリング、適切な課題解決を実施することは重要です。

プラットフォームを活用した顧客体験、満足度向上における重要ポイントであると考えられます。

今回の計測で何が見えたのか？！ Webサイト表示スピード研究会メンバーのディスカッション

本記事の筆者、Web表示スピード研究会主要メンバー（Web表示スピード研究会主催/種村和豊（ドーモ）、近藤洋志氏（大日本印刷））が今回の計測結果についてディスカッションしました。

種村：今回は、ECパッケージ型・提供プラットフォーム、ECクラウドサービス型・提供プラットフォームというグルーピングを行い、それぞれのプラットフォームの特徴を意識して仮説を立てての計測、検証を行いました。そういう意味ではいつもの計測と違った気づきもありましたね。

近藤：プラットフォーム別での検証という、今までなかった観点が面白かったです。私が使っているプラットフォームはありませんでしたが、内製開発している立場としては、フロントエンド、バックエンドの構成や設計も大事ですが、サイトの運用者の設定や運用フローがしっかりできていないと遅くなるということとも改めて大事だと思いました。

本当に必要最小限のサードパーティで運用ができているか、ページ自体の構成が過剰に肥大化していないか、双方で気をつけて一緒に作り上げていくべきだと思います。

この調査方法・データについて

「コアウェブバイタル」の基準値

本記事の「コアウェブバイタル」の基準値はGoogle社情報「ウェブに関する主な指標レポート低速なサイトを修正してユーザーエクスペリエンスを改善する」に準拠した形をとっています。

	Good （良好）	Needs Improvement （要改善）	Poor （不良・低速度）
LCP	2.5 秒以下	4 秒以下	4 秒を超える
TBT （※FIDの代替）	300 ミリ秒以下	600 ミリ秒以下	600 ミリ秒を超える
CLS	0.1 以下	0.25 以下	0.25 を超える

※注①　TBT（FIDの代替指標）について

本計測は、計測ツールSpeedCurveのSynthetic計測サービスを利用しております。FIDはWebサイトに訪れたユーザーリアルデータに基づく統計指標であり、仕様上精緻な計測が難しいため、FID代替え指標の TBT（Total Blocking Time）で計測、集計しています。

従来の多くの計測ではアイドルタイムと呼ばれる、購入客が少ない午後の時間に計測されることが多く、朝、昼、夜のピークタイムや、土日計測がほとんどされていません。たとえば、メルマガやLINEでキャンペーン情報の配信時にサイトがどんな状態になるのかを、ほとんどのEC事業者が把握していないのが現状です。

今回の調査では、売れている時間帯のコンディションを把握するために、12:30、18:30、22:30の1日3回、比較的高負荷の時間で実施しました。

SpeedInex

Speed IndexはGoogleが発表したパフォーマンス指標。ブラウジング開始後、ファーストビューの表示が完了するまでの視覚的経過状況を総合的に算出したもの。本計測、分析を行っているスピード研究会では最低目標値 4秒台、推奨値4秒以下を推奨しています。
（参考：（スピード研究会）SpeedIndexの基本合格基準、5秒から4秒の引き上げを決定!!）

誤差や数値の違いについて

今回の計測は、12:30、18:30、22:30の1日3回という、ECサイトにおいて比較的高負荷とされている時間帯に行いました。従来の計測結果と乖離があるとすれば、この時間滞とアイドルタイムの違いが一番の違いとなります。

調査概要

調査期間：2021年8月9日（月）～2021年8月23日（月）までの14日間

調査対象：調査対象のサイトは下記を参考としています。

Eコマース向けのプラットフォームとして「Shopify」「EC-CUBE」「ecbeing」「EC-ORANGE」「Commerce Cloud」の5つを選定
公式サイトに公開されている「事例」もしくは「導入事例」から、それぞれ10サイトを選定して計測対象とした。（EC-ORANGEについては、個別に確認）

調査範囲：1サイトにつき、①トップページ②リストページ（カテゴリページ）③商品詳細ページの3つのURL（計測したのは①50URL、②50URL、③50URLの計150URL。うち、リストページと商品詳細ページが同一のため②③に同一ページで計測したのは2URL）。当該サイトURLは、検索エンジンによる検索結果から移動できるURLを用いた。

①トップページ②リストページ（カテゴリページ）③商品詳細ページ、それぞれの中央値（median）を平均したものをサイトの代表値とする。

計測時間：12:30、18:30、22:30の1日3回

測定プロファイル：Apple iPhone X（4G LTE）、Samsung Galaxy S8 （Mobile 4G LTE）

１回当たりの計測数：3 checks

計測回数：150URL × 1日3回 × 3checks × 2デバイス × 14日間＝ 3万7800回計測

エミュレート回線品質（4G LTE）：ダウンロード 11.7Mbps／アップロード 11.7Mbps／レイテンシー 70ms

サイト調査実施：：監修／占部雅一（ドーモ）レポート・解析／種村和豊（Web表示スピード研究会）データ計測・集計／村岡温子、畑山慎治

※記事初出時の本文を修正いたしました（3月17日15時）。

この記事のキーワード：