Third-party JavaScript performance | Articles

<!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="web.dev"> <meta property="og:type" content="website"><meta name="theme-color" content="#3740ff"><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/web/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/web/css/app.css"> <link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/css/dark-theme.css" disabled> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/favicon.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/touchicon-180.png"><link rel="canonical" href="https://web.dev/articles/third-party-javascript"><link rel="search" type="application/opensearchdescription+xml" title="web.dev" href="https://web.dev/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://web.dev/articles/third-party-javascript" /><link rel="alternate" hreflang="x-default" href="https://web.dev/articles/third-party-javascript" /><link rel="alternate" hreflang="ar" href="https://web.dev/articles/third-party-javascript?hl=ar" /><link rel="alternate" hreflang="bn" href="https://web.dev/articles/third-party-javascript?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://web.dev/articles/third-party-javascript?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://web.dev/articles/third-party-javascript?hl=zh-tw" /><link rel="alternate" hreflang="fa" href="https://web.dev/articles/third-party-javascript?hl=fa" /><link rel="alternate" hreflang="fr" href="https://web.dev/articles/third-party-javascript?hl=fr" /><link rel="alternate" hreflang="de" href="https://web.dev/articles/third-party-javascript?hl=de" /><link rel="alternate" hreflang="he" href="https://web.dev/articles/third-party-javascript?hl=he" /><link rel="alternate" hreflang="hi" href="https://web.dev/articles/third-party-javascript?hl=hi" /><link rel="alternate" hreflang="id" href="https://web.dev/articles/third-party-javascript?hl=id" /><link rel="alternate" hreflang="it" href="https://web.dev/articles/third-party-javascript?hl=it" /><link rel="alternate" hreflang="ja" href="https://web.dev/articles/third-party-javascript?hl=ja" /><link rel="alternate" hreflang="ko" href="https://web.dev/articles/third-party-javascript?hl=ko" /><link rel="alternate" hreflang="pl" href="https://web.dev/articles/third-party-javascript?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://web.dev/articles/third-party-javascript?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://web.dev/articles/third-party-javascript?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://web.dev/articles/third-party-javascript?hl=es-419" /><link rel="alternate" hreflang="th" href="https://web.dev/articles/third-party-javascript?hl=th" /><link rel="alternate" hreflang="tr" href="https://web.dev/articles/third-party-javascript?hl=tr" /><link rel="alternate" hreflang="vi" href="https://web.dev/articles/third-party-javascript?hl=vi" /><link rel="alternate" hreflang="en-cn" href="https://web.developers.google.cn/articles/third-party-javascript" /><link rel="alternate" hreflang="x-default" href="https://web.developers.google.cn/articles/third-party-javascript" /><link rel="alternate" hreflang="ar-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=ar" /><link rel="alternate" hreflang="bn-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=bn" /><link rel="alternate" hreflang="zh-Hans-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=zh-tw" /><link rel="alternate" hreflang="fa-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=fa" /><link rel="alternate" hreflang="fr-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=fr" /><link rel="alternate" hreflang="de-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=de" /><link rel="alternate" hreflang="he-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=he" /><link rel="alternate" hreflang="hi-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=hi" /><link rel="alternate" hreflang="id-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=id" /><link rel="alternate" hreflang="it-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=it" /><link rel="alternate" hreflang="ja-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=ja" /><link rel="alternate" hreflang="ko-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=ko" /><link rel="alternate" hreflang="pl-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=pl" /><link rel="alternate" hreflang="pt-BR-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=pt-br" /><link rel="alternate" hreflang="ru-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=ru" /><link rel="alternate" hreflang="es-419-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=es-419" /><link rel="alternate" hreflang="th-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=th" /><link rel="alternate" hreflang="tr-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=tr" /><link rel="alternate" hreflang="vi-cn" href="https://web.developers.google.cn/articles/third-party-javascript?hl=vi" /><title>Third-party JavaScript performance  |  Articles  |  web.dev</title> <meta property="og:title" content="Third-party JavaScript performance  |  Articles  |  web.dev"><meta name="description" content="This post describes the common kinds of third-party JavaScript and the performance issues they can cause. It also provides general guidance about how to optimize third-party scripts."> <meta property="og:description" content="This post describes the common kinds of third-party JavaScript and the performance issues they can cause. It also provides general guidance about how to optimize third-party scripts."><meta property="og:url" content="https://web.dev/articles/third-party-javascript"><meta property="og:locale" content="en"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "dateModified": "2019-08-13", "headline": "Third-party JavaScript performance" } </script><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Articles", "item": "https://web.dev/articles" },{ "@type": "ListItem", "position": 2, "name": "Third-party JavaScript performance", "item": "https://web.dev/articles/third-party-javascript" }] } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="page" theme="web-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="webDev" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="web.dev"> <img src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/lockup.svg" class="devsite-site-logo" alt="web.dev"> </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://web.dev/about" track-metadata-eventdetail="https://web.dev/about" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - about" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: About" track-name="about" > About </a> </tab> <tab > <a href="https://web.dev/html" track-metadata-eventdetail="https://web.dev/html" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - html" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: HTML" track-name="html" > HTML </a> </tab> <tab > <a href="https://web.dev/css" track-metadata-eventdetail="https://web.dev/css" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - css" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: CSS" track-name="css" > CSS </a> </tab> <tab > <a href="https://web.dev/javascript" track-metadata-eventdetail="https://web.dev/javascript" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - javascript" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: JavaScript" track-name="javascript" > JavaScript </a> </tab> <tab > <a href="https://web.dev/blog" track-metadata-eventdetail="https://web.dev/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 > <a href="https://web.dev/learn" track-metadata-eventdetail="https://web.dev/learn" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - learn" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Learn" track-name="learn" > Learn </a> </tab> <tab class="devsite-active"> <a href="https://web.dev/explore" track-metadata-eventdetail="https://web.dev/explore" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - explore" track-metadata-module="primary nav" aria-label="Explore, selected" data-category="Site-Wide Custom Events" data-label="Tab: Explore" track-name="explore" > Explore </a> </tab> <tab > <a href="https://web.dev/patterns" track-metadata-eventdetail="https://web.dev/patterns" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - patterns" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Patterns" track-name="patterns" > Patterns </a> </tab> <tab > <a href="https://web.dev/case-studies" track-metadata-eventdetail="https://web.dev/case-studies" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - case studies" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Case studies" track-name="case studies" > Case studies </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Articles" tenant-name="web.dev" > <form class="devsite-search-form" action="https://web.dev/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="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://web.dev/explore" 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="" > Collections </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://web.dev/explore/learn-core-web-vitals" track-metadata-eventdetail="https://web.dev/explore/learn-core-web-vitals" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - core web vitals" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Core Web Vitals" track-name="core web vitals" > Core Web Vitals </a> </tab> <tab > <a href="https://web.dev/explore/metrics" track-metadata-eventdetail="https://web.dev/explore/metrics" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - metrics" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Metrics" track-name="metrics" > Metrics </a> </tab> <tab class="devsite-active"> <a href="https://web.dev/explore/fast" track-metadata-eventdetail="https://web.dev/explore/fast" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - fast load times" track-metadata-module="primary nav" aria-label="Fast load times, selected" data-category="Site-Wide Custom Events" data-label="Tab: Fast load times" track-name="fast load times" > Fast load times </a> </tab> <tab > <a href="https://web.dev/explore/ai" track-metadata-eventdetail="https://web.dev/explore/ai" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - ai" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: AI" track-name="ai" > AI </a> </tab> <tab > <a href="https://web.dev/explore/how-to-optimize-inp" track-metadata-eventdetail="https://web.dev/explore/how-to-optimize-inp" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - optimize interaction to next paint (inp)" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Optimize Interaction to Next Paint (INP)" track-name="optimize interaction to next paint (inp)" > Optimize Interaction to Next Paint (INP) </a> </tab> <tab > <a href="https://web.dev/explore/progressive-web-apps" track-metadata-eventdetail="https://web.dev/explore/progressive-web-apps" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - progressive web apps" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Progressive Web Apps" track-name="progressive web apps" > Progressive Web Apps </a> </tab> <tab > <a href="https://web.dev/accessibility" track-metadata-eventdetail="https://web.dev/accessibility" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - accessible to all" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Accessible to all" track-name="accessible to all" > Accessible to all </a> </tab> <tab > <a href="https://web.dev/explore/reliable" track-metadata-eventdetail="https://web.dev/explore/reliable" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - network reliability" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Network reliability" track-name="network reliability" > Network reliability </a> </tab> <tab > <a href="https://web.dev/explore/secure" track-metadata-eventdetail="https://web.dev/explore/secure" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - safe and secure" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Safe and secure" track-name="safe and secure" > Safe and secure </a> </tab> <tab > <a href="https://web.dev/explore/discoverable" track-metadata-eventdetail="https://web.dev/explore/discoverable" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - easily discoverable" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Easily discoverable" track-name="easily discoverable" > Easily discoverable </a> </tab> <tab > <a href="https://web.dev/explore/payments" track-metadata-eventdetail="https://web.dev/explore/payments" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - web payments" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Web Payments" track-name="web payments" > Web Payments </a> </tab> <tab > <a href="https://web.dev/explore/media" track-metadata-eventdetail="https://web.dev/explore/media" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - media" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Media" track-name="media" > Media </a> </tab> <tab > <a href="https://web.dev/explore/devices" track-metadata-eventdetail="https://web.dev/explore/devices" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - devices" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Devices" track-name="devices" > Devices </a> </tab> <tab > <a href="https://web.dev/explore/animations" track-metadata-eventdetail="https://web.dev/explore/animations" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - animations" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Animations" track-name="animations" > Animations </a> </tab> <tab > <a href="https://web.dev/explore/identity" track-metadata-eventdetail="https://web.dev/explore/identity" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - identity" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Identity" track-name="identity" > Identity </a> </tab> <tab > <a href="https://web.dev/explore/webassembly" track-metadata-eventdetail="https://web.dev/explore/webassembly" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - webassembly" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: WebAssembly" track-name="webassembly" > WebAssembly </a> </tab> <tab > <a href="https://web.dev/explore/test-automation" track-metadata-eventdetail="https://web.dev/explore/test-automation" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - test automation" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Test automation" track-name="test automation" > Test automation </a> </tab> <tab > <a href="https://web.dev/explore/react" track-metadata-eventdetail="https://web.dev/explore/react" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - react" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: React" track-name="react" > React </a> </tab> <tab > <a href="https://web.dev/explore/angular" track-metadata-eventdetail="https://web.dev/explore/angular" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - angular" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Angular" track-name="angular" > Angular </a> </tab> <tab > <a href="https://web.dev/explore/mini-apps" track-metadata-eventdetail="https://web.dev/explore/mini-apps" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - mini apps" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Mini apps" track-name="mini apps" > Mini apps </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars > <div class="devsite-book-nav-filter" hidden> <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="webDev" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="web.dev"> <img src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/lockup.svg" class="devsite-site-logo" alt="web.dev"> </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="/about" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: About" track-name="about" data-category="Site-Wide Custom Events" data-label="Responsive Tab: About" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > About </span> </a> </li> <li class="devsite-nav-item"> <a href="/html" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: HTML" track-name="html" data-category="Site-Wide Custom Events" data-label="Responsive Tab: HTML" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > HTML </span> </a> </li> <li class="devsite-nav-item"> <a href="/css" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: CSS" track-name="css" data-category="Site-Wide Custom Events" data-label="Responsive Tab: CSS" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > CSS </span> </a> </li> <li class="devsite-nav-item"> <a href="/javascript" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: JavaScript" track-name="javascript" data-category="Site-Wide Custom Events" data-label="Responsive Tab: JavaScript" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > JavaScript </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="/learn" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Learn" track-name="learn" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Learn" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Learn </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Explore" track-name="explore" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Explore" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Explore </span> </a> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/explore/learn-core-web-vitals" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Core Web Vitals" track-name="core web vitals" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Core Web Vitals" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Core Web Vitals </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/metrics" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Metrics" track-name="metrics" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Metrics" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Metrics </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/fast" class="devsite-nav-title gc-analytics-event devsite-nav-has-children devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Fast load times" track-name="fast load times" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Fast load times" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip menu="_book"> Fast load times </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="_book"> </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/ai" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: AI" track-name="ai" data-category="Site-Wide Custom Events" data-label="Responsive Tab: AI" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > AI </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/how-to-optimize-inp" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Optimize Interaction to Next Paint (INP)" track-name="optimize interaction to next paint (inp)" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Optimize Interaction to Next Paint (INP)" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Optimize Interaction to Next Paint (INP) </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/progressive-web-apps" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Progressive Web Apps" track-name="progressive web apps" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Progressive Web Apps" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Progressive Web Apps </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/accessibility" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Accessible to all" track-name="accessible to all" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Accessible to all" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Accessible to all </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/reliable" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Network reliability" track-name="network reliability" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Network reliability" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Network reliability </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/secure" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Safe and secure" track-name="safe and secure" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Safe and secure" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Safe and secure </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/discoverable" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Easily discoverable" track-name="easily discoverable" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Easily discoverable" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Easily discoverable </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/payments" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Web Payments" track-name="web payments" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Web Payments" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Web Payments </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/media" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Media" track-name="media" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Media" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Media </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/devices" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Devices" track-name="devices" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Devices" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Devices </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/animations" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Animations" track-name="animations" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Animations" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Animations </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/identity" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Identity" track-name="identity" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Identity" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Identity </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/webassembly" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: WebAssembly" track-name="webassembly" data-category="Site-Wide Custom Events" data-label="Responsive Tab: WebAssembly" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > WebAssembly </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/test-automation" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Test automation" track-name="test automation" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Test automation" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Test automation </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/react" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: React" track-name="react" data-category="Site-Wide Custom Events" data-label="Responsive Tab: React" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > React </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/angular" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Angular" track-name="angular" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Angular" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Angular </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/explore/mini-apps" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Mini apps" track-name="mini apps" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Mini apps" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Mini apps </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/patterns" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Patterns" track-name="patterns" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Patterns" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Patterns </span> </a> </li> <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: Case studies" track-name="case studies" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Case studies" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Case studies </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="_book"> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Introduction</span> </div></li> <li class="devsite-nav-item"><a href="/articles/why-speed-matters" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/why-speed-matters" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/why-speed-matters" ><span class="devsite-nav-text" tooltip>Why does speed matter?</span></a></li> <li class="devsite-nav-item"><a href="/articles/what-is-speed" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/what-is-speed" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/what-is-speed" ><span class="devsite-nav-text" tooltip>What is speed?</span></a></li> <li class="devsite-nav-item"><a href="/articles/how-to-measure-speed" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/how-to-measure-speed" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/how-to-measure-speed" ><span class="devsite-nav-text" tooltip>How to measure speed?</span></a></li> <li class="devsite-nav-item"><a href="/articles/how-to-stay-fast" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/how-to-stay-fast" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/how-to-stay-fast" ><span class="devsite-nav-text" tooltip>How to stay fast?</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>Core Web Vitals</span> </div></li> <li class="devsite-nav-item"><a href="/articles/vitals" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/vitals" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/vitals" ><span class="devsite-nav-text" tooltip>Web Vitals</span></a></li> <li class="devsite-nav-item"><a href="/articles/user-centric-performance-metrics" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/user-centric-performance-metrics" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/user-centric-performance-metrics" ><span class="devsite-nav-text" tooltip>User-centric performance metrics</span></a></li> <li class="devsite-nav-item"><a href="/articles/defining-core-web-vitals-thresholds" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/defining-core-web-vitals-thresholds" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/defining-core-web-vitals-thresholds" ><span class="devsite-nav-text" tooltip>Defining the Core Web Vitals metrics thresholds</span></a></li> <li class="devsite-nav-item"><a href="/articles/lcp" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/lcp" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/lcp" ><span class="devsite-nav-text" tooltip>Largest Contentful Paint (LCP)</span></a></li> <li class="devsite-nav-item"><a href="/articles/cls" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/cls" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/cls" ><span class="devsite-nav-text" tooltip>Cumulative Layout Shift (CLS)</span></a></li> <li class="devsite-nav-item"><a href="/articles/inp" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/inp" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/inp" ><span class="devsite-nav-text" tooltip>Interaction to Next Paint (INP)</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-lcp" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-lcp" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-lcp" ><span class="devsite-nav-text" tooltip>Optimize Largest Contentful Paint</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-cls" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-cls" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-cls" ><span class="devsite-nav-text" tooltip>Optimize Cumulative Layout Shift</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-inp" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-inp" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-inp" ><span class="devsite-nav-text" tooltip>Optimize Interaction to Next Paint</span></a></li> <li class="devsite-nav-item"><a href="/articles/top-cwv" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/top-cwv" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/top-cwv" ><span class="devsite-nav-text" tooltip>The most effective ways to improve Core Web Vitals</span></a></li> <li class="devsite-nav-item"><a href="/articles/vitals-tools" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/vitals-tools" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/vitals-tools" ><span class="devsite-nav-text" tooltip>Core Web Vitals workflows with Google tools</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-cwv-business" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-cwv-business" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-cwv-business" ><span class="devsite-nav-text" tooltip>Optimizing Core Web Vitals for business decision makers</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>Measure performance in the field</span> </div></li> <li class="devsite-nav-item"><a href="/articles/chrome-ux-report" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/chrome-ux-report" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/chrome-ux-report" ><span class="devsite-nav-text" tooltip>Using the Chrome UX Report to look at performance in the field</span></a></li> <li class="devsite-nav-item"><a href="/articles/lab-and-field-data-differences" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/lab-and-field-data-differences" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/lab-and-field-data-differences" ><span class="devsite-nav-text" tooltip>Why lab and field data can be different (and what to do about it)</span></a></li> <li class="devsite-nav-item"><a href="/articles/crux-and-rum-differences" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/crux-and-rum-differences" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/crux-and-rum-differences" ><span class="devsite-nav-text" tooltip>Why is CrUX data different from my RUM data?</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>Optimize your resource delivery</span> </div></li> <li class="devsite-nav-item"><a href="/articles/optimize-ttfb" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-ttfb" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-ttfb" ><span class="devsite-nav-text" tooltip>Optimize Time to First Byte</span></a></li> <li class="devsite-nav-item"><a href="/articles/content-delivery-networks" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/content-delivery-networks" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/content-delivery-networks" ><span class="devsite-nav-text" tooltip>Content delivery networks (CDNs)</span></a></li> <li class="devsite-nav-item"><a href="/articles/prioritize-resources" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/prioritize-resources" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/prioritize-resources" ><span class="devsite-nav-text" tooltip>Prioritize resources</span></a></li> <li class="devsite-nav-item"><a href="/articles/preload-critical-assets" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/preload-critical-assets" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/preload-critical-assets" ><span class="devsite-nav-text" tooltip>Preload critical assets to improve loading speed</span></a></li> <li class="devsite-nav-item"><a href="/articles/preconnect-and-dns-prefetch" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/preconnect-and-dns-prefetch" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/preconnect-and-dns-prefetch" ><span class="devsite-nav-text" tooltip>Establish network connections early to improve perceived page speed</span></a></li> <li class="devsite-nav-item"><a href="/articles/link-prefetch" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/link-prefetch" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/link-prefetch" ><span class="devsite-nav-text" tooltip>Prefetch resources to speed up future navigations</span></a></li> <li class="devsite-nav-item"><a href="/articles/fast-playback-with-preload" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/fast-playback-with-preload" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/fast-playback-with-preload" ><span class="devsite-nav-text" tooltip>Fast playback with audio and video preload</span></a></li> <li class="devsite-nav-item"><a href="/articles/adaptive-serving-based-on-network-quality" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/adaptive-serving-based-on-network-quality" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/adaptive-serving-based-on-network-quality" ><span class="devsite-nav-text" tooltip>Adaptive serving based on network quality</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>Optimize your images</span> </div></li> <li class="devsite-nav-item"><a href="/articles/choose-the-right-image-format" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/choose-the-right-image-format" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/choose-the-right-image-format" ><span class="devsite-nav-text" tooltip>Choose the right image format</span></a></li> <li class="devsite-nav-item"><a href="/articles/compress-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/compress-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/compress-images" ><span class="devsite-nav-text" tooltip>Choose the correct level of compression</span></a></li> <li class="devsite-nav-item"><a href="/articles/use-imagemin-to-compress-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/use-imagemin-to-compress-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/use-imagemin-to-compress-images" ><span class="devsite-nav-text" tooltip>Use Imagemin to compress images</span></a></li> <li class="devsite-nav-item"><a href="/articles/replace-gifs-with-videos" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/replace-gifs-with-videos" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/replace-gifs-with-videos" ><span class="devsite-nav-text" tooltip>Replace animated GIFs with video for faster page loads</span></a></li> <li class="devsite-nav-item"><a href="/articles/serve-responsive-images" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/serve-responsive-images" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/serve-responsive-images" ><span class="devsite-nav-text" tooltip>Serve responsive images</span></a></li> <li class="devsite-nav-item"><a href="/articles/serve-images-with-correct-dimensions" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/serve-images-with-correct-dimensions" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/serve-images-with-correct-dimensions" ><span class="devsite-nav-text" tooltip>Serve images with correct dimensions</span></a></li> <li class="devsite-nav-item"><a href="/articles/serve-images-webp" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/serve-images-webp" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/serve-images-webp" ><span class="devsite-nav-text" tooltip>Use WebP images</span></a></li> <li class="devsite-nav-item"><a href="/articles/image-cdns" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/image-cdns" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/image-cdns" ><span class="devsite-nav-text" tooltip>Use image CDNs to optimize images</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>Lazy-load images and video</span> </div></li> <li class="devsite-nav-item"><a href="/articles/browser-level-image-lazy-loading" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/browser-level-image-lazy-loading" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/browser-level-image-lazy-loading" ><span class="devsite-nav-text" tooltip>Browser-level image lazy loading for the web</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>Optimize web fonts</span> </div></li> <li class="devsite-nav-item"><a href="/articles/font-best-practices" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/font-best-practices" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/font-best-practices" ><span class="devsite-nav-text" tooltip>Best practices for fonts</span></a></li> <li class="devsite-nav-item"><a href="/articles/avoid-invisible-text" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/avoid-invisible-text" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/avoid-invisible-text" ><span class="devsite-nav-text" tooltip>Avoid invisible text during font loading</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-webfont-loading" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-webfont-loading" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-webfont-loading" ><span class="devsite-nav-text" tooltip>Optimize web font loading and rendering</span></a></li> <li class="devsite-nav-item"><a href="/articles/reduce-webfont-size" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/reduce-webfont-size" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/reduce-webfont-size" ><span class="devsite-nav-text" tooltip>Reduce web font size</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>Optimize your CSS</span> </div></li> <li class="devsite-nav-item"><a href="/articles/defer-non-critical-css" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/defer-non-critical-css" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/defer-non-critical-css" ><span class="devsite-nav-text" tooltip>Defer non-critical CSS</span></a></li> <li class="devsite-nav-item"><a href="/articles/minify-css" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/minify-css" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/minify-css" ><span class="devsite-nav-text" tooltip>Minify CSS</span></a></li> <li class="devsite-nav-item"><a href="/articles/extract-critical-css" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/extract-critical-css" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/extract-critical-css" ><span class="devsite-nav-text" tooltip>Extract critical CSS</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-css-background-images-with-media-queries" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-css-background-images-with-media-queries" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-css-background-images-with-media-queries" ><span class="devsite-nav-text" tooltip>Optimize CSS background images with media queries</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>Optimize your third-party resources</span> </div></li> <li class="devsite-nav-item"><a href="/articles/third-party-javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/third-party-javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/third-party-javascript" ><span class="devsite-nav-text" tooltip>Third-party JavaScript performance</span></a></li> <li class="devsite-nav-item"><a href="/articles/identify-slow-third-party-javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/identify-slow-third-party-javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/identify-slow-third-party-javascript" ><span class="devsite-nav-text" tooltip>Identify slow third-party JavaScript</span></a></li> <li class="devsite-nav-item"><a href="/articles/efficiently-load-third-party-javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/efficiently-load-third-party-javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/efficiently-load-third-party-javascript" ><span class="devsite-nav-text" tooltip>Efficiently load third-party JavaScript</span></a></li> <li class="devsite-nav-item"><a href="/articles/tag-best-practices" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/tag-best-practices" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/tag-best-practices" ><span class="devsite-nav-text" tooltip>Best practices for tags and tag managers</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>Optimize your JavaScript</span> </div></li> <li class="devsite-nav-item"><a href="/articles/optimize-long-tasks" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-long-tasks" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-long-tasks" ><span class="devsite-nav-text" tooltip>Optimize long tasks</span></a></li> <li class="devsite-nav-item"><a href="/articles/optimize-inp" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/optimize-inp" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/optimize-inp" ><span class="devsite-nav-text" tooltip>Optimize Interaction to Next Paint</span></a></li> <li class="devsite-nav-item"><a href="/articles/apply-instant-loading-with-prpl" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/apply-instant-loading-with-prpl" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/apply-instant-loading-with-prpl" ><span class="devsite-nav-text" tooltip>Apply instant loading with the PRPL pattern</span></a></li> <li class="devsite-nav-item"><a href="/articles/reduce-javascript-payloads-with-code-splitting" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/reduce-javascript-payloads-with-code-splitting" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/reduce-javascript-payloads-with-code-splitting" ><span class="devsite-nav-text" tooltip>Reduce JavaScript payloads with code splitting</span></a></li> <li class="devsite-nav-item"><a href="/articles/remove-unused-code" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/remove-unused-code" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/remove-unused-code" ><span class="devsite-nav-text" tooltip>Remove unused code</span></a></li> <li class="devsite-nav-item"><a href="/articles/reduce-network-payloads-using-text-compression" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/reduce-network-payloads-using-text-compression" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/reduce-network-payloads-using-text-compression" ><span class="devsite-nav-text" tooltip>Minify and compress network payloads</span></a></li> <li class="devsite-nav-item"><a href="/articles/serve-modern-code-to-modern-browsers" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/serve-modern-code-to-modern-browsers" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/serve-modern-code-to-modern-browsers" ><span class="devsite-nav-text" tooltip>Serve modern code to modern browsers for faster page loads</span></a></li> <li class="devsite-nav-item"><a href="/articles/publish-modern-javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/publish-modern-javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/publish-modern-javascript" ><span class="devsite-nav-text" tooltip>Publish, ship, and install modern JavaScript for faster applications</span></a></li> <li class="devsite-nav-item"><a href="/articles/commonjs-larger-bundles" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/commonjs-larger-bundles" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/commonjs-larger-bundles" ><span class="devsite-nav-text" tooltip>How CommonJS is making your bundles larger</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>Build a performance culture</span> </div></li> <li class="devsite-nav-item"><a href="/articles/value-of-speed" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/value-of-speed" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/value-of-speed" ><span class="devsite-nav-text" tooltip>The value of speed</span></a></li> <li class="devsite-nav-item"><a href="/articles/how-can-performance-improve-conversion" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/how-can-performance-improve-conversion" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/how-can-performance-improve-conversion" ><span class="devsite-nav-text" tooltip>How can performance improve conversion?</span></a></li> <li class="devsite-nav-item"><a href="/articles/what-should-you-measure-to-improve-performance" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/what-should-you-measure-to-improve-performance" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/what-should-you-measure-to-improve-performance" ><span class="devsite-nav-text" tooltip>What should you measure to improve performance?</span></a></li> <li class="devsite-nav-item"><a href="/articles/fixing-website-speed-cross-functionally" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/fixing-website-speed-cross-functionally" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/fixing-website-speed-cross-functionally" ><span class="devsite-nav-text" tooltip>Fixing website speed cross-functionally</span></a></li> <li class="devsite-nav-item"><a href="/articles/site-speed-and-business-metrics" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/site-speed-and-business-metrics" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/site-speed-and-business-metrics" ><span class="devsite-nav-text" tooltip>Relating site speed and business metrics</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>Set performance budgets</span> </div></li> <li class="devsite-nav-item"><a href="/articles/performance-budgets-101" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/performance-budgets-101" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/performance-budgets-101" ><span class="devsite-nav-text" tooltip>Performance budgets 101</span></a></li> <li class="devsite-nav-item"><a href="/articles/your-first-performance-budget" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/your-first-performance-budget" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/your-first-performance-budget" ><span class="devsite-nav-text" tooltip>Your first performance budget</span></a></li> <li class="devsite-nav-item"><a href="/articles/incorporate-performance-budgets-into-your-build-tools" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/incorporate-performance-budgets-into-your-build-tools" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/incorporate-performance-budgets-into-your-build-tools" ><span class="devsite-nav-text" tooltip>Incorporate performance budgets into your build process</span></a></li> <li class="devsite-nav-item"><a href="/articles/use-lighthouse-for-performance-budgets" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/use-lighthouse-for-performance-budgets" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/use-lighthouse-for-performance-budgets" ><span class="devsite-nav-text" tooltip>Use Lighthouse for performance budgets</span></a></li> <li class="devsite-nav-item"><a href="/articles/using-bundlesize-with-travis-ci" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/using-bundlesize-with-travis-ci" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/using-bundlesize-with-travis-ci" ><span class="devsite-nav-text" tooltip>Using bundlesize with Travis CI</span></a></li> <li class="devsite-nav-item"><a href="/articles/using-lighthouse-bot-to-set-a-performance-budget" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/using-lighthouse-bot-to-set-a-performance-budget" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/using-lighthouse-bot-to-set-a-performance-budget" ><span class="devsite-nav-text" tooltip>Using Lighthouse Bot to set a performance budget</span></a></li> <li class="devsite-nav-item"><a href="/articles/lighthouse-ci" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /articles/lighthouse-ci" track-type="bookNav" track-name="click" track-metadata-eventdetail="/articles/lighthouse-ci" ><span class="devsite-nav-text" tooltip>Performance monitoring with Lighthouse CI</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://web.dev/" 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://web.dev/articles" 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="Articles" > Articles </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.dev/explore" 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="" > Explore </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.dev/explore/fast" 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="" > Fast load times </a> </li> </ul> <devsite-thumb-rating position="header"> </devsite-thumb-rating> </div> <h1 class="devsite-page-title" tabindex="-1"> Third-party JavaScript performance </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>Find out how third-party JavaScript can affect performance and what you can do to keep it from slowing down your sites.</p> <p> <div class="wd-authors" translate="no"> <div class="wd-author"> <img class="devsite-landing-row-item-icon" alt="Milica Mihajlija" src="https://web.dev/images/authors/mihajlija.jpg" decoding="async" height="64" loading="lazy" width="64"> <div> <span> Milica Mihajlija </span> <div class="wd-author__links"> <a href="https://twitter.com/bibydigital" aria-label="Milica Mihajlija on X" rel="me"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 300 271"> <title>X</title> <path fill="currentColor" d="m236 0h46l-101 115 118 156h-92.6l-72.5-94.8-83 94.8h-46l107-123-113-148h94.9l65.5 86.6zm-16.1 244h25.5l-165-218h-27.4z"></path> </svg></a> <a href="https://github.com/mihajlija" aria-label="Milica Mihajlija on GitHub" rel="me"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 32.6 31.8"> <title>GitHub</title> <path d="M16.3 0C7.3 0 0 7.3 0 16.3c0 7.2 4.7 13.3 11.1 15.5.8.1 1.1-.4 1.1-.8v-2.8c-4.5 1-5.5-2.2-5.5-2.2-.7-1.9-1.8-2.4-1.8-2.4-1.5-1 .1-1 .1-1 1.6.1 2.5 1.7 2.5 1.7 1.5 2.5 3.8 1.8 4.7 1.4.1-1.1.6-1.8 1-2.2-3.6-.4-7.4-1.8-7.4-8.1 0-1.8.6-3.2 1.7-4.4-.1-.3-.7-2 .2-4.2 0 0 1.4-.4 4.5 1.7 1.3-.4 2.7-.5 4.1-.5 1.4 0 2.8.2 4.1.5 3.1-2.1 4.5-1.7 4.5-1.7.9 2.2.3 3.9.2 4.3 1 1.1 1.7 2.6 1.7 4.4 0 6.3-3.8 7.6-7.4 8 .6.5 1.1 1.5 1.1 3V31c0 .4.3.9 1.1.8 6.5-2.2 11.1-8.3 11.1-15.5C32.6 7.3 25.3 0 16.3 0z" fill-rule="evenodd" clip-rule="evenodd" fill="currentColor" /> </svg></a> <a href="https://mihajlija.github.io/" aria-label="Milica Mihajlija's homepage" rel="me"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 30 30"> <title>Homepage</title> <circle cx="14.5" cy="14.5" r="13.5" stroke-width="2" stroke-miterlimit="10" fill="none" stroke="currentColor" /> <ellipse cx="14.5" cy="14.5" rx="6.1" ry="13.5" stroke-width="2" stroke-miterlimit="10" fill="none" stroke="currentColor" /> <path d="M1.6 9.6h25.8M1.6 19.4h25.8" stroke-width="2" stroke-miterlimit="10" fill="none" stroke="currentColor" /> </svg></a> </div> </div> </div> </div></p> <p>Third-party JavaScript generally refers to scripts embedded in your website that are:</p> <ul> <li>Not authored by you</li> <li>Served from third-party servers</li> </ul> <p>Sites use these scripts for various purposes, including:</p> <ul> <li>Social sharing buttons</li> <li>Video player embeds</li> <li>Chat services</li> <li>Advertising iframes</li> <li>Analytics and metrics scripts</li> <li>A/B testing scripts for experiments</li> <li>Helper libraries (like date formatting, animation, and functional libraries)</li> </ul> <figure> <video autoplay loop muted playsinline > <source src="/static/articles/third-party-javascript/video/tcFciHGuF3MxnTr1y5ue01OGLBn2/uLXJ72jZAlzK56ctPwXd.mp4" type="video/mp4" /> </video> </figure> <p>Third-party scripts can provide powerful functionality, but that's not the whole story. They also affect privacy, security, and page behavior⁠—and they can be particularly problematic for performance.</p> <h2 id="performance" data-text="Performance" tabindex="-1">Performance</h2> <p>Any significant amount of <a href="https://developer.chrome.com/docs/lighthouse/performance/bootup-time">JavaScript can slow down performance</a>. But because third-party JavaScript is usually outside your control, it can bring additional issues.</p> <h3 id="network" data-text="Network" tabindex="-1">Network</h3> <p>Setting up connections takes time, and sending too many requests to multiple servers causes slowdowns. That time is even longer for secure connections, which may involve DNS lookups, redirects, and several round trips to the final server that handles the user's request.</p> <p>Third-party scripts often add to network overhead with things such as:</p> <ul> <li>Firing additional network requests</li> <li>Pulling in unoptimized images and videos</li> <li>Insufficient <a href="/articles/http-cache">HTTP caching</a>, which forces frequent fetching of network resources</li> <li>Insufficient <a href="/articles/optimizing-content-efficiency-optimize-encoding-and-transfer">server compression</a> of resources</li> <li>Multiple instances of frameworks and libraries pulled in by different third-party embeds</li> </ul> <h3 id="rendering" data-text="Rendering" tabindex="-1">Rendering</h3> <p>The way third-party JavaScript is loaded matters a lot. If it's done synchronously in the critical rendering path it delays parsing of the rest of the document.</p> <aside class="key-term"><b>Key term: </b> The <strong>critical rendering path</strong> includes all resources that the browser needs to display the first screen's worth of content. </aside> <p>If a third party has server issues and fails to deliver a resource, rendering is blocked until the request times out, which can be anywhere from 10 to 80 seconds. You can test and simulate this problem with <a href="https://css-tricks.com/use-webpagetest-api/#single-point-of-failure">WebPageTest Single-Point-of-Failure tests</a>.</p> <aside class="note"><b>Note: </b> <a href="/articles/optimizing-content-efficiency-loading-third-party-javascript#ab_test_smaller_samples_of_users">A/B testing scripts</a> can also often delay rendering. Most of them block content display until they complete processing—which can be true even for asynchronous A/B testing scripts. </aside> <h2 id="what_to_do_about_it" data-text="What to do about it" tabindex="-1">What to do about it</h2> <p>Using third-party JavaScript is often unavoidable, but there are things you can do to minimize adverse effects:</p> <ul> <li>When choosing third-party resources, favor those that send the least amount of code while still giving you the functionality you need.</li> <li>Use <a href="/articles/use-lighthouse-for-performance-budgets">performance budgets</a> for third-party content to keep their cost in check.</li> <li>Don't use the same functionality from two different vendors. You probably don't need two tag managers or two analytics platforms.</li> <li>Routinely audit and clean out redundant third-party scripts.</li> </ul> <p>To learn how to audit third-party content and load it efficiently for better performance and user experience, check out the other posts in the <a href="/explore/fast#optimize-your-third-party-resources">Optimize your third-party resources</a> section.</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 2019-08-13 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 2019-08-13 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 wd-footer-promo"> <h3 class="devsite-footer-linkbox-heading no-link">web.dev</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <h3 class="devsite-footer-linkbox-heading no-link"> web.dev </h3> <div class="devsite-footer-linkbox-description">We want to help you build beautiful, accessible, fast, and secure websites that work cross-browser, and for all of your users. This site is our home for content to help you on that journey, written by members of the Chrome team, and external experts.</div> </li> </ul> </li> <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=1400680&template=1857359" 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:1400680&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://developer.chrome.com/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Chrome for Developers </a> </li> <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 2)" > 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 3)" > Case studies </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/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="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-MZWCJPP", "purpose": 0}], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "article", "projectName": "Articles", "signedIn": "False", "tenant": "web", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="Q1srD1msX7fY4WytQ1B4s4mHnCnnzm"> (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/web/js/app_loader.js', '[27,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web","https://web-dot-devsite-v2-prod-3p.appspot.com",1,null,["/_pwa/web/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/images/favicon.png","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/web/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","web.dev","AIzaSyB9bqgQ2t11WJsOX8qNsCQ6U-w91mmqF-I","AIzaSyAdYnStPdzjcJJtQ0mvIaeaMKj7_t6J_Fg",null,null,null,["Analytics__enable_clearcut_logging","MiscFeatureFlags__enable_firebase_utm","EngEduTelemetry__enable_engedu_telemetry","Profiles__enable_page_saving","TpcFeatures__enable_required_headers","MiscFeatureFlags__enable_project_variables","Cloud__enable_legacy_calculator_redirect","Profiles__enable_profile_collections","Profiles__enable_dashboard_curated_recommendations","TpcFeatures__enable_mirror_tenant_redirects","BookNav__enable_tenant_cache_key","Profiles__require_profile_eligibility_for_signin","MiscFeatureFlags__emergency_css","Concierge__enable_pushui","Search__enable_suggestions_from_borg","Cloud__enable_llm_concierge_chat","MiscFeatureFlags__developers_footer_dark_image","Profiles__enable_recognition_badges","Cloud__enable_cloud_shell_fte_user_flow","Experiments__reqs_query_experiments","Search__enable_dynamic_content_confidential_banner","Cloud__enable_cloud_facet_chat","DevPro__enable_cloud_innovators_plus","Cloud__enable_cloudx_ping","MiscFeatureFlags__enable_explain_this_code","Profiles__enable_release_notes_notifications","OnSwitch__enable","Cloud__enable_cloud_shell","Cloud__enable_free_trial_server_call","MiscFeatureFlags__enable_variable_operator","Profiles__enable_public_developer_profiles","Profiles__enable_completecodelab_endpoint","Search__enable_page_map","Profiles__enable_complete_playlist_endpoint","Profiles__enable_awarding_url","CloudShell__cloud_shell_button","Profiles__enable_developer_profiles_callout","MiscFeatureFlags__enable_view_transitions","DevPro__enable_developer_subscriptions","MiscFeatureFlags__developers_footer_image","CloudShell__cloud_code_overflow_menu","Search__enable_ai_eligibility_checks","Cloud__enable_cloud_dlp_service","Cloud__enable_cloudx_experiment_ids"],null,null,"AIzaSyA58TaKli1DculwmAmbpzLVGuWc8eCQgQc","https://developerscontentserving-pa.googleapis.com","AIzaSyDWBU60w0P9hEkr29kkksYs8Z7gvZ8u_wc","https://developerscontentsearch-pa.googleapis.com",2,4,null,"https://developerprofiles-pa.googleapis.com",[27,"web","web.dev","web.dev",null,"web-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,[38,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-MZWCJPP"],null,null,null,null,null,[["GTM-MZWCJPP",1]],1]],null,4]]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

Third-party JavaScript performance | Articles | web.dev