Deploying AVIF for more responsive websites Stay organized with collections Save and categorize content based on your preferences. AVIF is a new image format that is quickly gaining popularity on the web because of its high compression rates, efficient performance, and broad adoption. AVIF is an open, royalty-free image format that is based on the AV1 video codec standardized by the Alliance for O

Baseline features you can use today Stay organized with collections Save and categorize content based on your preferences. The web is always evolving and browsers update constantly to give developers new tools to innovate on the platform. Things that previously required helper libraries become part of the web platform and supported on all browsers, along with shorter or easier ways to code design

Advancing Interaction to Next Paint Stay organized with collections Save and categorize content based on your preferences. INP is no longer experimental. Learn about Chrome's plan to make it a Core Web Vital in 2024. Chrome's mission with the Web Vitals program is to help developers focus on the metrics that are essential to great user experiences—the Core Web Vitals. One important aspect of the u

Introducing Baseline Stay organized with collections Save and categorize content based on your preferences. At Google I/O 2023 we announced Baseline, learn more about this initiative and why we think it's important. Baseline helps you to see, at a glance, whether a feature or API is safe to use in your site or web applications. In this post, learn about the ideas that led to this concept, and how

Economic Times quest for fixing INP Stay organized with collections Save and categorize content based on your preferences. Bringing down TBT by 30 times and migrating to Next.js helped The Ecomonic Times reduce INP nearly four times, leading to a 50% decrease in bounce rate and 43% uplift in pageviews. Interaction to Next Paint (INP) is a metric that assesses a website's responsiveness to user inp

Client-side rendering of HTML and interactivity Stay organized with collections Save and categorize content based on your preferences. Rendering HTML with JavaScript is different than rendering HTML that's sent by the server—and that can affect performance. Learn the difference in this guide, and what you can do to preserve your website's rendering performance—especially where interactions are con

Manually diagnose slow interactions in the lab Stay organized with collections Save and categorize content based on your preferences. Learn how to take your field data into the lab to reproduce and identify the causes behind slow interactions through manual testing. A challenging part of optimizing Interaction to Next Paint (INP) is figuring out what's causing poor INP. There's a lot of potential

Find slow interactions in the field Stay organized with collections Save and categorize content based on your preferences. Learn how to find slow interactions in your website's field data so you can find opportunities to improve its Interaction to Next Paint. Field data is data that tells you how actual users are experiencing your website. It teases out issues you can't find in lab data alone. Whe

Optimize input delay Stay organized with collections Save and categorize content based on your preferences. Find out what input delay is, and learn techniques to reduce it for faster interactivity. Interactions on the web are complicated things, with all sorts of activity occurring in the browser to drive them. What they all have in common, though, is that they incur some input delay before their

When it comes to optimizing Interaction to Next Paint (INP), most of the advice you'll encounter is to optimize interactions themselves. For example, in the optimize long tasks guide, techniques such as yielding with setTimeout, isInputPending, and so forth are discussed. These techniques are beneficial, as they allow the main thread some breathing room by avoiding long tasks, which can allow more

Using the Web Vitals extension to debug Core Web Vitals issues Stay organized with collections Save and categorize content based on your preferences. The Web Vitals extension now shows you more debugging information to help you identify the root causes of Core Web Vitals issues. The Web Vitals extension provides easy access to Core Web Vitals diagnostic information to help developers measure, and

The origin private file system Stay organized with collections Save and categorize content based on your preferences. The File System Standard introduces an origin private file system (OPFS) as a storage endpoint private to the origin of the page and not visible to the user that provides optional access to a special kind of file that is highly optimized for performance. Browser support The origin

New to the web platform in March Stay organized with collections Save and categorize content based on your preferences. Discover some of the interesting features that landed in stable and beta web browsers during March 2023. Stable browser releases In March 2023, Firefox 111, Chrome 111, and Safari 16.4 became stable. Let's take a look at what this means for the web platform. Global HTML attribute

What are source maps? Stay organized with collections Save and categorize content based on your preferences. Source maps are a crucial tool in modern web development that make debugging significantly easier. This page explores the basics of source maps, how they're generated, and how they improve the debugging experience. The need for source maps Early web apps were built with low complexity. Deve