ヤフー全社横断「Webパフォーマンス改善」の取り組み (Core Web Vitalsスコアの向上)
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、第11代黒帯（ヤフー内のスキル任命制度／Webフロントエンド領域）の浜田（@narirow）です。今回はヤフー全社で実施してきた、「Webパフォーマンス改善プロジェクト」についてお話ししたいと思います。 長期に渡る活動の結果、多くのサービスのWebパフォーマンスが徐々に向上しています。この記事では、取り組みの経緯や、多くのサービス分析を通してわかったコスパの良い施策（比較的簡単に実施できてスコアも上がりやすい施策）などをご紹介します。 全社横断でWebパフォーマンス改善を実施する経緯 さかのぼること2021年、Googleから以下のような案内がありました。 「Core Web VitalsがGoogle検索の検索順位に
Browser-level image lazy loading for the web | Articles | web.dev
Browser-level image lazy loading for the web Stay organized with collections Save and categorize content based on your preferences. You can use the loading attribute to lazy-load images without the need to write custom lazy-loading code or use a separate JavaScript library. Here's a demo of the feature: Lazy-loaded images load as the user scrolls through the page. This page walks through the detai
Use Imagemin to compress images | Articles | web.dev
Use Imagemin to compress images Stay organized with collections Save and categorize content based on your preferences. Why should you care? Uncompressed images bloat your pages with unnecessary bytes. Because images can be candidates for Largest Contentful Paint (LCP), those unnecessary bytes can increase the image's resource load duration, possibly resulting in longer LCP times. The photo on the
PSIやLighthouse、CrUXレポートなど各種コアウェブバイタル計測ツールが新定義のCLSに対応
[レベル: 上級] Google は、コア ウェブ バイタルを計測するために提供している各種ツールを新しい定義の CLS に対応するようにアップデートしました。 Lighthouse も PSI も CrUX も 新 CLS で計測開始 新定義の CLS で計測するようになったツールは次のとおりです。 Chrome デベロッパーツールの Lighthouse ※Canary チャンネル Lighthouse CLI v8 Lighthouse CI v0.7.3 PageSpeed Insights (PSI) PSI API BigQuery 用 Chrome UX レポート (CrUX) ※2021 年 6 月 8 日に更新 Chrome UX レポート API たとえば、PSI は Lighthouse v8 を利用して新 CLS でのラボデータを現在は提供するようになっています。
Optimizing Web Vitals using Lighthouse | Articles | web.dev
Optimizing Web Vitals using Lighthouse Stay organized with collections Save and categorize content based on your preferences. Today, we'll cover new tooling features in Lighthouse, PageSpeed and DevTools to help identify how your site can improve on the Web Vitals. As a refresher on the tools, Lighthouse is an open-source, automated tool for improving the quality of web pages. You can find it in t
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Lighthouse Scoring calculator
PageSpeed Insights
