CINXE.COM
Shows | web.dev
<!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/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web/css/app.css"> <link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web/css/dark-theme.css" disabled> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web/images/favicon.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web/images/touchicon-180.png"><link rel="canonical" href="https://web.dev/shows"><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/shows" /><link rel="alternate" hreflang="x-default" href="https://web.dev/shows" /><link rel="alternate" hreflang="ar" href="https://web.dev/shows?hl=ar" /><link rel="alternate" hreflang="bn" href="https://web.dev/shows?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://web.dev/shows?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://web.dev/shows?hl=zh-tw" /><link rel="alternate" hreflang="fa" href="https://web.dev/shows?hl=fa" /><link rel="alternate" hreflang="fr" href="https://web.dev/shows?hl=fr" /><link rel="alternate" hreflang="de" href="https://web.dev/shows?hl=de" /><link rel="alternate" hreflang="he" href="https://web.dev/shows?hl=he" /><link rel="alternate" hreflang="hi" href="https://web.dev/shows?hl=hi" /><link rel="alternate" hreflang="id" href="https://web.dev/shows?hl=id" /><link rel="alternate" hreflang="it" href="https://web.dev/shows?hl=it" /><link rel="alternate" hreflang="ja" href="https://web.dev/shows?hl=ja" /><link rel="alternate" hreflang="ko" href="https://web.dev/shows?hl=ko" /><link rel="alternate" hreflang="pl" href="https://web.dev/shows?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://web.dev/shows?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://web.dev/shows?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://web.dev/shows?hl=es-419" /><link rel="alternate" hreflang="th" href="https://web.dev/shows?hl=th" /><link rel="alternate" hreflang="tr" href="https://web.dev/shows?hl=tr" /><link rel="alternate" hreflang="vi" href="https://web.dev/shows?hl=vi" /><link rel="alternate" hreflang="en-cn" href="https://web.developers.google.cn/shows" /><link rel="alternate" hreflang="x-default" href="https://web.developers.google.cn/shows" /><link rel="alternate" hreflang="ar-cn" href="https://web.developers.google.cn/shows?hl=ar" /><link rel="alternate" hreflang="bn-cn" href="https://web.developers.google.cn/shows?hl=bn" /><link rel="alternate" hreflang="zh-Hans-cn" href="https://web.developers.google.cn/shows?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant-cn" href="https://web.developers.google.cn/shows?hl=zh-tw" /><link rel="alternate" hreflang="fa-cn" href="https://web.developers.google.cn/shows?hl=fa" /><link rel="alternate" hreflang="fr-cn" href="https://web.developers.google.cn/shows?hl=fr" /><link rel="alternate" hreflang="de-cn" href="https://web.developers.google.cn/shows?hl=de" /><link rel="alternate" hreflang="he-cn" href="https://web.developers.google.cn/shows?hl=he" /><link rel="alternate" hreflang="hi-cn" href="https://web.developers.google.cn/shows?hl=hi" /><link rel="alternate" hreflang="id-cn" href="https://web.developers.google.cn/shows?hl=id" /><link rel="alternate" hreflang="it-cn" href="https://web.developers.google.cn/shows?hl=it" /><link rel="alternate" hreflang="ja-cn" href="https://web.developers.google.cn/shows?hl=ja" /><link rel="alternate" hreflang="ko-cn" href="https://web.developers.google.cn/shows?hl=ko" /><link rel="alternate" hreflang="pl-cn" href="https://web.developers.google.cn/shows?hl=pl" /><link rel="alternate" hreflang="pt-BR-cn" href="https://web.developers.google.cn/shows?hl=pt-br" /><link rel="alternate" hreflang="ru-cn" href="https://web.developers.google.cn/shows?hl=ru" /><link rel="alternate" hreflang="es-419-cn" href="https://web.developers.google.cn/shows?hl=es-419" /><link rel="alternate" hreflang="th-cn" href="https://web.developers.google.cn/shows?hl=th" /><link rel="alternate" hreflang="tr-cn" href="https://web.developers.google.cn/shows?hl=tr" /><link rel="alternate" hreflang="vi-cn" href="https://web.developers.google.cn/shows?hl=vi" /><title>Shows | web.dev</title> <meta property="og:title" content="Shows | web.dev"><meta name="description" content="Listen and watch our latest news, updates, and stories for developers"> <meta property="og:description" content="Listen and watch our latest news, updates, and stories for developers"><meta property="og:url" content="https://web.dev/shows"><meta property="og:locale" content="en"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Shows" } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="landing" theme="web-theme" type="article" appearance layout="full" pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <a href="#main-content" class="skip-link button"> Skip to main content </a> <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/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/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/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/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" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/about" 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/blog" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/blog" 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/articles" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/articles" track-type="nav" track-metadata-position="nav - articles" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Articles" track-name="articles" > Articles </a> </tab> <tab > <a href="https://web.dev/learn" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/learn" 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 > <a href="https://web.dev/explore" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/explore" track-type="nav" track-metadata-position="nav - explore" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Explore" track-name="explore" > Explore </a> </tab> <tab > <a href="https://web.dev/patterns" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/patterns" 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" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/case-studies" 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> <tab class="devsite-active"> <a href="https://web.dev/shows" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows" track-type="nav" track-metadata-position="nav - shows" track-metadata-module="primary nav" aria-label="Shows, selected" data-category="Site-Wide Custom Events" data-label="Tab: Shows" track-name="shows" > Shows </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Shows" 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-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab > <a href="https://web.dev/shows/this-is-baseline" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/this-is-baseline" track-type="nav" track-metadata-position="nav - this is baseline" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: This is Baseline" track-name="this is baseline" > This is Baseline </a> </tab> <tab > <a href="https://web.dev/shows/designing-in-the-browser" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/designing-in-the-browser" track-type="nav" track-metadata-position="nav - designing in the browser" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Designing in the Browser" track-name="designing in the browser" > Designing in the Browser </a> </tab> <tab > <a href="https://web.dev/shows/gui-challenges" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/gui-challenges" track-type="nav" track-metadata-position="nav - gui challenges" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: GUI Challenges" track-name="gui challenges" > GUI Challenges </a> </tab> <tab > <a href="https://web.dev/shows/http-203" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/http-203" track-type="nav" track-metadata-position="nav - http 203" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: HTTP 203" track-name="http 203" > HTTP 203 </a> </tab> <tab > <a href="https://web.dev/shows/mother-language-day" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/mother-language-day" track-type="nav" track-metadata-position="nav - mother language day" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Mother Language Day" track-name="mother language day" > Mother Language Day </a> </tab> <tab > <a href="https://web.dev/shows/web-dev-live-day-1" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/web-dev-live-day-1" track-type="nav" track-metadata-position="nav - web.dev live day 1" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: web.dev LIVE Day 1" track-name="web.dev live day 1" > web.dev LIVE Day 1 </a> </tab> <tab > <a href="https://web.dev/shows/web-dev-live-day-2" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/web-dev-live-day-2" track-type="nav" track-metadata-position="nav - web.dev live day 2" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: web.dev LIVE Day 2" track-name="web.dev live day 2" > web.dev LIVE Day 2 </a> </tab> <tab > <a href="https://web.dev/shows/web-dev-live-day-3" class="devsite-tabs-content gc-analytics-event " track-metadata-eventdetail="https://web.dev/shows/web-dev-live-day-3" track-type="nav" track-metadata-position="nav - web.dev live day 3" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: web.dev LIVE Day 3" track-name="web.dev live day 3" > web.dev LIVE Day 3 </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars hidden> <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/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/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/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/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="/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="/articles" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Articles" track-name="articles" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Articles" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Articles </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 " 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> </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> <li class="devsite-nav-item"> <a href="/shows" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Shows" track-name="shows" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Shows" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Shows </span> </a> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/shows/this-is-baseline" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: This is Baseline" track-name="this is baseline" data-category="Site-Wide Custom Events" data-label="Responsive Tab: This is Baseline" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > This is Baseline </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/designing-in-the-browser" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Designing in the Browser" track-name="designing in the browser" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Designing in the Browser" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Designing in the Browser </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/gui-challenges" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: GUI Challenges" track-name="gui challenges" data-category="Site-Wide Custom Events" data-label="Responsive Tab: GUI Challenges" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > GUI Challenges </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/http-203" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: HTTP 203" track-name="http 203" data-category="Site-Wide Custom Events" data-label="Responsive Tab: HTTP 203" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > HTTP 203 </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/mother-language-day" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Mother Language Day" track-name="mother language day" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Mother Language Day" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Mother Language Day </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/web-dev-live-day-1" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: web.dev LIVE Day 1" track-name="web.dev live day 1" data-category="Site-Wide Custom Events" data-label="Responsive Tab: web.dev LIVE Day 1" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > web.dev LIVE Day 1 </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/web-dev-live-day-2" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: web.dev LIVE Day 2" track-name="web.dev live day 2" data-category="Site-Wide Custom Events" data-label="Responsive Tab: web.dev LIVE Day 2" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > web.dev LIVE Day 2 </span> </a> </li> <li class="devsite-nav-item"> <a href="/shows/web-dev-live-day-3" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: web.dev LIVE Day 3" track-name="web.dev live day 3" data-category="Site-Wide Custom Events" data-label="Responsive Tab: web.dev LIVE Day 3" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > web.dev LIVE Day 3 </span> </a> </li> </ul> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" id="main-content" class="devsite-main-content" > <div class="devsite-sidebar"> <div class="devsite-sidebar-content"> <devsite-toc class="devsite-nav" role="navigation" aria-label="On this page" depth="2" scrollbars disabled></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/shows" 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="Shows" > Shows </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.dev/shows/this-is-baseline" 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="" > This is Baseline </a> </li> </ul> </div> <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> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded disabled> </devsite-toc> <div class="devsite-article-body clearfix "> <section class="devsite-landing-row devsite-landing-row-1-up devsite-landing-row-hero devsite-landing-row-header-centered devsite-landing-row-padding-large" background="grey" header-position="top" > <div class="devsite-landing-row-inner"> <header class="devsite-landing-row-header" > <div class="devsite-landing-row-header-text"> <h2 id="shows" data-text="Shows" tabindex="0"> Shows </h2> <div class="devsite-landing-row-description"> Listen and watch our latest news, updates, and stories for developers </div> </div> </header> </div> </section> <section class="devsite-landing-row devsite-landing-row-3-up devsite-landing-row-cards devsite-landing-row-padding-large devsite-landing-row-no-image-background" header-position="top" > <div class="devsite-landing-row-inner"> <div class="devsite-landing-row-group"> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/this-is-baseline"> <picture> <img alt="" src="https://web.dev/static/image/youtube/thisisbaseline.png" srcset="https://web.dev/static/image/youtube/thisisbaseline_36.png 36w,https://web.dev/static/image/youtube/thisisbaseline_48.png 48w,https://web.dev/static/image/youtube/thisisbaseline_72.png 72w,https://web.dev/static/image/youtube/thisisbaseline_96.png 96w,https://web.dev/static/image/youtube/thisisbaseline_480.png 480w,https://web.dev/static/image/youtube/thisisbaseline_720.png 720w,https://web.dev/static/image/youtube/thisisbaseline_856.png 856w,https://web.dev/static/image/youtube/thisisbaseline_960.png 960w,https://web.dev/static/image/youtube/thisisbaseline_1440.png 1440w,https://web.dev/static/image/youtube/thisisbaseline_1920.png 1920w,https://web.dev/static/image/youtube/thisisbaseline_2880.png 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="this-is-baseline" data-text="This is Baseline" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/this-is-baseline"> This is Baseline </a> </h3> <div class="devsite-landing-row-item-description-content"> This is Baseline is a series of short videos that introduce new features in web platform and how to use them. </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/designing-in-the-browser"> <picture> <img alt="" src="https://web.dev/static/image/youtube/KBQz1OSpRv8.jpg" srcset="https://web.dev/static/image/youtube/KBQz1OSpRv8_36.jpg 36w,https://web.dev/static/image/youtube/KBQz1OSpRv8_48.jpg 48w,https://web.dev/static/image/youtube/KBQz1OSpRv8_72.jpg 72w,https://web.dev/static/image/youtube/KBQz1OSpRv8_96.jpg 96w,https://web.dev/static/image/youtube/KBQz1OSpRv8_480.jpg 480w,https://web.dev/static/image/youtube/KBQz1OSpRv8_720.jpg 720w,https://web.dev/static/image/youtube/KBQz1OSpRv8_856.jpg 856w,https://web.dev/static/image/youtube/KBQz1OSpRv8_960.jpg 960w,https://web.dev/static/image/youtube/KBQz1OSpRv8_1440.jpg 1440w,https://web.dev/static/image/youtube/KBQz1OSpRv8_1920.jpg 1920w,https://web.dev/static/image/youtube/KBQz1OSpRv8_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="designing-in-the-browser" data-text="Designing in the Browser" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/designing-in-the-browser"> Designing in the Browser </a> </h3> <div class="devsite-landing-row-item-description-content"> Designing in the Browser explores the intersection of design and front-end development, teaching you how to build beautiful UIs with modern web standards in mind. </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://wasmassembly.libsyn.com/"> <picture> <img alt="" src="https://web.dev/static/image/youtube/wasmassembly.jpg" srcset="https://web.dev/static/image/youtube/wasmassembly_36.jpg 36w,https://web.dev/static/image/youtube/wasmassembly_48.jpg 48w,https://web.dev/static/image/youtube/wasmassembly_72.jpg 72w,https://web.dev/static/image/youtube/wasmassembly_96.jpg 96w,https://web.dev/static/image/youtube/wasmassembly_480.jpg 480w,https://web.dev/static/image/youtube/wasmassembly_720.jpg 720w,https://web.dev/static/image/youtube/wasmassembly_856.jpg 856w,https://web.dev/static/image/youtube/wasmassembly_960.jpg 960w,https://web.dev/static/image/youtube/wasmassembly_1440.jpg 1440w,https://web.dev/static/image/youtube/wasmassembly_1920.jpg 1920w,https://web.dev/static/image/youtube/wasmassembly_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="wasmassembly" data-text="WasmAssembly" class="hide-from-toc no-link" tabindex="0"> <a href="https://wasmassembly.libsyn.com/"> WasmAssembly </a> </h3> <div class="devsite-landing-row-item-description-content"> WebAssembly (abbreviated Wasm) is a safe, portable, low-level code format designed for efficient execution and compact representation. An assembly is a group of people gathered together in one place for a common purpose. In this show with the whimsical name WasmAssembly (get it?), Thomas Steiner chats with experts from the community about the past, present, and future developments happening in the world of WebAssembly. </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/gui-challenges"> <picture> <img alt="" src="https://web.dev/static/image/youtube/6aCsAMgwnjE.jpg" srcset="https://web.dev/static/image/youtube/6aCsAMgwnjE_36.jpg 36w,https://web.dev/static/image/youtube/6aCsAMgwnjE_48.jpg 48w,https://web.dev/static/image/youtube/6aCsAMgwnjE_72.jpg 72w,https://web.dev/static/image/youtube/6aCsAMgwnjE_96.jpg 96w,https://web.dev/static/image/youtube/6aCsAMgwnjE_480.jpg 480w,https://web.dev/static/image/youtube/6aCsAMgwnjE_720.jpg 720w,https://web.dev/static/image/youtube/6aCsAMgwnjE_856.jpg 856w,https://web.dev/static/image/youtube/6aCsAMgwnjE_960.jpg 960w,https://web.dev/static/image/youtube/6aCsAMgwnjE_1440.jpg 1440w,https://web.dev/static/image/youtube/6aCsAMgwnjE_1920.jpg 1920w,https://web.dev/static/image/youtube/6aCsAMgwnjE_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="gui-challenges" data-text="GUI Challenges" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/gui-challenges"> GUI Challenges </a> </h3> <div class="devsite-landing-row-item-description-content"> There is no one way to solve interfaces challenges. In this series, we'll be challenging ourselves and each other to find multiple ways to solve interface challenges and expand the diversity of our skills. </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/http-203"> <picture> <img alt="" src="https://web.dev/static/image/youtube/Qf5wdXOxW3E.jpg" srcset="https://web.dev/static/image/youtube/Qf5wdXOxW3E_36.jpg 36w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_48.jpg 48w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_72.jpg 72w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_96.jpg 96w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_480.jpg 480w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_720.jpg 720w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_856.jpg 856w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_960.jpg 960w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_1440.jpg 1440w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_1920.jpg 1920w,https://web.dev/static/image/youtube/Qf5wdXOxW3E_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="http-203" data-text="HTTP 203" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/http-203"> HTTP 203 </a> </h3> <div class="devsite-landing-row-item-description-content"> Google Developers Jake Archibald and Surma discuss their philosophies about web development and the various aspects of it, meanwhile dropping in lifehacks, lessons and some honest truths. </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/mother-language-day"> <picture> <img alt="" src="https://web.dev/static/image/youtube/9LZRcNp9uxk.jpg" srcset="https://web.dev/static/image/youtube/9LZRcNp9uxk_36.jpg 36w,https://web.dev/static/image/youtube/9LZRcNp9uxk_48.jpg 48w,https://web.dev/static/image/youtube/9LZRcNp9uxk_72.jpg 72w,https://web.dev/static/image/youtube/9LZRcNp9uxk_96.jpg 96w,https://web.dev/static/image/youtube/9LZRcNp9uxk_480.jpg 480w,https://web.dev/static/image/youtube/9LZRcNp9uxk_720.jpg 720w,https://web.dev/static/image/youtube/9LZRcNp9uxk_856.jpg 856w,https://web.dev/static/image/youtube/9LZRcNp9uxk_960.jpg 960w,https://web.dev/static/image/youtube/9LZRcNp9uxk_1440.jpg 1440w,https://web.dev/static/image/youtube/9LZRcNp9uxk_1920.jpg 1920w,https://web.dev/static/image/youtube/9LZRcNp9uxk_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="mother-language-day" data-text="Mother Language Day" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/mother-language-day"> Mother Language Day </a> </h3> <div class="devsite-landing-row-item-description-content"> February 21st is International Mother Language Day! To celebrate, each week we’ll be releasing a new video hosted by one of our team members in their mother language. </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/web-dev-live-day-1"> <picture> <img alt="" src="https://web.dev/static/image/youtube/t8YBZLjL-KU.jpg" srcset="https://web.dev/static/image/youtube/t8YBZLjL-KU_36.jpg 36w,https://web.dev/static/image/youtube/t8YBZLjL-KU_48.jpg 48w,https://web.dev/static/image/youtube/t8YBZLjL-KU_72.jpg 72w,https://web.dev/static/image/youtube/t8YBZLjL-KU_96.jpg 96w,https://web.dev/static/image/youtube/t8YBZLjL-KU_480.jpg 480w,https://web.dev/static/image/youtube/t8YBZLjL-KU_720.jpg 720w,https://web.dev/static/image/youtube/t8YBZLjL-KU_856.jpg 856w,https://web.dev/static/image/youtube/t8YBZLjL-KU_960.jpg 960w,https://web.dev/static/image/youtube/t8YBZLjL-KU_1440.jpg 1440w,https://web.dev/static/image/youtube/t8YBZLjL-KU_1920.jpg 1920w,https://web.dev/static/image/youtube/t8YBZLjL-KU_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="webdev-live-day-1" data-text="web.dev LIVE Day 1" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/web-dev-live-day-1"> web.dev LIVE Day 1 </a> </h3> <div class="devsite-landing-row-item-description-content"> Missed web.dev LIVE? We've got you covered. Watch the talks from the web.dev LIVE 2020 event on Youtube </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/web-dev-live-day-2"> <picture> <img alt="" src="https://web.dev/static/image/youtube/uuKBqHDnJ2k.jpg" srcset="https://web.dev/static/image/youtube/uuKBqHDnJ2k_36.jpg 36w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_48.jpg 48w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_72.jpg 72w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_96.jpg 96w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_480.jpg 480w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_720.jpg 720w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_856.jpg 856w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_960.jpg 960w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_1440.jpg 1440w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_1920.jpg 1920w,https://web.dev/static/image/youtube/uuKBqHDnJ2k_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="webdev-live-day-2" data-text="web.dev LIVE Day 2" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/web-dev-live-day-2"> web.dev LIVE Day 2 </a> </h3> <div class="devsite-landing-row-item-description-content"> Missed web.dev LIVE? We've got you covered. Watch the talks from the web.dev LIVE 2020 event on Youtube </div> </div> </div> </div> <div class="devsite-landing-row-item" description-position="bottom" > <div class="devsite-landing-row-item-media "> <figure class="devsite-landing-row-item-image"> <a href="https://web.dev/shows/web-dev-live-day-3"> <picture> <img alt="" src="https://web.dev/static/image/youtube/ZXmKKV7R72c.jpg" srcset="https://web.dev/static/image/youtube/ZXmKKV7R72c_36.jpg 36w,https://web.dev/static/image/youtube/ZXmKKV7R72c_48.jpg 48w,https://web.dev/static/image/youtube/ZXmKKV7R72c_72.jpg 72w,https://web.dev/static/image/youtube/ZXmKKV7R72c_96.jpg 96w,https://web.dev/static/image/youtube/ZXmKKV7R72c_480.jpg 480w,https://web.dev/static/image/youtube/ZXmKKV7R72c_720.jpg 720w,https://web.dev/static/image/youtube/ZXmKKV7R72c_856.jpg 856w,https://web.dev/static/image/youtube/ZXmKKV7R72c_960.jpg 960w,https://web.dev/static/image/youtube/ZXmKKV7R72c_1440.jpg 1440w,https://web.dev/static/image/youtube/ZXmKKV7R72c_1920.jpg 1920w,https://web.dev/static/image/youtube/ZXmKKV7R72c_2880.jpg 2880w" sizes="(max-width: 840px) 50vw, 464px" loading="lazy" > </picture> </a> </figure> </div> <div class="devsite-landing-row-item-description" > <div class="devsite-landing-row-item-body"> <h3 id="webdev-live-day-3" data-text="web.dev LIVE Day 3" class="hide-from-toc no-link" tabindex="0"> <a href="https://web.dev/shows/web-dev-live-day-3"> web.dev LIVE Day 3 </a> </h3> <div class="devsite-landing-row-item-description-content"> Missed web.dev LIVE? We've got you covered. Watch the talks from the web.dev LIVE 2020 event on Youtube </div> </div> </div> </div> </div> </div> </section> </div> <div class="devsite-floating-action-buttons"> </div> </article> <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"]],[],[],[]] </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": "Shows", "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="cRMIoEHCnZXKLX5GVH5oOVKd4LhEHi"> (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/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web/js/app_loader.js', '[27,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web","https://web-dot-devsite-v2-prod-3p.appspot.com",1,null,["/_pwa/web/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/web/images/favicon.png","https://www.gstatic.com/devrel-devsite/prod/v38a693baeb774512feb42f10aac8f755d8791ed41119b5be7a531f8e16f8279f/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,["MiscFeatureFlags__enable_view_transitions","Profiles__enable_public_developer_profiles","MiscFeatureFlags__emergency_css","Experiments__reqs_query_experiments","CloudShell__cloud_shell_button","Search__enable_dynamic_content_confidential_banner","TpcFeatures__enable_mirror_tenant_redirects","Profiles__enable_release_notes_notifications","Profiles__enable_complete_playlist_endpoint","Search__enable_ai_eligibility_checks","Cloud__enable_llm_concierge_chat","EngEduTelemetry__enable_engedu_telemetry","Profiles__enable_completecodelab_endpoint","Cloud__enable_cloud_facet_chat","TpcFeatures__enable_unmirrored_page_left_nav","Cloud__enable_cloud_shell","Profiles__enable_join_program_group_endpoint","Profiles__enable_awarding_url","MiscFeatureFlags__enable_variable_operator","Cloud__enable_cloudx_experiment_ids","OnSwitch__enable","Search__enable_page_map","Cloud__enable_cloud_shell_fte_user_flow","Profiles__enable_page_saving","Profiles__enable_stripe_subscription_management","Profiles__enable_profile_collections","MiscFeatureFlags__developers_footer_image","MiscFeatureFlags__enable_firebase_utm","Cloud__enable_cloud_dlp_service","Analytics__enable_clearcut_logging","Profiles__enable_developer_profiles_callout","Cloud__enable_free_trial_server_call","Profiles__enable_completequiz_endpoint","Profiles__enable_dashboard_curated_recommendations","BookNav__enable_tenant_cache_key","Profiles__enable_recognition_badges","Cloud__enable_cloudx_ping","MiscFeatureFlags__enable_project_variables","MiscFeatureFlags__enable_explain_this_code","MiscFeatureFlags__developers_footer_dark_image","CloudShell__cloud_code_overflow_menu","Search__enable_suggestions_from_borg","Cloud__enable_legacy_calculator_redirect","Concierge__enable_pushui","DevPro__enable_cloud_innovators_plus","DevPro__enable_developer_subscriptions","Profiles__require_profile_eligibility_for_signin"],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],null,null,1]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>