# Core Web Vitals Published articles for Core Web Vitals. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## Digital Experience Monitoring with Grafana Cloud: Session Replay, synthetic checks, and faster investigations DevFeed: [Digital Experience Monitoring with Grafana Cloud: Session Replay, synthetic checks, and faster investigations]() Original publisher: [Read original article]() Author: Bukola Ayodele Published: 2026-09-15T01:35:30.954353Z Content type: article Language: en Sources: [Grafana Labs blog on Grafana Labs]() Topics: [digital experience monitoring](), [Grafana Cloud](), [Frontend observability](), [synthetic monitoring](), [real user monitoring](), [session replay](), [Instrumentation](), [web applications](), [JavaScript](), [Core Web Vitals](), [Traces]() Tags: [analytics](), [core-web-vitals](), [digital-experience-monitoring](), [frontend-observability](), [grafana](), [grafana-cloud](), [grafana-cloud-frontend-observability](), [instrumentation](), [javascript](), [logs](), [metrics](), [monitoring](), [observability](), [real-user-monitoring](), [session-replay](), [synthetic](), [synthetic-monitoring](), [traces](), [web-applications]() ### AI overview This article explains how Digital Experience Monitoring in Grafana Cloud combines Frontend Observability, Synthetic Monitoring, real user monitoring, and session replay. It shows how these capabilities help engineering teams detect issues proactively, understand their scope and root causes, correlate frontend signals with backend traces, and resolve production problems faster. ### Source excerpt When something breaks in production, the questions that matter most are also the toughest to answer from metrics alone: who was affected, what did they actually see, and is this worth waking someone up for? Answering those questions requires a fuller picture of the issue and its impact on your users. That's where Digital Experience Monitoring (DEM) in Grafana Cloud comes in. By combining Frontend Observability and Synthetic Monitoring, DEM connects real user experiences with proactive testing, helping engineering teams understand the scope of an issue, investigate its cause, and resolve it faster, all within Grafana Cloud. In this blog post, we'll walk through some of the latest DEM updates in Grafana Cloud, and how to get started. You can also learn more by watching the video below. First, what is Digital Experience Monitoring? Digital Experience Monitoring in Grafana Cloud gives you a complete picture of how users experience your web applications, from real user data to proactive synthetic checks. DEM helps your team achieve: Real user visibility: know how users truly experience your web application, not just what your backend metrics suggest. Proactive detection: catch problems before your users do, using automated checks against your critical user journeys. End-to-end correlation: connect a frontend signal to the backend trace behind it. Faster resolution: cut your mean time to recovery from hours to minutes. Session Replay: see exactly what your users saw Session Replay in Grafana Cloud Frontend Observability lets you visually replay what a user saw and did inside your web application. Your team can watch exactly what users experienced and correlate it with real user monitoring signals like Core Web Vitals, user actions, and traces, which makes it a powerful tool for investigating bugs and running root cause analysis. Session Replay is powered by Faro, Grafana's open source JavaScript instrumentation library for collecting real user monitoring data. Let's walk ## How to measure ROI for an enterprise CMS migration DevFeed: [How to measure ROI for an enterprise CMS migration]() Original publisher: [Read original article]() Author: Webflow Team Published: 2026-08-07T00:00:00Z Content type: article Language: en Sources: [Webflow Blog]() Topics: [Content Management System](), [migration](), [workflow automation](), [Web](), [code productivity]() Tags: [analysis](), [article](), [automation](), [business](), [content](), [core-web-vitals](), [developer](), [development](), [efficiency](), [enterprise](), [how-to](), [metrics](), [migration](), [platform](), [productivity](), [strategy](), [tools](), [web](), [workflow](), [workflow-automation]() ### AI overview This article explains how enterprises can measure the return on investment of migrating to a modern content management system. It covers migration costs, expected gains, baseline metrics, operational efficiency, development costs, website performance, and developer productivity. ### Source excerpt Find out how to measure the ROI for your enterprise's CMS migration. Learn about the timeline you can expect and the improvements your team might see. ## The 2-Second Rule: How to make your website feel like magic in 2026 DevFeed: [The 2-Second Rule: How to make your website feel like magic in 2026]() Original publisher: [Read original article]() Author: Louise North Published: 2026-08-04T11:43:00Z Content type: article Language: en Sources: [Web Designer Depot]() Topics: [Web](), [Latency](), [browser](), [Workers](), [Compression](), [Artificial Intelligence](), [Edge]() Tags: [architecture](), [avif-images](), [browser](), [compression](), [core-web-vitals](), [developers](), [digital-hospitality](), [edge](), [edge-computing](), [frontend-development](), [guide](), [http3](), [inclusive-design](), [interaction-to-next-paint](), [javascript-optimization](), [mobile-optimization](), [page-speed-optimization](), [performance](), [predictive-ai](), [site-reliability](), [speed](), [technical-seo](), [user-experience](), [ux-design-2026](), [web-development](), [web-development-trends](), [web-performance](), [website-usability](), [workers](), [zero-latency-ux]() ### AI overview A guide to making websites feel faster and more responsive by focusing on interaction performance, Web Workers, AVIF images, and responsive image delivery. It presents speed as an important part of user experience in 2026. ### Source excerpt In 2026, a "pretty" website is no longer enough--if it doesn't feel instant, it's invisible. This guide reveals how the world's top developers are using predictive AI and "Edge" architecture to kill the loading bar for good. ## Web Analytics and Speed Insights are now more cost-efficient DevFeed: [Web Analytics and Speed Insights are now more cost-efficient]() Original publisher: [Read original article]() Author: Chris Widmaier Published: 2026-07-13T00:00:00Z Content type: release Language: en Sources: [Vercel News]() Topics: [Web](), [Core Web Vitals]() Tags: [analytics](), [core-web-vitals](), [infrastructure](), [speed](), [web]() ### AI overview Vercel has made Web Analytics and Speed Insights almost 10% more cost-efficient for Pro and Enterprise teams. Infrastructure and event-processing improvements reduce processing costs for page views, referrers, top routes, and Core Web Vitals, with greater savings at higher event volumes. ### Source excerpt Web Analytics and Speed Insights are now almost 10% more cost-efficient for all Pro and Enterprise teams. Infrastructure and event-processing improvements reduced cost across both products, so page views, referrers, top routes, and Core Web Vitals are now processed more efficiently, and savings scale with your event volume. The change applies automatically, with no configuration, plan changes, or code to update. You'll see the change reflected on your next bill. Learn more in the Web Analytics and Speed Insights documentation. Read more ## How to improve website performance: Best practices for faster sites DevFeed: [How to improve website performance: Best practices for faster sites]() Original publisher: [Read original article]() Author: Webflow Team Published: 2026-07-10T00:00:00Z Content type: tutorial Language: en Sources: [Webflow Blog]() Topics: [Web](), [User experience (UX)](), [Optimization](), [Caching](), [Compression](), [Search engine optimization (SEO)](), [Google]() Tags: [best-practices](), [browser](), [caching](), [code](), [compression](), [conversion](), [core-web-vitals](), [development](), [ecommerce](), [how-to](), [optimization](), [performance](), [seo](), [ux](), [web]() ### AI overview This article explains why website performance matters for user experience, customer satisfaction, bounce rates, conversions, and search rankings. It introduces performance metrics and seven optimization methods, including code minification, browser caching, and compression, while also covering common mistakes. ### Source excerpt Learn why a fast-loading website is so crucial for UX, and pick up seven common strategies for improving website performance as you grow your site. ## Query Speed Insights from the Vercel CLI DevFeed: [Query Speed Insights from the Vercel CLI]() Original publisher: [Read original article]() Author: Ergün Erdoğmuş Published: 2026-06-29T08:00:00Z Content type: release Language: en Sources: [Vercel News]() Topics: [Vercel](), [Command-line interface](), [Core Web Vitals](), [benchmarking](), [Web]() Tags: [cli](), [core-web-vitals](), [insights](), [measurements](), [metrics](), [performance](), [performance-metrics](), [vercel](), [web]() ### AI overview Vercel CLI can now query Speed Insights datapoints, including Core Web Vitals and other page performance metrics collected from real user traffic. The feature supports investigating regressions and comparing performance across pages, regions, and device types. ### Source excerpt You can now query Speed Insights datapoints directly through the Vercel CLI. Using the vercel metrics command, you can pull core Web Vitals (LCP, INP, CLS) and other page performance metrics (FCP, TTFB) based on client-side measurements from real user traffic. By providing a coding agent access to the CLI, an agent can answer questions such as: Which pages' INP have regressed since last week? How is the perceived speed of my home page in Asia? Compare the CLS of the dashboard between mobile and desktop. For more details on how to use the CLI command and a complete list of supported metrics, dimensions, filters, and query options, explore the documentation. Read more ## Bringing Lighthouse to the App: Building Performance Metrics for React Native DevFeed: [Bringing Lighthouse to the App: Building Performance Metrics for React Native]() Original publisher: [Read original article]() Author: Ben Cripps Published: 2026-03-03T19:13:53Z Content type: article Language: en Sources: [Indeed]() Topics: [React Native](), [Mobile](), [benchmarking](), [Core Web Vitals](), [Google]() Tags: [app-performance](), [core-web-vitals](), [google](), [metrics](), [mobile](), [performance](), [react-native](), [time-to-interactive](), [unsorted]() ### AI overview Indeed describes an open-source React Native repository for measuring Lighthouse-style performance metrics in mobile apps. The article explains adapting Core Web Vitals concepts to React Native, including Time to First Frame and Time to Interactive, to assess screen loading and interaction readiness. ### Source excerpt At Indeed we've open sourced a new React Native repository which makes it simple to measure Lighthouse scores in your mobile apps. We think it will help other organizations better measure their app performance, especially for companies similar to Indeed who are transitioning from a web-first to an app-first approach. You can check out the [...] ## Next.js 16.1 DevFeed: [Next.js 16.1]() Original publisher: [Read original article]() Author: Tim Neutkens Published: 2025-12-18T20:00:00Z Content type: release Language: en Sources: [Next.js Blog]() Topics: [Next.js](), [Caching](), [Tooling](), [debugging](), [Node.js](), [Core Web Vitals]() Tags: [caching](), [core](), [core-web-vitals](), [debugging](), [development](), [dogfooding](), [github](), [next-js](), [node](), [node-js]() ### AI overview Next.js 16.1 improves development workflows and stability through stable, default-on Turbopack file system caching, an experimental bundle analyzer, easier Node.js debugging, and better handling of transitive external dependencies. ### Source excerpt Next.js 16.1 introduces Turbopack file system caching for development, a new bundle analyzer, and easier debugging in Node.js. ## The Performance Inequality Gap, 2026 DevFeed: [The Performance Inequality Gap, 2026]() Original publisher: [Read original article]() Author: Alex Russell Published: 2025-11-24T00:00:00Z Content type: opinion Language: en Sources: [Alex Russell]() Topics: [Web Development](), [JavaScript](), [Front end](), [Core Web Vitals](), [Mobile](), [Network](), [TLS (Transport Layer Security)]() Tags: [2026](), [core-web-vitals](), [cpu](), [devices](), [doom](), [frontend](), [javascript](), [mobile](), [network](), [performance](), [tls](), [webdev]() ### AI overview This article updates network and device assumptions for 2026 and derives resource budgets for three- and five-second page loads. It argues that growing page sizes and JavaScript payloads worsen performance inequality, while noting that fewer than half of mobile origins pass Core Web Vitals. ### Source excerpt The Budget, 2026 Edition Let's cut to the chase, shall we? Updated network test parameters for 2026 are: 9 Mbps downlink 3 mbps uplink 100 millisecond RTT Regarding devices, my updated recommendations are the Samsung Galaxy A24 4G (or equivalent) and the HP 14. The goal of these recommendations is to emulate a 75th percentile user experience, meaning a full quarter of devices and networks will perform worse than this baseline. Plugging these parameters into the updated budget calculator, we can derive critical-path resource thresholds for three and five second page load targets. Per usual, we consider pages built in two styles: JS-light, where only 15% of critical-path bytes are JavaScript, and JS-heavy, comprised of 50% JavaScript: Time JS-light (MiB) JS-heavy Total JS Other Total JS Other 3 sec 2.0 0.3 1.7 1.2 0.62 0.62 5 sec 3.7 0.57 3.2 2.3 1.15 1.15 Note: Budgets account for two TLS connections. Many sites initiate more early connections, reducing time available to download resources. Using four connections cuts the three-second budget by 350 KiB, to 1.5 MiB / 935 KiB. The five-second budget loses nearly half a megabyte, dropping to 3.2 / 1.9 MiB. It pays to adopt H/2 or H/3 and consolidate connections. These budgets are extremely generous. Even the target of three seconds is lavish; most sites should be able to put up interactive content much sooner for nearly all users. Meanwhile, sites are ballooning. The median mobile page is now 2.6 MiB, blowing past the size of DOOM (2.48 MiB) in April. The 75th percentile site is now larger than two copies of DOOM. P90+ sites are more than 4.5x larger, and sizes at each point have doubled over the past decade. Put another way, the median mobile page is now 70 times larger than the total storage of the computer that landed men on the moon. Median page weights are more than 2.5x larger for mobile sites than a decade ago, and sites at the 75th percentile are now 4x their 2015 weight. An outsized contributor to this bloat co ## 40% Faster Interaction: How Wix Solved React's Hydration Problem with Selective Hydration and Suspense DevFeed: [40% Faster Interaction: How Wix Solved React's Hydration Problem with Selective Hydration and Suspense]() Original publisher: [Read original article]() Author: Wix Engineering Published: 2025-11-09T12:58:45Z Content type: tutorial Language: en Sources: [Wix Engineering]() Topics: [React](), [Server-side rendering](), [Core Web Vitals]() Tags: [cdn](), [core-web-vitals](), [javascript](), [mobile](), [performance](), [react](), [ssr]() ### AI overview This Wix engineering article explains how React hydration can delay interactivity in server-rendered sites, particularly on mobile devices and slow networks. It introduces Selective Hydration, enabled by React 18's Suspense API, as an approach to preserve SSR benefits while improving interaction performance. ### Source excerpt Introduction For years, one of React's most persistent performance pain points has been hydration. At Wix, where we render hundreds of millions of websites using React and SSR, we've experienced this problem at scale. SSR initially gave us everything we wanted - instant paint, great SEO, and full-site CDN caching. Our pages loaded faster than ever. But as sites grew richer and heavier with content, hydration became a tax we could no longer ignore. The more components a page had, the longer it... ## BV Hosted Display - The New Baseline for CWV metrics DevFeed: [BV Hosted Display - The New Baseline for CWV metrics]() Original publisher: [Read original article]() Author: Veda Published: 2025-09-23T07:51:42Z Content type: tutorial Language: en Sources: [Bazaarvoice]() Topics: [benchmarking](), [Core Web Vitals](), [performance-optimization](), [Web](), [Mobile](), [cpu](), [Android](), [iOS](), [5G](), [iphone]() Tags: [5g](), [android](), [bazaarvoice](), [benchmarking](), [benchmarkingstrategy](), [core-web-vitals](), [corewebvitals](), [cpu](), [cwv](), [engineering](), [ios](), [iphone](), [lcp](), [lighthouse](), [mobile](), [mobilefirst](), [mobileperformance](), [pagespeed](), [performance](), [performance-optimization](), [performanceoptimization](), [seo](), [userexperience](), [ux](), [web-performance](), [webperformance]() ### AI overview This article argues that the throttled Moto G4 baseline traditionally used for Core Web Vitals no longer accurately represents many e-commerce users. It proposes a data-driven benchmarking strategy based on actual customer devices, operating systems, hardware, and network conditions. ### Source excerpt The Old Way vs. The Reality of Your Customers For years, the gold standard for benchmarking web performance, particularly for Google's Core Web Vitals (CWV), has been a mobile device baseline--specifically, a throttled connection and CPU designed to simulate a Moto G4. This approach was established with good intentions: to ensure websites are accessible to [...] ## Apollo Client 4.0 Release Adds Smaller Bundles, Improved TypeScript Support, and Developer Experience DevFeed: [Apollo Client 4.0 Release Adds Smaller Bundles, Improved TypeScript Support, and Developer Experience]() Original publisher: [Read original article]() Author: Jerel Miller Published: 2025-09-03T08:00:11Z Content type: release Language: en Sources: [Apollo Blog]() Topics: [GraphQL](), [Developer experience](), [TypeScript](), [JavaScript](), [Core Web Vitals]() Tags: [announcement](), [apollo](), [apollo-client](), [core-web-vitals](), [developer-experience](), [graphql](), [improvements](), [javascript](), [performance](), [release](), [typescript]() ### AI overview Apollo Client 4.0 is a milestone release focused on smaller bundles, improved TypeScript support, and developer experience. It makes local state management and other features opt-in, targets modern browsers and Node.js 20+, and adds ESM and tree-shaking improvements. ### Source excerpt We're thrilled to announce Apollo Client 4.0, a milestone release that delivers significant improvements in bundle size, TypeScript support, and developer experience. After extensive community feedback and months of iteration through release candidates, version 4.0 represents our most refined and performant Apollo Client yet. The JavaScript ecosystem has evolved dramatically since Apollo Client 3.0's release. ## Astro 5.7 DevFeed: [Astro 5.7]() Original publisher: [Read original article]() Author: Matt Kane; Florian Lefebvre; Emanuele Stoppa; Nate Moore Published: 2025-04-15T00:00:00Z Content type: release Language: en Sources: [The Astro Blog]() Topics: [Astro](), [API](), [Font](), [SVG](), [Core Web Vitals]() Tags: [api](), [astro](), [components](), [core-web-vitals](), [experimental](), [fonts](), [google](), [performance](), [shopping](), [state](), [svg](), [web-apis]() ### AI overview Astro 5.7 introduces stable Sessions and SVG components, plus an experimental Fonts API. The Fonts API supports local fonts and built-in providers with automatic optimizations, while Sessions securely store server-side user data across Astro features. ### Source excerpt Astro 5.7 has a basketload of treats, including stable Sessions and SVG components and a new Experimental Fonts API. ## Fix your website's Largest Contentful Paint by optimizing image loading DevFeed: [Fix your website's Largest Contentful Paint by optimizing image loading]() Original publisher: [Read original article]() Author: debugbear Published: 2025-01-13T00:00:00Z Content type: tutorial Language: en Sources: [MDN Blog]() Topics: [Core Web Vitals](), [Website](), [Image](), [Optimization](), [HTML](), [Performance Testing](), [real user monitoring](), [Network](), [browser](), [JavaScript](), [CSS]() Tags: [article](), [browser](), [core-web-vitals](), [css](), [how-to](), [html](), [javascript](), [network](), [optimization](), [performance](), [performance-testing](), [user-experience](), [web]() ### AI overview This tutorial explains how image loading affects Largest Contentful Paint and Core Web Vitals. It covers image discovery through HTML, CSS, and JavaScript, request chains, network waterfalls, browser image-processing stages, and techniques for diagnosing and improving loading performance. ### Source excerpt Learn techniques to improve the Largest Contentful Paint metric, a part of Core Web Vitals, for your website. ## Announcing Inertia 2.0: Redefining Frontend Development for Laravel DevFeed: [Announcing Inertia 2.0: Redefining Frontend Development for Laravel]() Original publisher: [Read original article]() Author: Joe Tannenbaum Published: 2024-12-13T19:28:00Z Content type: release Language: en Sources: [Laravel Blog]() Topics: [Laravel](), [frontend development](), [Front end](), [Single-page application (SPA)](), [React](), [Svelte](), [Vue.js](), [Object-relational mapping](), [Routing (disambiguation)](), [Core Web Vitals]() Tags: [async](), [core-web-vitals](), [deferred](), [frontend-development](), [laravel](), [lazy-loading](), [orm](), [performance](), [react](), [release](), [routing](), [svelte](), [vue]() ### AI overview Inertia 2.0 is a stable release that adds asynchronous requests, deferred props, prefetching, and polling to Laravel frontend development. These features support more responsive applications while avoiding the complexity of maintaining a separate API. ### Source excerpt Inertia 2.0 brings powerful new features to Laravel frontend development including async requests, deferred props, prefetching, and polling. Learn how these improvements help you build faster, more responsive applications without the complexity of maintaining a separate API. ## Introducing Nuxt Scripts DevFeed: [Introducing Nuxt Scripts]() Original publisher: [Read original article]() Published: 2024-08-20T00:00:00Z Content type: article Language: en Sources: [The Nuxt Blog]() Topics: [Nuxt.js](), [Developer experience](), [Core Web Vitals](), [Security](), [Server-side rendering](), [Web]() Tags: [core-web-vitals](), [developer](), [developer-experience](), [interaction-to-next-paint](), [main-thread](), [nuxt](), [performance](), [privacy](), [release](), [security](), [ssr](), [third-party](), [vue](), [web]() ### AI overview Nuxt Scripts enters public beta as a Nuxt module for managing and optimizing third-party scripts. Developed with Google's Chrome Aurora team, it aims to improve performance, privacy, security, and developer experience while addressing script loading, SSR safety, hydration, and Core Web Vitals issues. ### Source excerpt Nuxt Scripts provides better performance, privacy, security, and developer experience for third-party scripts. ## BenefitsCal's Performance Problems Compared with getcalfresh.org DevFeed: [BenefitsCal's Performance Problems Compared with getcalfresh.org]() Original publisher: [Read original article]() Author: Alex Russell Published: 2024-08-13T00:00:00Z Content type: article Language: en Sources: [Alex Russell]() Topics: [Web Development](), [Core Web Vitals](), [JavaScript](), [Latency](), [Chromium](), [Compression](), [Caching](), [configuration]() Tags: [caching](), [compression](), [configuration](), [core-web-vitals](), [javascript](), [latency](), [performance](), [web](), [webdev]() ### AI overview The article compares California's BenefitsCal public benefits portal with Code for America's getcalfresh.org. It argues that BenefitsCal delivers a substantially slower experience, with excessive JavaScript, multiple loading screens, and configuration problems, while getcalfresh.org uses a simpler HTML-first architecture and becomes interactive sooner. ### Source excerpt Other posts in the series: Reckoning: Part 1 -- The Landscape Reckoning: Part 3 -- Caprock Reckoning: Part 4 -- The Way Out Contents The Golden Wait The Truth Is In The Trace Zip It Near Peers Blimey JavaScript Masshattery Maryland Enters The Chat Chattanooga Chug Chug SNAP? In Jersey? Fuhgeddaboudit Hoosier Hospitality Deep Breaths The Golden Wait BenefitsCal is the state of California's recently developed portal for families that need to access SNAP benefits (née "food stamps"):1 BenefitsCal loading on a low-end device over a 9Mbps link with 170ms RTT latency via WebPageTest.org Code for America's getcalfresh.org performs substantially the same function, providing a cleaner, faster, and easier-to-use alternative to California county and state benefits applications systems: getcalfresh.org loading under the same conditions The like-for-like, same-state comparison getcalfresh.org provides is unique. Few public sector services in the US have competing interfaces, and only Code for America was motivated to build one for SNAP applications. getcalfresh.org finishes in 1/3 the time, becoming interactive not long after the BenefitsCal loading screen appears. WebPageTest.org timelines document a painful progression. Users can begin to interact with getcalfresh.org before the first (of three) BenefitsCal loading screens finish (scroll right to advance): & & Google's Core Web Vitals data backs up test bench assessments. Real-world users are having a challenging time accessing the site: BenefitsCal is a poor experience on real phones. But wait! There's more. It's even worse than it looks. The multi-loading-screen structure of BenefitsCal fakes out Chrome's heuristic for when to record Largest Contentful Paint. On low-end devices, BenefitsCal appears to almost load at the 22 second mark, only to put up a second loading screen shortly after. Because this takes so long, Chromium's heuristics for Largest Contentful Paint are thrown off, incorrectly reporting the end of the first loa ## Introducing Argonaut: Part Seven. DevFeed: [Introducing Argonaut: Part Seven.]() Original publisher: [Read original article]() Author: Grant Sheppard Published: 2024-07-11T02:08:10Z Content type: opinion Language: en Sources: [REA Group]() Topics: [Web Development](), [Front end](), [Web](), [Monitoring](), [Accessibility]() Tags: [accessibility](), [cli](), [core-web-vitals](), [development](), [frontend](), [micro-frontends](), [monitoring](), [platform](), [tech]() ### AI overview The seventh article in REA's Argonaut series discusses the future of its micro-frontend platform. It describes plans to reduce operational overhead through standardized monitoring and dependency updates, simplify platform-wide changes, and extend the platform CLI with performance and accessibility checks. ### Source excerpt Introducing Argonaut: Part Seven. Authors: Grant Sheppard and Tim Watts The previous post reflected on the past, talking about what worked and what did not whilst building Argonaut, the micro-frontend platform at REA. Valuable lessons have been learnt and applied to the platform, allowing its architecture to be extended to support the needs of web teams across REA. But what does the future hold, and will the journey so far help influence the direction of Argonaut? ## Server Islands DevFeed: [Server Islands]() Original publisher: [Read original article]() Author: Fred Schott; Matthew Phillips Published: 2024-06-13T00:00:00Z Content type: article Language: en Sources: [The Astro Blog]() Topics: [Astro](), [Front end](), [personalization](), [Caching](), [Core Web Vitals](), [Vercel]() Tags: [astro](), [cache](), [cdn](), [core-web-vitals](), [frontend](), [personalization](), [vercel]() ### AI overview Astro is exploring Server Islands, an architecture primitive that combines static, CDN-cached HTML page shells with dynamically rendered content. This approach aims to preserve the performance and simplicity of static pages while enabling personalization through deferred server-side rendering. ### Source excerpt Part three of our series on The Future of Astro, covering a new island architecture pattern for dynamic content rendered inside of fast, CDN-cached static pages. ## Fixing Cumulative Layout Shift Problems on DavidWalshBlog DevFeed: [Fixing Cumulative Layout Shift Problems on DavidWalshBlog]() Original publisher: [Read original article]() Author: Todd Gardner Published: 2024-01-24T11:56:41Z Content type: tutorial Language: en Sources: [David Walsh]() Topics: [Core Web Vitals](), [Web Development](), [real user monitoring](), [User Experience](), [Google]() Tags: [core-web-vitals](), [javascript](), [lighthouse](), [metrics](), [optimization](), [optimization-performance](), [performance](), [real-user-monitoring]() ### AI overview This tutorial investigates poor Cumulative Layout Shift performance on DavidWalshBlog. It explains CLS as a Core Web Vital, contrasts Google Lighthouse testing with real-user performance data, and uses Request Metrics to identify affected pages and shifting elements. ### Source excerpt Over 50 thousand developers visit DavidWalshBlog every month from around the world to learn JavaScript tricks and fix problems in their code. Unfortunately, some of them have a slow experience on the site. David tracks the performance of his Core Web Vitals and overall performance with Request Metrics. Recently, we noticed that his CLS performance [...] The post Fixing Cumulative Layout Shift Problems on DavidWalshBlog appeared first on David Walsh Blog. ## Accelerating theblueground.com: Five Core Web Vitals improvements DevFeed: [Accelerating theblueground.com: Five Core Web Vitals improvements]() Original publisher: [Read original article]() Author: Dimitris Zotos Published: 2023-12-22T10:10:37Z Content type: article Language: en Sources: [Blueground Engineering blog]() Topics: [Core Web Vitals](), [Optimization](), [User Experience](), [Google Search](), [Mobile](), [Web]() Tags: [core-web-vitals](), [google-search](), [interaction-to-next-paint](), [mobile](), [optimization](), [performance](), [seo](), [user-experience](), [web]() ### AI overview A Blueground case study describes efforts to improve theblueground.com's Core Web Vitals, focusing on website loading performance and Largest Contentful Paint. The article explains the roles of LCP, FID, and CLS, notes Google's planned replacement of FID with Interaction to Next Paint, and reports an initial mobile LCP of 2.7-3 seconds alongside low impressions in Google Search Console. ### Source excerpt In the realm of modern hospitality, Blueground stands out by providing fully furnished apartments that redefine travel. However, beyond the sophistication of our spaces, a pivotal factor comes into play -- our website's load speed performance. Serving thousands of daily users requires a digital experience that matches the ## How Core Web Vitals saved users 10,000 years of waiting for web pages to load DevFeed: [How Core Web Vitals saved users 10,000 years of waiting for web pages to load]() Original publisher: [Read original article]() Author: Chromium Blog (noreply@blogger.com) Published: 2023-11-07T17:03:00Z Content type: article Language: en Sources: [Chromium Blog]() Topics: [Core Web Vitals](), [Chrome](), [Web](), [Google](), [User Experience](), [Google Search]() Tags: [chrome](), [core-web-vitals](), [ecosystem](), [google](), [google-search](), [performance](), [the-fast-and-the-curious](), [user-experience](), [web](), [web-performance]() ### AI overview This article explains how Core Web Vitals helped improve web performance for Chrome users on desktop and Android, reportedly saving more than 10,000 years of page-loading time in 2023. It describes how shared metrics, developer guidance, and collaboration across Chrome, Search, and the web ecosystem contributed to faster, more responsive pages. ### Source excerpt Today's The Fast and the Curious post explores how Core Web Vitals saved Chrome users more than 10,000 Years of waiting for web pages to load in 2023 (across Chrome desktop and Android) by quantifying the experience of sites and identifying opportunities to make improvements. In 2020, we introduced Web Vitals - essential quality signals for webpages to ensure a better user experience. Since then, there has been a massive leap in web performance made possible by our work on Core Web Vitals (CWV) and its broader impact on the web. Today, over 40% of sites pass all of the CWV metrics, leading to pages that load and respond to interactions more quickly. Here's a closer look at the journey to help improve the performance for sites and some specific work done in the browser and the ecosystem to enable this achievement. Chrome's Quest for Speed The very essence of the web lies in its ability to provide information and services efficiently and rapidly. This principle is at the heart of Google's business and drives our work on Chrome. However, we noticed an issue with sites over a long time horizon. Even if slow sites improved their performance for a while, it would often decline over time. No matter how fast Google Search might be, the user experience would be subpar if the pages found were slow to load. We could not help these sites improve their performance directly, but we wanted users to have a great experience when they moved from Google Search to the individual sites. To tackle the challenge of improving the user experience while simultaneously providing unified guidance to developers, teams from Search and Chrome collaborated to address the issue of slow web pages. Defining the Fast Web We examined millions of pages to define a public standard for a fast, user-friendly web page (initially published in The Science Behind Web Vitals). We published our specifications and data to the open ecosystem and took note of the feedback we received. The introduction of CWV metric ## 2023 Web Framework Performance Report DevFeed: [2023 Web Framework Performance Report]() Original publisher: [Read original article]() Author: Fred Schott Published: 2023-03-07T00:00:00Z Content type: article Language: en Sources: [The Astro Blog]() Topics: [Frameworks](), [Core Web Vitals](), [Web](), [data](), [Astro](), [gatsby](), [Next.js](), [Nuxt.js](), [Remix](), [WordPress]() Tags: [astro](), [core-web-vitals](), [framework](), [measurement](), [measurements](), [next-js](), [nuxt](), [performance](), [remix](), [report](), [web]() ### AI overview This report examines how Astro, Gatsby, Next.js, Nuxt, Remix, SvelteKit, and, where possible, WordPress relate to real-world web performance and user experience in 2023. It uses publicly available data from the Chrome User Experience Report, HTTP Archive, and Core Web Vitals Technology Report, rather than performance measurements collected directly by Astro. ### Source excerpt A look at how different web frameworks perform in the real world in 2023. Based on real-world, production data from HTTP Archive and Google Chrome. ## My Challenge to the Web Performance Community DevFeed: [My Challenge to the Web Performance Community]() Original publisher: [Read original article]() Published: 2021-10-06T07:18:38Z Content type: opinion Language: en Sources: [Philip Walton]() Topics: [performance-optimization](), [Core Web Vitals](), [real user monitoring](), [Chrome](), [User Experience](), [Website]() Tags: [chrome](), [core-web-vitals](), [performance](), [performance-optimization](), [synthetic](), [user-experience](), [web-performance]() ### AI overview The article argues that web performance optimization should focus on users' real-world experience rather than solely on synthetic tool scores. It explains that Lighthouse is useful for testing and optimization but does not guarantee good field performance: research found that almost half of pages scoring 100 on Lighthouse failed to meet recommended Core Web Vitals thresholds, while some pages with poor Lighthouse scores met those thresholds. ### Source excerpt Performance optimization should be about making your users happy, not about making your tools happy. And if we really believe that, we should lead by example. [Next page]()