事例紹介
CSS コンテナ クエリのパワーを解き放つ: Netflix チームから学ぶ
このケーススタディでは、Netflix でコンテナ クエリを採用するメリットについて説明します。
東急がパスキーでログインのスピードを 12 倍にした方法
日本の鉄道会社である東急が、パスキーによるログインを 12 倍高速化し、毎日何千人もの乗客をサポートしている方法をご覧ください。
Google スプレッドシートが計算ワーカーを JavaScript から WasmGC に移植した理由
Google スプレッドシートでの計算は当初、サーバーで行われ、次に JavaScript のクライアントで行われ、WebAssembly ガベージ コレクションではクライアントで行われていました。このケーススタディでは、その方法と理由について説明します。
よりスムーズに、より細かい管理: Google Meet で音声と動画の権限が改善された仕組み
このケーススタディでは、Google Meet チームが権限をどのように改善したか、それがユーザーに及ぼした影響について説明します。向上します
BILIBILI、MediaPipe のオンデバイス ウェブ AI ソリューションを利用して動画ストリームの UX を改善し、セッション継続時間を 30% 拡大
ウェブによって臨場感あふれる 3D エクスペリエンスを可能にし、買い物客が物理的な商品を理解して探索できるようにした方法をご覧ください。
Disney+ Hotstar で INP を 61% 削減し、リビングルーム向けデバイスでの週単位のカード視聴回数を 100% 増加させた方法
スマートテレビとセットトップ ボックスのデバイス向けアプリである Disney Hotstar が INP を削減する取り組みを通じて、視聴者のエンゲージメントを大幅に高めた事例をご紹介します。
Google ハードウェアを使用したインタラクティブな 3D ウェブ アプリケーション: 次世代のプロダクト学習体験
ウェブによって臨場感あふれる 3D エクスペリエンスを可能にし、買い物客が物理的な商品を理解して探索できるようにした方法をご覧ください。
PubTech の同意管理プラットフォームが、顧客ウェブサイトの INP を最大 64% 削減し、広告の視認性を最大 1.5% 改善した方法
PubTech の同意管理プラットフォームが、顧客ウェブサイトの INP を最大 64% 削減し、広告の視認性を最大 1.5% 改善した方法
どこでもグッドノート
過去 2 年間にわたり、Goodnotes のエンジニアリング チームは、成功を収めた iPad のメモ作成アプリを他のプラットフォームでも利用できるようにするプロジェクトに取り組んできました。このケーススタディでは、2022 年の iPad アプリが、ウェブ テクノロジーを活用したウェブ、ChromeOS、Android、Windows に導入され、WebAssembly ではチームが 10 年以上にわたって取り組んできた同じ Swift コードを再利用した事例を紹介します。
コンテンツ レコメンデーション プロバイダである Taboola は、LoAF を使用して、パブリッシャー パートナー ウェブサイトの INP を最大 36% 改善しました。
コンテンツ レコメンデーション プロバイダである Taboola は、LoAF を使用して、パブリッシャー パートナー ウェブサイトの INP を最大 36% 改善しました。
CapCut: WebAssembly と WebCodecs を使用して完全に機能するウェブアプリを構築することで、オーガニック トラフィックを 83% 増加
モバイルで利用できる最も人気のある動画編集アプリの一つが、完全に機能するウェブ バージョンをどのように作成したか。
イラストレーターのためのウェブの力: ウェブ技術を活用した pixiv の描画アプリ
pixiv は、イラストレーターやイラスト愛好家がコンテンツを通じて相互にコミュニケーションを取るためのオンライン コミュニティ サービスです。ユーザーは独自のイラストを投稿できます。世界中に 8,400 万人以上のユーザー がおり、2023 年 5 月時点で 1 億 2,000 万点 を超えるアート作品が投稿されています。 pixiv Sketch は、pixiv
Tokopedia: ML を使用して販売者のウェブアプリを改善し、運用コストを削減した方法
この投稿では、Mitra Tokopedia が ML を使用して販売者のウェブアプリを改善し、運用コストを削減した方法について説明します。
Trendyol が INP を 50% 削減した結果、クリック率が 1% 上昇した方法
このケーススタディでは、PageSpeed Insights(PSI)、Chrome DevTools、scheduler.yield API などの Google ツールを活用して、Trendyol で使用される React の INP をデバッグおよび改善するワークフローをステップごとに説明します。
Kiwix PWA でインターネットからギガバイト単位のデータをオフライン保存する方法
この活用事例では、非営利団体である Kiwix が、プログレッシブ ウェブアプリ テクノロジーと File System Access API を使用して、ユーザーがオフライン用に大容量のインターネット アーカイブをダウンロードして保存できるようにしている事例を紹介します。
Yahoo!JAPAN、パスキーの導入率を 11% に増やし、SMS OTP の費用を削減
Yahoo!JAPAN は、パスキーの採用とユーザー エクスペリエンスの改善に向けた取り組みを進めています。
プリフェッチによって Terra の広告のクリック率が 30% 向上し、Largest Contentful Paint が高速化された仕組み。
プリフェッチは、近い将来必要になると思われるリソース(またはページ全体)をダウンロードして、ページの読み込みを高速化する手法です。調査によると、読み込み時間が速いとコンバージョン率が高くなり、ユーザー エクスペリエンスも向上することがわかっています。
バックフォワード キャッシュが Yahoo!JAPAN ニュース、モバイルでの収益が 9% 増加
Yahoo! 日本有数のニュース プラットフォームであるジャパンニュースは、bfcache のヒット率を高めるために一丸となって取り組み、その結果、ユーザー エクスペリエンスとビジネスが大幅に改善しました。具体的には、同社が実施した A/B テストの結果、bfcache を使用するページで広告収益が 9% 増加したことがわかりました。
INP の修正に関する Economic Times のクエスト
TBT を 30 倍削減し、Next.js に移行したことで、The Ecomonic Times は INP を約 4 倍削減できました。その結果、直帰率が 50% 減少し、ページビューが 43% 増加しました。
redBus、ウェブサイトの Interaction to Next Paint(INP)を改善して売上を 7% 伸ばした方法
INP の最適化により redBus の売上は約 7% 増加
ブラウザ用 3D の驚くべき機能にスポットライトを当て、ゲームユーザーとデベロッパーの双方を魅了する Slow Roads
手続きによって生成される無限のシーンで WebGL が秘める可能性を体験できるカジュアル ドライビング ゲーム。 Slow Roads は、手続きによって無限に生成されるシーンに重点を置いたカジュアルなドライビング ゲームで、すべてが WebGL アプリケーション
より快適なウェブを実現する: 高速な YouTube
これは、YouTube ウェブの改善に関する新しいシリーズのパート 1 です。
楽天 24 がウェブに関する主な指標に投資したことで、訪問者あたりの収益が 53.37%、コンバージョン率が 33.13% 増加した理由
また、楽天 24 は、実際のユーザーのウェブに関する指標を測定することで、優れた Largest Contentful Paint(LCP)によってコンバージョン率が 61.13% 向上することを発見しました。
GoDaddy のウェブサイト + マーケティング サービスでは、顧客のウェブに関する主な指標が 75% 向上した
GoDaddy が実装した変更の事例。何百万ものサイトのパフォーマンスを向上させ、PageSpeed Insights と Core Web Vitals の優れたスコアを達成しました。
高級品小売業者の Farfetch、ウェブに関する主な指標の改善によりコンバージョン率が向上
高級小売店の Farfetch は、ウェブに関する主な指標の改善に投資したことが、どのようにビジネス成果の向上につながったかについて解説します。
Yahoo! JAPAN のパスワード不要の認証で問い合わせが 25% 減少し、ログイン時間が 2.6 倍に
Yahoo! JAPAN はパスワードレスの ID システムを実現しました。そのアプローチと取り組みの結果をご覧ください。
ウェブに関する主な指標を最適化してロイヤリティとエンゲージメントを高めた RebelMouse の事例
ウェブに関する主な指標に対する高いパフォーマンス スコアの全体的な影響とメリットを測定した事例紹介。
WorkBox により Adobe Experience Manager で最新のウェブ環境を構築
プログレッシブ ウェブアプリは、最新のウェブの能力を活かしています。Adobe は Workbox を使用して、そうした機能を Adobe Experience Manager に導入しています。
MishiPay の PWA により、トランザクションが 10 倍に増加し、キューイングを 2 年半削減
トランザクションを 10 倍に増やし、2 年半のキューイングを削減した MishiPay の PWA についてご紹介します。
ウェブに関する主な指標の基準を突破し、直帰率を全体で 43% 向上させた Economic Times の事例
Economic Times のウェブサイトでウェブに関する主な指標を最適化すると、ユーザー エクスペリエンスが大幅に向上し、ウェブサイト全体の直帰率が大幅に減少しました。