Top Trends in Cybersecurity for 2024 | 
米国のシェルター・イン・プレース・オーダーのピーク時には、人口の94%が影響を受けた。 規制が緩和されている一方で、アメリカ人はまだ自宅内で安全な状態を保ち、オンラインで購入することを選択している。 ホリデーシーズンが近付くと、あらゆる種類の企業はすぐさま優れたオンラインショッピング体験を作成するための最良の解決策を見つけようとしている。
あなたの場所のための右の技術スタック、性能のために造られた1つを選ぶことは重大であり、決して容易でない。 企業は、自社のビジネスに適したeコマースプラットフォーム、CDN、フロントエンドを選択する必要がある。 Shopify、Magento 2、Salesforce Commerce Cloudプラットフォームと主要なCDNをすでに比較している。 この記事では、現代のフロントエンドのパフォーマンスに焦点を当てていく: Angular、Next.js、Nuxt.js、React、Vue.js。 すぐにNuxt.jsがこのパックをリードし、Vue.jsとNext.jsが続いていることがわかった。 私たちの詳細な調査結果のために読む。
React、Angular、Vue.js、Next.js、Nuxt.js–どのように比較するか?
Angular、Next.js、Nuxt.js、React、Vue.jsを実行している約2,000の高トラフィックのウェブサイトのサブセットについて、モバイルLighthouse 6のスコアを分析し、どのフロントエンドが最速のウェブサイトを提供しているかを明らかにした。 フロントエンド全体のLighthouseの平均スコアは24で、中央値は19であることがすぐにわかった。 これは低いように聞こえるかもしれないが、実際には売上高で米国の大手500インターネット小売業者の平均パフォーマンススコアより26%高い。
Nuxt.jsとVue.jsのウェブサイトは、最速のウェブサイトを提供するために戦った。 Nuxt.jsサイトのLighthouseのスコアは平均27で中央値は22で、Vue.jsサイトのスコアは平均27だが中央値は20であった。 Vue.jsにはいくつかの印象的な外れ値があったが、Nuxt.jsは最も高速でロードされるウェブサイトを提供するための最も信頼性の高いフレームワークであることが証明された。
3位はNext.jsで、平均スコアは23、中央値は19.5であった。 Angularのウェブサイトは23で同じ平均を見たが、Angularのサイトのパフォーマンススコアの分布はより多様であり、中央値は18ではなかった。 パフォーマンスが最悪のフロントエンドは意外にも反応した。 アマゾンやグルーポンを含むeコマース界で最も有名な企業のいくつかをホストしているにもかかわらず、Lighthouseの平均スコアは22、中央値は18であった。
Nuxt.jsは最速のeコマースWebフレームワークになる
Nuxt.jsはVue.js、Node.js、webpack、Babel.jsをベースとしたオープンソースのサーバーレスフレームワークであり、高速で複雑な同型アプリケーションを迅速に構築するために作成された。 このフレームワークの利点には、自動コード分割、ページキャッシュ、プリフェッチがある。 Layer0はNuxt.jsのスポンサーであり、より高速なWebを促進するために働く現代的なオープンソースフレームワークの促進を支援していることを誇りに思っている。 現在、Nuxt.jsはGitHub上で29.4Kの星を獲得している。
Next.jsを使用しているウェブサイトのLighthouseの平均スコアは27で、フロントエンド全体の平均をわずかに上回った。 Nuxt.jsサイトのスコア中央値は22に下がり、分布が正のゆがみを示している。 パーセンタイルベースでは、35のスコアが75パーセンタイルを示し、49のスコアが90パーセンタイルを示した。 このフレームワークは他のフレームワークと比較してスコアのばらつきが少なく、Lighthouseのパフォーマンススコアを平均に近い一貫して提供する能力があることを示している。 しかし、このデータはまた、Vue.jsやAngularウェブサイトのようなフレームワークなど、Nuxt.jsサイトが極端な高得点やほぼ完全なスコアを提供していないことを示している。これらについては、次のセクションで説明する。
Heavy Industry and Engineeringは、Nuxt.jsの最速ウェブサイトのカテゴリであり、パフォーマンススコアは平均37で、フレームワークの平均スコアだけよりも42%も速い。 カテゴリはさておき、最速のNuxt.jsウェブサイトはAppycouple.com、NJtransit.com、WPS.comで、それぞれ68、63、48のスコアを記録した。 Trivago.com、TrueandCo.com、Garmin.comもフレームワークの平均を上回り、注目すべきパフォーマンススコアはそれぞれ47、36、35であった。 任天堂は平均20点、Nespresso.comとDolceVita.comは10点に満たなかった。
Vue.jsが準優勝
Vue.jsは、単一ページのアプリケーションを構築するためのオープンソースJavaScriptフレームワークであり、2014年の立ち上げから6年間で急速に人気が高まっている。 GitHubには171,000以上の星があり、最も人気のある現代フレームワークとなっている。 開発者が急速に成長しているJavaScriptアプリケーションを迅速に構築できる点が第一の魅力である。 AngularやReactと非常に似ており、軽量で、大規模なアプリケーションに堅牢なルーティングソリューションを提供する。
Vue.jsのウェブサイトは、平均27点、中央値20点で、2番目に高いパフォーマンススコアを記録した。 パーセンタイルベースでは、Vue.jsサイトの75%がパフォーマンススコアが34以下、90%が55以下であった。
このドメインの中で最も速いウェブサイトカテゴリは、ニコンや富士フイルムを含めて平均37点の趣味とレジャーであった。 このカテゴリーは平均的なVue.jsウェブサイトより37%良いパフォーマンスを示した。 Vue.jsの上位3位はPaintScratch.com、iMobie.com、EmmaOneSock.comで、それぞれ96、93、92のスコアを記録し、ほぼ完璧なパフォーマンスのスコアを記録した。
順位を下げたデータでは、FactoryChryslerParts.comが68点、In-n-Out.comが61点、Poshmark.comが53点、LouisVuitton.comが34点となっており、いずれもVue.jsの平均を上回っている。 あまり印象的ではなく、Sunglasshut.com、WestElm.com、Anthropologie.com、UrbanOutfitters.com、Chewy.comは10から15の低スコアを提供した。 チポトレ、スバル、BMWは10以下のスコアでさらに悪いパフォーマンスを見せた。
Angularはほぼ完全なスコアを数える3位に入る
Angularはグループの最古のフレームワークであり、2010年にGoogleによって作成・開発され、GitHub上に65,000以上の星がある。 Angularはより複雑なアプリケーションで知られているため、サイトを迅速に拡張する予定の大規模な企業Webサイトに人気のあるソリューションである。
Angularウェブサイトの平均パフォーマンススコアは23で中央値は18であり、分布が正のゆがみを帯びていることを示している。 Angularのウェブサイトの75%がLighthouseのスコアを30以下、90%が50以下であった。 カテゴリレベルでは、Health Websitesがこのフレームワークで最高の成績を収め、平均スコアは28であった。 これらの健康のウェブサイトのいくつかはCVS.com、VitaminShoppe.com、LifetimeFtiness.comおよびPlexus.comを含んでいる。
Deichmann.com、MegaBus.com、ShopStyle.comは上位3位のAngularサイトであり、それぞれ98、95、83のスコアを記録した。 Angularのパフォーマンスで上位5パーセンタイルに入ったサイトは、強力な機械とエンジンの会社であるCat.comと航空会社であるAerLingus.comの2つだけだった。
Angularのサイトの中には、Android.comが51、Expedia.comが44、PepsiCo.comが42、Lamborghini.comが31であった。 Nearing AngularのLighthouseの平均スコアはSearsが26、Gamefly.comが25、BaskinRobbins.comが19、Disney.comが18、CocaCola.comが17であった。 XfinityやPatagoniaなどのブランド名を含む平均には程遠く、スコアは15と14だった。 最後に、データは3つの航空会社が最も遅いAngularのウェブサイトであることを明らかにした:デルタ3、フロンティア2、スピリット1。
Next.jsが平均パフォーマンススコアに8%不足
Next.jsはオープンソースのReactベースのサーバーサイドレンダリングアプリケーション用の同型フレームワークであり、GitHub上に52,000以上の星を持つ。 ページの読み込みを高速化するため、Next.jsは自動的にコードを分割し、サーバーに新しいリクエストが来るたびに動的にHTMLを生成する。
このフレームワーク上のウェブサイトはLighthouseの平均パフォーマンススコア22を記録し、平均スコアより8%低い。 Next.jsサイトの50%が20以下、75%が30以下、90%が43以下であった。 分類的には、旅行と観光のサイトはNext.jsで最も優れており、Lighthouseの平均スコアは29である。 Next.jsの最速の3つのサイトはBartleby.com、Kelloggs.com、Holidayinnclub.comで、それぞれ89、73、75点を記録した。
RetailMeNot.comとHermanMiller.comはフレームワークの平均スコアを少なくとも21%上回り、Sears.com、AlexanderMcQueen.com、Ticketmaster.com、RedRobin.comはそれぞれ26、23、22、22の平凡なスコアを提供している。 業績の悪い少数の大企業には、EddieBauer.com、TragerGrilles.com、Bonobos.com、Smirnoff.comがあり、スコアは10-15である。 YankeeCandle.com、ProFlowers.com、LiveNation.com、23andMe.com、Gymboree.com、Dior.com、Farri.comはLighthouseの低スコアを10未満で配信した。
Reactは印象的でないスコアを持つ印象的なブランドをホスト
ReactはFacebookが2013年に開発したオープンソースのJavaScriptライブラリである。 この記事で扱う他のフレームワークとは異なり、Reactはフレームワークではなく、ユーザーインターフェイスやUIコンポーネントをすばやく簡単に構築するためのUIライブラリである。 これは、The Bunchの中で最も成熟したフロントエンドの1つであり、GitHubで最も人気のあるプロジェクトの1つでもあり、このブログの公開日時点で155,000以上の星を獲得している。
Facebookは、TwitterやAirbnbのような巨大企業がReactを使用しているため、安定性が彼らにとって最も重要であると述べている。 興味深いことに、パフォーマンスはそれほど優先されていない。 データによると、React Websiteの平均スコアはLighthouseで22で、フレームワーク全体の平均スコアより8%低いことが明らかになった。 中央値は18であり、75%のサイトのスコアは29未満、90%は40未満である。
アパレル、アクセサリー、靴はReactドメインのシェアが最も高いカテゴリーであったが、最も平均的なLighthouseスコアが最も高いカテゴリーはMass Merchantのものであり、Walmart、Wayfair、Ashley Stewart、Nordstrom、Kroger、Sam’s Club、Groupon、Overstockが含まれている。 カテゴリはさておき、トップ3の最速のReactウェブサイトはhistoricrail.com（アマゾンが所有）を98位に、historicaviation.com（アマゾンが所有）を91位に、flipkart.comを74位にランク付けした。
図書館の平均を上回る有名人は、Amazonが57歳、VRBOが49歳、Pricelineが47歳、Wayfairが39歳、Lowesが33歳、Netflixが31歳であった。 図書館の平均スコアに近づいた名前は、Targetが25、Sur La TabとStitchFixが24、Gap and Glossierが21、Victoria’s Secretが20、CrateとBarrelが19であった。 業界で最大の敗者のいくつかは9の23andMe.com、8のBest BuyとTory Burch、6のProFlowers、3のDiorである。
結論
Google Lighthouseは、多くのeコマース企業がウェブサイトのパフォーマンスを測定するためのデファクトツールとなっている。 高いパフォーマンススコアは、サイトの読み込みが高速であることを示し、最も重要なことは、ユーザーの期待に応えることである。
ウェブサイトの速度はこれまで以上に重要になっており、このパンデミックの間、混雑した店舗を避けるためにどこでもオンラインに切り替えている消費者がいる。 Webサイトのパフォーマンスは、使用するフレームワークによって劇的に変化し、ユーザーエクスペリエンスに大きく影響する。 最新のフロントエンドフレームワーク上の2000近くのトラフィックの多いウェブサイトのLighthouseのパフォーマンススコアを分析することにより、どのフレームワークが最速の速度を提供するかを明らかにした。
Nuxt.jsのウェブサイトが最も速く、Lighthouseの平均パフォーマンススコアは27、中央値は22である。 Vue.jsは同一の平均パフォーマンススコア27、中央値20で準優勝した。 AngularとNext.jsのウェブサイトの平均スコアは23だったが、Angularの方が中央値が高く、フレームワークでは3番目に速い。 最後に、Reactは最も人気のあるフレームワークであり、パフォーマンススコアは最低で、Lighthouseの平均スコアは22であった。
Layer0（現在はEdgio）を操作する
Layer0を使用すると、開発チームはエッジネイティブのWebアプリケーションを迅速かつ簡単に構築してデプロイできる。 市場で最も完成度の高いJamstackプラットフォームであり、React、Angular、Vue、Next.jsなど40以上の最新フレームワークを実行できるように構築されており、開発速度が2倍になることが証明されている。
従来のウェブアーキテクチャも徐々にヘッドレスアーキテクチャに移行するためにサポートされている。 柔軟性とモダナイゼーションを必要とするサイトの場合、Layer0は、基盤となるアーキテクチャを変更したり、サイト全体を書き換えたりすることなく、リスクを軽減し、移行のペースを向上させる。
