Introduction to Lighthouse | Chrome for Developers

<!doctype html> <html lang="en" dir="ltr"> <head> <meta name="google-signin-client-id" content="157101835696-ooapojlodmuabs2do2vuhhnf90bccmoi.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Chrome for Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#1a73e8"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/_pwa/chrome/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//www.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.googleapis.com" crossorigin> <link rel="preconnect" href="//apis.google.com" crossorigin> <link rel="preconnect" href="//www.google-analytics.com" crossorigin><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined&display=block"><link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/css/app.css"> <link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/css/dark-theme.css" disabled> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/favicon.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/touchicon-180.png"><link rel="canonical" href="https://developer.chrome.com/docs/lighthouse/overview"><link rel="search" type="application/opensearchdescription+xml" title="Chrome for Developers" href="https://developer.chrome.com/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://developer.chrome.com/docs/lighthouse/overview" /><link rel="alternate" hreflang="x-default" href="https://developer.chrome.com/docs/lighthouse/overview" /><link rel="alternate" hreflang="ar" href="https://developer.chrome.com/docs/lighthouse/overview?hl=ar" /><link rel="alternate" hreflang="bn" href="https://developer.chrome.com/docs/lighthouse/overview?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://developer.chrome.com/docs/lighthouse/overview?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://developer.chrome.com/docs/lighthouse/overview?hl=zh-tw" /><link rel="alternate" hreflang="nl" href="https://developer.chrome.com/docs/lighthouse/overview?hl=nl" /><link rel="alternate" hreflang="fa" href="https://developer.chrome.com/docs/lighthouse/overview?hl=fa" /><link rel="alternate" hreflang="fr" href="https://developer.chrome.com/docs/lighthouse/overview?hl=fr" /><link rel="alternate" hreflang="de" href="https://developer.chrome.com/docs/lighthouse/overview?hl=de" /><link rel="alternate" hreflang="he" href="https://developer.chrome.com/docs/lighthouse/overview?hl=he" /><link rel="alternate" hreflang="hi" href="https://developer.chrome.com/docs/lighthouse/overview?hl=hi" /><link rel="alternate" hreflang="id" href="https://developer.chrome.com/docs/lighthouse/overview?hl=id" /><link rel="alternate" hreflang="it" href="https://developer.chrome.com/docs/lighthouse/overview?hl=it" /><link rel="alternate" hreflang="ja" href="https://developer.chrome.com/docs/lighthouse/overview?hl=ja" /><link rel="alternate" hreflang="ko" href="https://developer.chrome.com/docs/lighthouse/overview?hl=ko" /><link rel="alternate" hreflang="pl" href="https://developer.chrome.com/docs/lighthouse/overview?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://developer.chrome.com/docs/lighthouse/overview?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://developer.chrome.com/docs/lighthouse/overview?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://developer.chrome.com/docs/lighthouse/overview?hl=es-419" /><link rel="alternate" hreflang="th" href="https://developer.chrome.com/docs/lighthouse/overview?hl=th" /><link rel="alternate" hreflang="tr" href="https://developer.chrome.com/docs/lighthouse/overview?hl=tr" /><link rel="alternate" hreflang="vi" href="https://developer.chrome.com/docs/lighthouse/overview?hl=vi" /><link rel="alternate" hreflang="en-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview" /><link rel="alternate" hreflang="x-default" href="https://developer.chrome.google.cn/docs/lighthouse/overview" /><link rel="alternate" hreflang="ar-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=ar" /><link rel="alternate" hreflang="bn-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=bn" /><link rel="alternate" hreflang="zh-Hans-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=zh-tw" /><link rel="alternate" hreflang="nl-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=nl" /><link rel="alternate" hreflang="fa-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=fa" /><link rel="alternate" hreflang="fr-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=fr" /><link rel="alternate" hreflang="de-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=de" /><link rel="alternate" hreflang="he-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=he" /><link rel="alternate" hreflang="hi-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=hi" /><link rel="alternate" hreflang="id-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=id" /><link rel="alternate" hreflang="it-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=it" /><link rel="alternate" hreflang="ja-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=ja" /><link rel="alternate" hreflang="ko-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=ko" /><link rel="alternate" hreflang="pl-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=pl" /><link rel="alternate" hreflang="pt-BR-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=pt-br" /><link rel="alternate" hreflang="ru-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=ru" /><link rel="alternate" hreflang="es-419-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=es-419" /><link rel="alternate" hreflang="th-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=th" /><link rel="alternate" hreflang="tr-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=tr" /><link rel="alternate" hreflang="vi-cn" href="https://developer.chrome.google.cn/docs/lighthouse/overview?hl=vi" /><title>Introduction to Lighthouse  |  Chrome for Developers</title> <meta property="og:title" content="Introduction to Lighthouse  |  Chrome for Developers"><meta name="description" content="Learn how to set up Lighthouse to audit your web apps."> <meta property="og:description" content="Learn how to set up Lighthouse to audit your web apps."><meta property="og:url" content="https://developer.chrome.com/docs/lighthouse/overview"><meta property="og:locale" content="en"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "dateModified": "2016-09-27", "headline": "Introduction to Lighthouse" } </script><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Docs", "item": "https://developer.chrome.com/docs" },{ "@type": "ListItem", "position": 2, "name": "Lighthouse", "item": "https://developer.chrome.com/docs/lighthouse" },{ "@type": "ListItem", "position": 3, "name": "Introduction to Lighthouse", "item": "https://developer.chrome.com/docs/lighthouse/overview" }] } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="page" theme="chrome-theme" type="article" appearance layout="docs" display-toc pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <section class="devsite-wrapper"> <devsite-cookie-notification-bar></devsite-cookie-notification-bar><devsite-header role="banner"> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="chromeForDevelopers" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="Chrome for Developers"> <img src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup.svg" class="devsite-site-logo" alt="Chrome for Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> <devsite-tabs class="upper-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Upper tabs"> <tab > <a href="https://developer.chrome.com/case-studies" track-metadata-eventdetail="https://developer.chrome.com/case-studies" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - get inspired" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Get inspired" track-name="get inspired" > Get inspired </a> </tab> <tab > <a href="https://developer.chrome.com/blog" track-metadata-eventdetail="https://developer.chrome.com/blog" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - blog" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Blog" track-name="blog" > Blog </a> </tab> <tab class="devsite-dropdown devsite-dropdown-full devsite-active "> <a href="https://developer.chrome.com/docs" track-metadata-eventdetail="https://developer.chrome.com/docs" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - docs" track-metadata-module="primary nav" aria-label="Docs, selected" data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" > Docs </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Docs" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs" track-metadata-position="nav - docs" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section build-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Build with Chrome</li> <li class="devsite-nav-description">Learn how Chrome works, participate in origin trials, and build with Chrome everywhere. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/web-platform" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/web-platform" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Web Platform </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/capabilities" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/capabilities" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Capabilities </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/chromedriver" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/chromedriver" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> ChromeDriver </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/extensions" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/extensions" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Extensions </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/webstore" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/webstore" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Chrome Web Store </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/chromium" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/chromium" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Chromium </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/aurora" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/aurora" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Aurora </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/android" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/android" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Web on Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/origintrials/" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/origintrials/" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Origin trials </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/release-notes" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/release-notes" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Release notes </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section productivity-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Productivity</li> <li class="devsite-nav-description">Create the best experience for your users with the web's best tools.</li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> DevTools </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/lighthouse" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Lighthouse </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/crux" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/crux" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Chrome UX Report </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/accessibility" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/accessibility" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Accessibility </div> </a> </li> </ul> <ul class="devsite-tabs-dropdown-section dcc-subnav second-column-list"> <li class="devsite-nav-description">Get things done quicker and neater, with our ready-made libraries. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/workbox" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/workbox" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Workbox </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/puppeteer" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/puppeteer" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Puppeteer </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section experience-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Experience</li> <li class="devsite-nav-description">Design a beautiful and performant web with Chrome. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/ai" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/ai" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> AI </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/performance" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/performance" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Performance </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/css-ui" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/css-ui" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> CSS and UI </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/identity" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/identity" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Identity </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/payments" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/payments" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Payments </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/privacy-security" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/privacy-security" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Privacy and security </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section resources-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Resources</li> <li class="devsite-nav-description">More from the Chrome team. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="resources" tooltip > <div class="devsite-nav-item-title"> All documentation </div> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev/baseline" track-type="nav" track-metadata-eventdetail="https://web.dev/baseline" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="resources" tooltip > <div class="devsite-nav-item-title"> Baseline </div> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev" track-type="nav" track-metadata-eventdetail="https://web.dev" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="resources" tooltip > <div class="devsite-nav-item-title"> web.dev </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://developer.chrome.com/new" track-metadata-eventdetail="https://developer.chrome.com/new" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - new in chrome" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: New in Chrome" track-name="new in chrome" > New in Chrome </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Lighthouse" tenant-name="Chrome for Developers" > <form class="devsite-search-form" action="https://developer.chrome.com/s/results" method="GET"> <div class="devsite-search-container"> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-expanded="false" aria-haspopup="listbox" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="combobox" type="text" value="" > <div class="devsite-search-image material-icons" aria-hidden="true"> </div> <div class="devsite-search-shortcut-icon-container" aria-hidden="true"> <kbd class="devsite-search-shortcut-icon">/</kbd> </div> </div> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-appearance-selector></devsite-appearance-selector> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="nl" >Nederlands</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> <devsite-user enable-profiles id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section "> <div class="devsite-header-background"> <div class="devsite-product-id-row" > <div class="devsite-product-description-row"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> <a href="https://developer.chrome.com/docs/lighthouse" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Lighthouse" > Lighthouse </a> </li> </ul> </div> </div> <div class="devsite-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab > <a href="https://developer.chrome.com/docs/lighthouse" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - lighthouse" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Lighthouse" track-name="lighthouse" > Lighthouse </a> </tab> <tab class="devsite-active"> <a href="https://developer.chrome.com/docs/lighthouse/overview" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse/overview" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - get started" track-metadata-module="primary nav" aria-label="Get started, selected" data-category="Site-Wide Custom Events" data-label="Tab: Get started" track-name="get started" > Get started </a> </tab> <tab > <a href="https://developer.chrome.com/docs/lighthouse/performance/performance-scoring" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse/performance/performance-scoring" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - performance audit" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Performance audit" track-name="performance audit" > Performance audit </a> </tab> <tab > <a href="https://developer.chrome.com/docs/lighthouse/accessibility/scoring" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse/accessibility/scoring" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - accessibility audit" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Accessibility audit" track-name="accessibility audit" > Accessibility audit </a> </tab> <tab > <a href="https://developer.chrome.com/docs/lighthouse/best-practices/doctype" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse/best-practices/doctype" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - best practices audit" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Best Practices audit" track-name="best practices audit" > Best Practices audit </a> </tab> <tab > <a href="https://developer.chrome.com/docs/lighthouse/seo/meta-description" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse/seo/meta-description" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - seo audit" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: SEO audit" track-name="seo audit" > SEO audit </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars > <div class="devsite-book-nav-filter" > <span class="filter-list-icon material-icons" aria-hidden="true"></span> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="chromeForDevelopers" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="Chrome for Developers"> <img src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup.svg" class="devsite-site-logo" alt="Chrome for Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="/case-studies" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Get inspired" track-name="get inspired" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Get inspired" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Get inspired </span> </a> </li> <li class="devsite-nav-item"> <a href="/blog" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Blog" track-name="blog" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Blog" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Blog </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Docs" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Docs </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" > <span class="devsite-nav-text" tooltip menu="Docs"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Docs"> </span> </span> </li> </ul> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/docs/lighthouse" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Lighthouse" track-name="lighthouse" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Lighthouse" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Lighthouse </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse/overview" class="devsite-nav-title gc-analytics-event devsite-nav-has-children devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Get started" track-name="get started" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Get started" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip menu="_book"> Get started </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="_book"> </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse/performance/performance-scoring" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Performance audit" track-name="performance audit" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Performance audit" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Performance audit </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse/accessibility/scoring" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Accessibility audit" track-name="accessibility audit" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Accessibility audit" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Accessibility audit </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse/best-practices/doctype" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Best Practices audit" track-name="best practices audit" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Best Practices audit" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Best Practices audit </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse/seo/meta-description" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: SEO audit" track-name="seo audit" data-category="Site-Wide Custom Events" data-label="Responsive Tab: SEO audit" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > SEO audit </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/new" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: New in Chrome" track-name="new in chrome" data-category="Site-Wide Custom Events" data-label="Responsive Tab: New in Chrome" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > New in Chrome </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="_book"> <li class="devsite-nav-item"><a href="/docs/lighthouse/overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Performance</span> </div></li> <li class="devsite-nav-item"><a href="/docs/lighthouse/performance/performance-scoring" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/performance-scoring" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/performance-scoring" ><span class="devsite-nav-text" tooltip>Performance audit scoring</span></a></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Metrics</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/first-contentful-paint" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/first-contentful-paint" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/first-contentful-paint" ><span class="devsite-nav-text" tooltip>First Contentful Paint</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/speed-index" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/speed-index" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/speed-index" ><span class="devsite-nav-text" tooltip>Speed Index</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/lighthouse-total-blocking-time" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/lighthouse-total-blocking-time" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/lighthouse-total-blocking-time" ><span class="devsite-nav-text" tooltip>Total Blocking Time</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/lighthouse-largest-contentful-paint" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/lighthouse-largest-contentful-paint" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/lighthouse-largest-contentful-paint" ><span class="devsite-nav-text" tooltip>Largest Contentful Paint</span></a></li><li class="devsite-nav-item devsite-nav-external"><a href="https://web.dev/cls/" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: https://web.dev/cls/" track-type="bookNav" track-name="click" track-metadata-eventdetail="https://web.dev/cls/" ><span class="devsite-nav-text" tooltip>Cumulative Layout Shift</span><span class="devsite-nav-icon material-icons" data-icon="external" data-title="External" aria-hidden="true"></span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Opportunities</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/render-blocking-resources" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/render-blocking-resources" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/render-blocking-resources" ><span class="devsite-nav-text" tooltip>Eliminate render-blocking resources</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-responsive-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-responsive-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-responsive-images" ><span class="devsite-nav-text" tooltip>Properly size images</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/offscreen-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/offscreen-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/offscreen-images" ><span class="devsite-nav-text" tooltip>Defer offscreen images</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/unminified-css" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/unminified-css" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/unminified-css" ><span class="devsite-nav-text" tooltip>Minify CSS</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/unminified-javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/unminified-javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/unminified-javascript" ><span class="devsite-nav-text" tooltip>Minify JavaScript</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/unused-css-rules" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/unused-css-rules" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/unused-css-rules" ><span class="devsite-nav-text" tooltip>Remove unused CSS</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-optimized-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-optimized-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-optimized-images" ><span class="devsite-nav-text" tooltip>Efficiently encode images</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-webp-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-webp-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-webp-images" ><span class="devsite-nav-text" tooltip>Serve images in modern formats</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-text-compression" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-text-compression" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-text-compression" ><span class="devsite-nav-text" tooltip>Enable text compression</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-rel-preconnect" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-rel-preconnect" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-rel-preconnect" ><span class="devsite-nav-text" tooltip>Preconnect to required origins</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/server-response-time" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/server-response-time" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/server-response-time" ><span class="devsite-nav-text" tooltip>Reduce server response times</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/redirects" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/redirects" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/redirects" ><span class="devsite-nav-text" tooltip>Avoid multiple page redirects</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-rel-preload" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-rel-preload" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-rel-preload" ><span class="devsite-nav-text" tooltip>Preload key requests</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/efficient-animated-content" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/efficient-animated-content" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/efficient-animated-content" ><span class="devsite-nav-text" tooltip>Use video formats for animated content</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/third-party-summary" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/third-party-summary" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/third-party-summary" ><span class="devsite-nav-text" tooltip>Reduce the impact of third-party code</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/non-composited-animations" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/non-composited-animations" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/non-composited-animations" ><span class="devsite-nav-text" tooltip>Avoid non-composited animations</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/third-party-facades" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/third-party-facades" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/third-party-facades" ><span class="devsite-nav-text" tooltip>Lazy load third-party resources with facades</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Diagnostics</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/total-byte-weight" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/total-byte-weight" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/total-byte-weight" ><span class="devsite-nav-text" tooltip>Avoid enormous network payloads</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/uses-long-cache-ttl" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/uses-long-cache-ttl" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/uses-long-cache-ttl" ><span class="devsite-nav-text" tooltip>Serve static assets with an efficient cache policy</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/dom-size" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/dom-size" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/dom-size" ><span class="devsite-nav-text" tooltip>Avoid an excessive DOM size</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/critical-request-chains" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/critical-request-chains" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/critical-request-chains" ><span class="devsite-nav-text" tooltip>Avoid chaining critical requests</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/user-timings" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/user-timings" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/user-timings" ><span class="devsite-nav-text" tooltip>User Timing marks and measures</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/bootup-time" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/bootup-time" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/bootup-time" ><span class="devsite-nav-text" tooltip>Reduce JavaScript execution time</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/mainthread-work-breakdown" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/mainthread-work-breakdown" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/mainthread-work-breakdown" ><span class="devsite-nav-text" tooltip>Minimize main thread work</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/font-display" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/font-display" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/font-display" ><span class="devsite-nav-text" tooltip>Ensure text remains visible during webfont load</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/resource-summary" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/resource-summary" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/resource-summary" ><span class="devsite-nav-text" tooltip>Keep request counts low and transfer sizes small</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/performance/bf-cache" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/bf-cache" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/bf-cache" ><span class="devsite-nav-text" tooltip>Ensure the page can be restored from the back/forward cache</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Retired Metrics</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item devsite-nav-deprecated"><a href="/docs/lighthouse/performance/interactive" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/interactive" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/interactive" ><span class="devsite-nav-text" tooltip>Time to Interactive</span><span class="devsite-nav-icon material-icons" data-icon="deprecated" data-title="Deprecated" aria-hidden="true"></span></a></li><li class="devsite-nav-item devsite-nav-deprecated"><a href="/docs/lighthouse/performance/first-meaningful-paint" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/first-meaningful-paint" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/first-meaningful-paint" ><span class="devsite-nav-text" tooltip>First Meaningful Paint</span><span class="devsite-nav-icon material-icons" data-icon="deprecated" data-title="Deprecated" aria-hidden="true"></span></a></li><li class="devsite-nav-item devsite-nav-deprecated"><a href="/docs/lighthouse/performance/first-cpu-idle" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/first-cpu-idle" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/first-cpu-idle" ><span class="devsite-nav-text" tooltip>First CPU Idle</span><span class="devsite-nav-icon material-icons" data-icon="deprecated" data-title="Deprecated" aria-hidden="true"></span></a></li><li class="devsite-nav-item devsite-nav-deprecated"><a href="/docs/lighthouse/performance/lighthouse-max-potential-fid" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/performance/lighthouse-max-potential-fid" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/performance/lighthouse-max-potential-fid" ><span class="devsite-nav-text" tooltip>Max Potential First Input Delay</span><span class="devsite-nav-icon material-icons" data-icon="deprecated" data-title="Deprecated" aria-hidden="true"></span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Accessibility</span> </div></li> <li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/scoring" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/scoring" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/scoring" ><span class="devsite-nav-text" tooltip>Accessibility audit scoring</span></a></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Manual checks</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/custom-control-roles" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/custom-control-roles" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/custom-control-roles" ><span class="devsite-nav-text" tooltip>Custom controls have ARIA roles</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/custom-controls-labels" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/custom-controls-labels" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/custom-controls-labels" ><span class="devsite-nav-text" tooltip>Custom controls have associated labels</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/focus-traps" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/focus-traps" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/focus-traps" ><span class="devsite-nav-text" tooltip>Trapped user focus</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/focusable-controls" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/focusable-controls" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/focusable-controls" ><span class="devsite-nav-text" tooltip>Interactive controls are keyboard-focusable</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/interactive-element-affordance" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/interactive-element-affordance" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/interactive-element-affordance" ><span class="devsite-nav-text" tooltip>Interactive elements indicate their purpose and state</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/logical-tab-order" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/logical-tab-order" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/logical-tab-order" ><span class="devsite-nav-text" tooltip>The page has a logical tab order</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/managed-focus" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/managed-focus" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/managed-focus" ><span class="devsite-nav-text" tooltip>The user's focus is directed to new content added to the page</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/offscreen-content-hidden" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/offscreen-content-hidden" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/offscreen-content-hidden" ><span class="devsite-nav-text" tooltip>Offscreen content is hidden from assistive technology</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/use-landmarks" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/use-landmarks" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/use-landmarks" ><span class="devsite-nav-text" tooltip>HTML5 landmark elements are used to improve navigation</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/accessibility/visual-order-follows-dom" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/accessibility/visual-order-follows-dom" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/accessibility/visual-order-follows-dom" ><span class="devsite-nav-text" tooltip>Visual order on the page follows DOM order</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-external"><a href="https://web.dev/learn/accessibility" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: https://web.dev/learn/accessibility" track-type="bookNav" track-name="click" track-metadata-eventdetail="https://web.dev/learn/accessibility" ><span class="devsite-nav-text" tooltip>Learn Accessibility</span><span class="devsite-nav-icon material-icons" data-icon="external" data-title="External" aria-hidden="true"></span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Best practices audit</span> </div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>General best practices</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/doctype" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/doctype" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/doctype" ><span class="devsite-nav-text" tooltip>Page lacks the HTML doctype, thus triggering quirks mode</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/errors-in-console" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/errors-in-console" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/errors-in-console" ><span class="devsite-nav-text" tooltip>Browser errors were logged to the console</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/image-aspect-ratio" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/image-aspect-ratio" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/image-aspect-ratio" ><span class="devsite-nav-text" tooltip>Displays images with incorrect aspect ratio</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/charset" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/charset" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/charset" ><span class="devsite-nav-text" tooltip>Charset declaration is missing or occurs too late in the HTML</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Make your page fast</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/uses-http2" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/uses-http2" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/uses-http2" ><span class="devsite-nav-text" tooltip>Does not use HTTP/2 for all of its resources</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/no-document-write" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/no-document-write" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/no-document-write" ><span class="devsite-nav-text" tooltip>Uses document.write()</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/uses-passive-event-listeners" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/uses-passive-event-listeners" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/uses-passive-event-listeners" ><span class="devsite-nav-text" tooltip>Use passive listeners to improve scrolling performance</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Make your page secure</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/external-anchors-use-rel-noopener" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/external-anchors-use-rel-noopener" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/external-anchors-use-rel-noopener" ><span class="devsite-nav-text" tooltip>Links to cross-origin destinations are unsafe</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/no-vulnerable-libraries" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/no-vulnerable-libraries" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/no-vulnerable-libraries" ><span class="devsite-nav-text" tooltip>Includes front-end JavaScript libraries with known security vulnerabilities</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/csp-xss" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/csp-xss" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/csp-xss" ><span class="devsite-nav-text" tooltip>Ensure CSP is effective against XSS attacks</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/is-on-https" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/is-on-https" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/is-on-https" ><span class="devsite-nav-text" tooltip>Does not use HTTPS</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/redirects-http" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/redirects-http" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/redirects-http" ><span class="devsite-nav-text" tooltip>Does not redirect HTTP traffic to HTTPS</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Create a good user experience</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/notification-on-start" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/notification-on-start" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/notification-on-start" ><span class="devsite-nav-text" tooltip>Requests the notification permission on page load</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/geolocation-on-start" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/geolocation-on-start" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/geolocation-on-start" ><span class="devsite-nav-text" tooltip>Requests the geolocation permission on page load</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/paste-preventing-inputs" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/paste-preventing-inputs" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/paste-preventing-inputs" ><span class="devsite-nav-text" tooltip>Prevents users from pasting into input fields</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/viewport" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/viewport" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/viewport" ><span class="devsite-nav-text" tooltip>Does not have a viewport tag with width or initial-scale</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Avoid deprecated technologies</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/appcache-manifest" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/appcache-manifest" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/appcache-manifest" ><span class="devsite-nav-text" tooltip>Uses Application Cache</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/deprecations" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/deprecations" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/deprecations" ><span class="devsite-nav-text" tooltip>Uses deprecated APIs</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Diagnostic audits</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/best-practices/js-libraries" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/best-practices/js-libraries" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/best-practices/js-libraries" ><span class="devsite-nav-text" tooltip>Detected JavaScript libraries</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>SEO</span> </div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Help search engines understand your content</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/meta-description" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/meta-description" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/meta-description" ><span class="devsite-nav-text" tooltip>Document does not have a meta description</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/link-text" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/link-text" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/link-text" ><span class="devsite-nav-text" tooltip>Links do not have descriptive text</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/hreflang" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/hreflang" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/hreflang" ><span class="devsite-nav-text" tooltip>Document doesn't have a valid hreflang</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/canonical" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/canonical" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/canonical" ><span class="devsite-nav-text" tooltip>Document does not have a valid rel=canonical</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Help search engines crawl and index</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/http-status-code" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/http-status-code" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/http-status-code" ><span class="devsite-nav-text" tooltip>Page has unsuccessful HTTP status code</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/invalid-robots-txt" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/invalid-robots-txt" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/invalid-robots-txt" ><span class="devsite-nav-text" tooltip>robots.txt is not valid</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/plugins" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/plugins" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/plugins" ><span class="devsite-nav-text" tooltip>Document uses plugins</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Mobile friendly changes</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/font-size" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/font-size" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/font-size" ><span class="devsite-nav-text" tooltip>Document doesn't use legible font sizes</span></a></li><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/tap-targets" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/tap-targets" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/tap-targets" ><span class="devsite-nav-text" tooltip>Tap targets are not sized appropriately</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Manual checks</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/lighthouse/seo/structured-data" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/seo/structured-data" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/seo/structured-data" ><span class="devsite-nav-text" tooltip>Structured data is valid</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Migrations</span> </div></li> <li class="devsite-nav-item"><a href="/docs/lighthouse/v3-migration-guide" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/lighthouse/v3-migration-guide" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/lighthouse/v3-migration-guide" ><span class="devsite-nav-text" tooltip>Lighthouse v3 Migration Guide</span></a></li> </ul> <ul class="devsite-nav-list" menu="Docs" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Build with Chrome </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs/web-platform" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Web Platform" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Web Platform </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/capabilities" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Capabilities" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Capabilities </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/chromedriver" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: ChromeDriver" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > ChromeDriver </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/extensions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Extensions" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Extensions </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/webstore" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Chrome Web Store" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Chrome Web Store </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/chromium" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Chromium" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Chromium </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/aurora" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Aurora" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Aurora </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/android" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Web on Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Web on Android </span> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/origintrials/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Origin trials" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Origin trials </span> </a> </li> <li class="devsite-nav-item"> <a href="/release-notes" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Release notes" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Release notes </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Productivity </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs/devtools" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: DevTools" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > DevTools </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Lighthouse" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Lighthouse </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/crux" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Chrome UX Report" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Chrome UX Report </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/accessibility" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Accessibility" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Accessibility </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/workbox" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Workbox" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Workbox </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/puppeteer" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Puppeteer" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Puppeteer </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Experience </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs/ai" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: AI" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > AI </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/performance" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Performance" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Performance </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/css-ui" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: CSS and UI" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > CSS and UI </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/identity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Identity" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Identity </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/payments" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Payments" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Payments </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/privacy-security" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Privacy and security" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Privacy and security </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Resources </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: All documentation" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > All documentation </span> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev/baseline" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Baseline" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Baseline </span> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: web.dev" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > web.dev </span> </a> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" class="devsite-main-content" has-book-nav has-sidebar > <div class="devsite-sidebar"> <div class="devsite-sidebar-content"> <devsite-toc class="devsite-nav" role="navigation" aria-label="On this page" depth="2" scrollbars ></devsite-toc> <devsite-recommendations-sidebar class="nocontent devsite-nav"> </devsite-recommendations-sidebar> </div> </div> <devsite-content> <article class="devsite-article"> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developer.chrome.com/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="" > Home </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.chrome.com/docs" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="Docs" > Docs </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.chrome.com/docs/lighthouse" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="Lighthouse" > Lighthouse </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.chrome.com/docs/lighthouse/overview" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="4" track-type="globalNav" track-name="breadcrumb" track-metadata-position="4" track-metadata-eventdetail="" > Get started </a> </li> </ul> <devsite-thumb-rating position="header"> </devsite-thumb-rating> </div> <h1 class="devsite-page-title" tabindex="-1"> Introduction to Lighthouse </h1> <devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip nocontent" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <div class="devsite-page-title-meta"><devsite-view-release-notes></devsite-view-release-notes></div> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded > </devsite-toc> <div class="devsite-article-body clearfix "> <p><img src="/static/docs/lighthouse/overview/image/lighthouse-logo.svg" alt="" class="attempt-right" width="150" height="150"></p> <p><a href="https://github.com/GoogleChrome/lighthouse">Lighthouse</a> is an open-source, automated tool to help you improve the quality of web pages. You can run it on any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, SEO, and more.</p> <p>You can run Lighthouse in Chrome DevTools, from the command line, or as a Node module. Give Lighthouse a URL to audit, it runs a series of audits against the page, and then it generates a report on how well the page performed. Use the failed audits as indicators for how to improve the page. Each audit has a reference that explains why the audit is important, as well as how to fix it.</p> <p>You can also use <a href="https://github.com/GoogleChrome/lighthouse-ci/blob/main/docs/getting-started.md">Lighthouse CI</a> to prevent regressions on your sites.</p> <p><devsite-video video-id="mLjxXPHuIJo"></devsite-video></p> <h2 id="get-started" data-text="Get started" tabindex="-1">Get started</h2> <p>Choose the Lighthouse workflow that suits you best:</p> <ul> <li><a href="#devtools">In Chrome DevTools</a>. Audit pages that require authentication and read your reports in a user-friendly format, right from the browser.</li> <li><a href="#cli">From the command line</a>. Automate your Lighthouse runs with shell scripts.</li> <li><a href="#programmatic">As a Node module</a>. Integrate Lighthouse into your continuous integration systems.</li> <li><a href="#psi">From a web UI</a>. Run Lighthouse and link to reports, no installation needed.</li> </ul> <aside class="note"><strong>Note:</strong><span> The CLI and Node workflows require you to have an instance of Google Chrome installed on your machine.</span></aside> <h3 id="devtools" data-text="Run Lighthouse in Chrome DevTools" tabindex="-1">Run Lighthouse in Chrome DevTools</h3> <p>Lighthouse has its own panel in Chrome DevTools. To run a report:</p> <ol> <li>Download <a href="https://www.google.com/chrome/browser/desktop/">Google Chrome for Desktop</a>.</li> <li>Open Chrome, and go to the URL you want to audit. You can audit any URL on the web.</li> <li><a href="/docs/devtools/open">Open Chrome DevTools</a>.</li> <li><p>Click the <strong>Lighthouse</strong> tab.</p> <p><figure> <img src="/static/docs/lighthouse/overview/image/lighthouse-devtools.png" alt width="800" height="524" srcset="https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_36.png 36w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_48.png 48w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_72.png 72w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_96.png 96w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_480.png 480w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_720.png 720w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_856.png 856w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_960.png 960w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_1440.png 1440w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_1920.png 1920w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-devtools_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"> <figcaption class="dcc-caption"> To the left is the viewport of the web page to be audited. The right is the Chrome DevTools <b>Lighthouse</b> panel. </figcaption> </figure></p></li> <li><p>Click <strong>Analyze page load</strong>. DevTools shows you a list of audit categories. Leave them all enabled.</p></li> <li><p>Click <strong>Run audit</strong>. After 30 to 60 seconds, Lighthouse gives you a report on the page.</p> <p><figure> <img src="/static/docs/lighthouse/overview/image/lighthouse-report.png" alt width="800" height="524" srcset="https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_36.png 36w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_48.png 48w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_72.png 72w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_96.png 96w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_480.png 480w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_720.png 720w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_856.png 856w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_960.png 960w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_1440.png 1440w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_1920.png 1920w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"> <figcaption class="dcc-caption"> A Lighthouse report in Chrome DevTools. </figcaption> </figure></p></li> </ol> <h3 id="cli" data-text="Install and run the Node command line tool" tabindex="-1">Install and run the Node command line tool</h3> <p>To install the Node module:</p> <ol> <li>Download <a href="https://www.google.com/chrome/browser/desktop/">Google Chrome for Desktop</a>.</li> <li>Install the current <a href="https://github.com/nodejs/Release">Long-Term Support</a> version of <a href="https://nodejs.org">Node</a>.</li> <li>Install Lighthouse. The <code translate="no" dir="ltr">-g</code> flag installs it as a global module.</li> </ol> <div></div><devsite-code><pre class="devsite-click-to-copy" translate="no" dir="ltr" is-upgraded syntax="Bash"><code translate="no" dir="ltr">npm<span class="devsite-syntax-w"> </span>install<span class="devsite-syntax-w"> </span>-g<span class="devsite-syntax-w"> </span>lighthouse </code></pre></devsite-code> <p>To run an audit:</p> <div></div><devsite-code><pre class="devsite-click-to-copy" translate="no" dir="ltr" is-upgraded syntax="Bash"><code translate="no" dir="ltr">lighthouse<span class="devsite-syntax-w"> </span><url> </code></pre></devsite-code> <p>To see all the options:</p> <div></div><devsite-code><pre class="devsite-click-to-copy" translate="no" dir="ltr" is-upgraded syntax="Bash"><code translate="no" dir="ltr">lighthouse<span class="devsite-syntax-w"> </span>--help </code></pre></devsite-code> <h4 id="programmatic" data-text="Run the Node module programmatically" tabindex="-1">Run the Node module programmatically</h4> <p>See <a href="https://github.com/GoogleChrome/lighthouse/blob/master/docs/readme.md#using-programmatically">Using programmatically</a> for an example of running Lighthouse programmatically, as a Node module.</p> <h3 id="psi" data-text="Run PageSpeed Insights" tabindex="-1">Run PageSpeed Insights</h3> <p>To run Lighthouse on PageSpeed Insights:</p> <ol> <li>Go to <a href="https://pagespeed.web.dev/">PageSpeed Insights</a>.</li> <li>Enter a web page URL.</li> <li><p>Click <strong>Analyze</strong>.</p> <p><figure> <img src="/static/docs/lighthouse/overview/image/pagespeed-insights.png" alt width="800" height="657" srcset="https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_36.png 36w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_48.png 48w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_72.png 72w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_96.png 96w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_480.png 480w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_720.png 720w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_856.png 856w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_960.png 960w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_1440.png 1440w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_1920.png 1920w,https://developer.chrome.com/static/docs/lighthouse/overview/image/pagespeed-insights_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"> <figcaption class="dcc-caption"> The PageSpeed Insights website. </figcaption> </figure></p></li> </ol> <h3 id="extension" data-text="Run Lighthouse as a Chrome Extension" tabindex="-1">Run Lighthouse as a Chrome Extension</h3> <aside class="caution"><strong>Caution:</strong><span> Unless you have a specific reason, you should use <a href="#devtools">Chrome DevTools</a> rather than this Chrome Extension workflow. The DevTools workflow allows for testing local sites and authenticated pages, while the extension does not.</span></aside> <p>To install the extension:</p> <ol> <li>Download <a href="https://www.google.com/chrome/browser/desktop/">Google Chrome for Desktop</a>.</li> <li>Install the <a href="https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk">Lighthouse Chrome Extension</a> from the Chrome Webstore.</li> </ol> <p>To run an audit:</p> <ol> <li>In Chrome, go to the page you want to audit.</li> <li><p>Click <img src="/static/docs/lighthouse/overview/image/lighthouse-extension-icio-fffce0f9d83c.svg" alt width="24" height="24"> <strong>Lighthouse</strong>, next to the Chrome address bar or in Chrome's extension menu. Once clicked, the Lighthouse menu expands.</p> <p><figure> <img src="/static/docs/lighthouse/overview/image/lighthouse-extension-generate.png" alt="" width="800" height="783"> <figcaption class="dcc-caption"> The extension prompts you to generate a report. </figcaption> </figure></p></li> <li><p>Click <strong>Generate report</strong>. Lighthouse runs its audits against the currently-focused page, then opens up a new tab with a report of the results.</p> <p><figure> <img src="/static/docs/lighthouse/overview/image/lighthouse-report-extension.png" alt="" width="800" height="783"> <figcaption class="dcc-caption"> A Lighthouse report generated from the extension. </figcaption> </figure></p></li> </ol> <h2 id="report-viewer" data-text="Share and view reports online" tabindex="-1">Share and view reports online</h2> <p>Use the <a href="https://googlechrome.github.io/lighthouse/viewer/">Lighthouse Viewer</a> to view and share reports online.</p> <figure> <img src="/static/docs/lighthouse/overview/image/lighthouse-report-viewer.png" alt width="800" height="578" srcset="https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_36.png 36w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_48.png 48w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_72.png 72w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_96.png 96w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_480.png 480w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_720.png 720w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_856.png 856w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_960.png 960w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_1440.png 1440w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_1920.png 1920w,https://developer.chrome.com/static/docs/lighthouse/overview/image/lighthouse-report-viewer_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"> <figcaption class="dcc-caption"> The Lighthouse Viewer </figcaption> </figure> <h3 id="json" data-text="Share reports as JSON" tabindex="-1">Share reports as JSON</h3> <p>The Lighthouse Viewer needs the JSON output of a Lighthouse report. Generate the JSON outputs as follows:</p> <ul> <li><strong>From a Lighthouse report</strong>. Click <span class="material-icons" aria-hidden="true" translate="no">more_vert</span> for the menu, then click <img src="/static/docs/lighthouse/overview/image/save-json-button.svg" alt width="24" height="24"> <strong>Save as JSON</strong></li> <li><strong>Command line</strong>. Run: <code translate="no" dir="ltr">shell lighthouse --output json --output-path <path/for/output.json></code></li> </ul> <p>To view the report data:</p> <ol> <li>Open the <a href="https://googlechrome.github.io/lighthouse/viewer/">Lighthouse Viewer</a>.</li> <li>Drag the JSON file onto the Viewer, or click anywhere in the Viewer to open your file navigator and select the file.</li> </ol> <h3 id="gists" data-text="Share reports as GitHub Gists" tabindex="-1">Share reports as GitHub Gists</h3> <p>If you don't want to manually pass around JSON files, you can also share your reports as secret GitHub gists. One benefit of gists is free version control.</p> <p>To export a report as a gist from the report:</p> <ol> <li>Click the <span class="material-icons" aria-hidden="true" translate="no">more_vert</span> menu, then click <img src="/static/docs/lighthouse/overview/image/open-viewer-button.svg" alt width="24" height="24"> <strong>Open In Viewer</strong>. The report is located at <code translate="no" dir="ltr">https://googlechrome.github.io/lighthouse/viewer/</code>.</li> <li>From the Viewer, click <span class="material-icons" aria-hidden="true" translate="no">more_vert</span> menu, then click <img src="/static/docs/lighthouse/overview/image/open-viewer-button.svg" alt width="24" height="24"> <strong>Save as Gist</strong>. The first time you do this, a popup asks permission to access your basic GitHub data, and to read and write to your gists.</li> </ol> <p>To export a report as a gist from the CLI version of Lighthouse, <a href="https://gist.github.com/">manually create a gist</a> and copy-paste the report's JSON output into the gist. The gist filename containing the JSON output must end in <code translate="no" dir="ltr">.lighthouse.report.json</code>. See <a href="#json">Share reports as JSON</a> for an example of how to generate JSON output from the command line tool.</p> <p>To view a report that's been saved as a gist:</p> <ul> <li>Add <code translate="no" dir="ltr">?gist=<ID></code> to the Viewer's URL, where <code translate="no" dir="ltr"><ID></code> is the ID of the gist. <code translate="no" dir="ltr">text https://googlechrome.github.io/lighthouse/viewer/?gist=<ID></code></li> <li>Open the <a href="https://googlechrome.github.io/lighthouse/viewer/">Viewer</a>, and paste the URL of a gist into it.</li> </ul> <h2 id="extensibility" data-text="Lighthouse extensibility" tabindex="-1">Lighthouse extensibility</h2> <p>Lighthouse aims to provide guidance that is relevant and actionable for all web developers. To this end, there are two features available that allow you to tailor Lighthouse to your specific needs.</p> <h3 id="stack_packs" data-text="Stack packs" tabindex="-1">Stack packs</h3> <p>Developers use many different technologies (backend, content management systems, and JavaScript frameworks) to build their web pages. Instead of surfacing general recommendations, Lighthouse provides relevant and actionable advice, depending on the tools used.</p> <p><em>Stack packs</em> allow Lighthouse to detect what platform your site is built on and display specific stack-based recommendations. These recommendations are defined and curated by experts from the community.</p> <p>To contribute a stack pack, review the <a href="https://github.com/GoogleChrome/lighthouse-stack-packs/blob/master/CONTRIBUTING.md">Contributing Guidelines</a>.</p> <h3 id="lighthouse_plugins" data-text="Lighthouse plugins" tabindex="-1">Lighthouse plugins</h3> <p>Lighthouse plugins allow domain experts to extend the functionality of Lighthouse for their community's specific needs. You can leverage the data that Lighthouse collects to create new audits. At its core, a Lighthouse plugin is a node module that implements a set of checks to be run by Lighthouse and added to the report as a new category.</p> <p>For more information about how to create your own plugin, check out our <a href="https://github.com/GoogleChrome/lighthouse/blob/master/docs/plugins.md">Plugin Handbook</a> in the Lighthouse GitHub repo.</p> <h2 id="integrate" data-text="Integrate Lighthouse" tabindex="-1">Integrate Lighthouse</h2> <p>If you're a company or an individual who is integrating Lighthouse as part of the products or services you're offering, that's great! We want as many people as possible to use Lighthouse.</p> <p>Refer to the <a href="https://docs.google.com/document/d/e/2PACX-1vRWKW9RiB3suYt1KqgBJhwLnvV-AiFne8iAudADtwK-LWLNParYsFts92InHNtB_BV5x-xtSVcnTO2n/pub">Guidelines and Brand Assets for Integrating Lighthouse</a> to show that Lighthouse is used, while protecting our brand.</p> <h2 id="contribute" data-text="Contribute to Lighthouse" tabindex="-1">Contribute to Lighthouse</h2> <p>Lighthouse is open source and <a href="https://github.com/GoogleChrome/lighthouse/blob/master/CONTRIBUTING.md">contributions are welcome</a>! Check out the repository's <a href="https://github.com/GoogleChrome/lighthouse/issues">Issue tracker</a> to find <a href="https://github.com/GoogleChrome/lighthouse/labels/good%20first%20issue">bugs that you can fix</a>, or audits that you can create or improve upon. The Issues are a good place to discuss performance metrics, ideas for new audits, or anything else related to Lighthouse.</p> </div> <devsite-thumb-rating position="footer"> </devsite-thumb-rating> <div class="devsite-floating-action-buttons"> </div> </article> <devsite-content-footer class="nocontent"> <p>Except as otherwise noted, the content of this page is licensed under the <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 License</a>, and code samples are licensed under the <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache 2.0 License</a>. For details, see the <a href="https://developers.google.com/site-policies">Google Developers Site Policies</a>. Java is a registered trademark of Oracle and/or its affiliates.</p> <p>Last updated 2016-09-27 UTC.</p> </devsite-content-footer> <devsite-notification > </devsite-notification> <div class="devsite-content-data"> <template class="devsite-content-data-template"> [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2016-09-27 UTC."],[],[]] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> <ul class="devsite-footer-linkboxes-list"> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Contribute</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://issuetracker.google.com/issues/new?component=1400036&template=1897236" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > File a bug </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://issuetracker.google.com/issues?q=status:open%20componentid:1400036&s=created_time:desc" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > See open issues </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Related content</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://blog.chromium.org/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Chromium updates </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/case-studies" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Case studies </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/deprecated" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Archive </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://web.dev/shows" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Podcasts & shows </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Follow</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://twitter.com/ChromiumDev" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > @ChromiumDev on X </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://www.youtube.com/user/ChromeDevelopers" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > YouTube </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://www.linkedin.com/showcase/chrome-for-developers" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Chrome for Developers on LinkedIn </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/static/blog/feed.xml" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > RSS </a> </li> </ul> </li> </ul> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/terms" data-category="Site-Wide Custom Events" data-label="Footer Terms link" > Terms </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link" > Privacy </a> </li> <li class="devsite-footer-utility-item glue-cookie-notification-bar-control"> <a class="devsite-footer-utility-link gc-analytics-event" href="#" data-category="Site-Wide Custom Events" data-label="Footer Manage cookies link" aria-hidden="true" > Manage cookies </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="nl" >Nederlands</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar></devsite-snackbar> <devsite-tooltip ></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics> <script type="application/json" analytics>[]</script> <script type="application/json" tag-management>{"at": "True", "ga4": [], "ga4p": [], "gtm": [{"id": "GTM-5QF3RT2", "purpose": 0}], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "article", "projectName": "Lighthouse", "signedIn": "False", "tenant": "chrome", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="ioqIvO5OLn0YbNrmQEaa44Skv1YFaF"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/js/app_loader.js', '[53,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome","https://chrome-dot-devsite-v2-prod-3p.appspot.com",1,null,["/_pwa/chrome/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/favicon.png","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup.svg","https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,112,113,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,147,148,149,151,152,156,157,158,159,161,163,164,168,169,170,179,180,182,183,186,191,193,196],"AIzaSyCNm9YxQumEXwGJgTDjxoxXK6m1F-9720Q","AIzaSyCc76DZePGtoyUjqKrLdsMGk_ry7sljLbY","developer.chrome.com","AIzaSyB9bqgQ2t11WJsOX8qNsCQ6U-w91mmqF-I","AIzaSyAdYnStPdzjcJJtQ0mvIaeaMKj7_t6J_Fg",null,null,null,["Cloud__enable_cloud_shell","Cloud__enable_free_trial_server_call","Cloud__enable_cloudx_experiment_ids","Profiles__enable_complete_playlist_endpoint","Profiles__enable_profile_collections","Cloud__enable_cloudx_ping","Profiles__require_profile_eligibility_for_signin","MiscFeatureFlags__enable_variable_operator","MiscFeatureFlags__enable_view_transitions","Profiles__enable_page_saving","Search__enable_ai_eligibility_checks","TpcFeatures__enable_mirror_tenant_redirects","Profiles__enable_public_developer_profiles","Search__enable_dynamic_content_confidential_banner","BookNav__enable_tenant_cache_key","Cloud__enable_cloud_shell_fte_user_flow","Search__enable_page_map","Profiles__enable_release_notes_notifications","OnSwitch__enable","Cloud__enable_legacy_calculator_redirect","Analytics__enable_clearcut_logging","TpcFeatures__enable_required_headers","MiscFeatureFlags__enable_firebase_utm","Profiles__enable_developer_profiles_callout","EngEduTelemetry__enable_engedu_telemetry","Experiments__reqs_query_experiments","CloudShell__cloud_shell_button","MiscFeatureFlags__developers_footer_image","Profiles__enable_completecodelab_endpoint","CloudShell__cloud_code_overflow_menu","Concierge__enable_pushui","MiscFeatureFlags__developers_footer_dark_image","Cloud__enable_llm_concierge_chat","Profiles__enable_awarding_url","DevPro__enable_developer_subscriptions","Cloud__enable_cloud_facet_chat","MiscFeatureFlags__enable_project_variables","DevPro__enable_cloud_innovators_plus","Cloud__enable_cloud_dlp_service","Search__enable_suggestions_from_borg","Profiles__enable_dashboard_curated_recommendations","MiscFeatureFlags__enable_explain_this_code","MiscFeatureFlags__emergency_css","Profiles__enable_recognition_badges"],null,null,"AIzaSyA58TaKli1DculwmAmbpzLVGuWc8eCQgQc","https://developerscontentserving-pa.googleapis.com","AIzaSyDWBU60w0P9hEkr29kkksYs8Z7gvZ8u_wc","https://developerscontentsearch-pa.googleapis.com",2,4,null,"https://developerprofiles-pa.googleapis.com",[53,"chrome","Chrome for Developers","developer.chrome.com",null,"chrome-dot-devsite-v2-prod-3p.appspot.com",null,null,[null,null,null,null,null,null,null,null,null,null,null,[1],null,null,null,null,null,null,[1],null,null,null,null,[1,null,1],[1,1,null,1,1]],null,[69,null,null,null,null,null,"/images/lockup.svg","/images/touchicon-180.png",null,null,null,1,1,null,null,null,null,null,null,null,null,2,null,null,null,"/images/lockup-dark-theme.svg",[]],[],null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,[[],[1,1]],[[null,null,null,null,null,["GTM-5QF3RT2"],null,null,null,null,null,[["GTM-5QF3RT2",1]],1]],null,4]]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

Introduction to Lighthouse | Chrome for Developers