Field Data vs Lab Data: Why Lighthouse Says 100 and Search Console Disagrees
- By vuetelemetry

Lighthouse names the audit and lists the files. It does not explain that a script with neither attribute stops the parser dead, that async still blocks rendering when it executes, and that CSS blocks for a different reason entirely.
Lighthouse names the audit and lists the files. It does not explain that a script with neither attribute stops the parser dead, that async still blocks rendering when it executes, and that CSS blocks for a different reason entirely.
A perfect Lighthouse score sitting next to a failing Core Web Vitals assessment is not a bug in either tool. They measure two different things, and only one of them is what Google reports.
Speed Index is the only one of the five Lighthouse performance metrics that measures a curve rather than an instant. That is why a page can post a good LCP and still score badly here, and why the fix is different.
TBT carries 30 percent of the Lighthouse performance score, more than any other metric, and it is not a Core Web Vital. What it counts, why only the part of a task above 50 ms is measured, and why splitting your JavaScript beats shrinking it.
First Contentful Paint measures how long a visitor stares at nothing. What FCP counts as content, the good, needs-improvement and poor thresholds, why it is a diagnostic metric rather than a Core Web Vital, and the three things that actually delay it.
Nuxt 3 stopped receiving security updates on 31 July 2026. What end of life means in practice, why the date was already pushed back once, the official upgrade command, and the codemods that do part of the migration for you.
OpenTelemetry can trace a Vue app from document load to fetch call, but the browser story is far less settled than the server one. Which packages are stable, what auto-instrumentation really captures, the Vue-shaped gap nobody fills, and where the data ends up.
Server-rendered HTML is inert until hydration attaches Vue to it. What hydration does, why createSSRApp matters, the three documented causes of a hydration mismatch, and why a mismatch is a silent performance tax rather than a crash.
The usual framing pits Svelte's compiler against Vue's virtual DOM. Vue's own documentation calls its approach a Compiler-Informed Virtual DOM. What each compiler actually does, and what really decides the choice.
CLS is one of the three Core Web Vitals, alongside LCP and INP. What Cumulative Layout Shift measures, how its score is calculated, the good, needs-improvement and poor thresholds, the common causes of layout shifts, and how to fix them.
Largest Contentful Paint (LCP) is a Core Web Vital that measures when the largest element in the viewport loads. The good, needs-improvement and poor thresholds, what usually is the LCP element, and how to get it under 2.5 seconds.
INP replaced FID as a Core Web Vital in March 2024. What Interaction to Next Paint measures, the good, needs-improvement and poor thresholds, why it is stricter than FID, and how to fix a slow INP score.
Node.js v26.5.0 shipped on 8 July 2026 on the Current line. It adds experimental text imports, a Blob text stream, post-quantum TLS reporting and event-loop metrics. What is new, what it means for your apps, and the honest caveats of a non-LTS release.
TTFB is the time from requesting a page to receiving the first byte of the response. What it measures, what counts as a good TTFB (under ~800ms), how it feeds LCP, and the server, caching and CDN levers that reduce it.
TypeScript 7.0 rewrites the compiler in Go and builds roughly 10x faster - same types, new engine. What changed, the real benchmarks (VS Code 77.8s to 7.5s), how to try tsc today, the breaking changes, and the honest trade-offs.
The virtual DOM is a lightweight in-memory copy of the page that frameworks diff to update the real DOM efficiently. What it is, how the diffing works, and why it powers the declarative model of React and Vue.
SPA and PWA are constantly pitted against each other, but they answer different questions - one is about architecture, the other about capabilities. Here is how they actually relate, and how to choose.
GraphQL is a query language for APIs that lets the client ask for exactly the data it needs, described by a typed schema, from a single endpoint. What it is, how it works, GraphQL vs REST, and the honest trade-offs.
A REST API lets software talk to software over HTTP using simple verbs and JSON. How REST works, why it scales, how front ends use it, REST vs GraphQL, and what makes an API well designed.
A CDN (content delivery network) serves your site files from a server close to each visitor, making it faster, more scalable and more resilient. How it works, why it helps speed and security, and when you need one.
A progressive web app is a website that behaves like an installed app - offline-capable, installable and fast, from one codebase. What a PWA is, how service workers and the manifest work, and the honest limits.
Tailwind CSS styles your pages with small utility classes written right in your HTML, backed by a design system and a tiny production build. What it is, how it differs from normal CSS, and its honest trade-offs.
Curious which framework, server or analytics a site runs on? Here is how to find out what a website is built with - and what the tell-tale signs actually mean.
Vue and React solve the same problem in different styles. Here is an honest, practical comparison to help you pick the right one for your next project.
A practical toolkit for modern front-end work - editor, build tool, browser dev tools and the utilities that genuinely save time. No filler, just the tools that earn their place.
Static Vue site, server-rendered Nuxt, or a full Node app? The right hosting depends on how your front end actually runs. Here is how to choose - and deploy without surprises.
A single-page application loads once and then rewrites the page in the browser as you navigate. Here is what that means, why it became popular, and the trade-offs to know.
Core Web Vitals measure how a page feels to real users - loading, responsiveness and stability. Here is what they are and concrete ways to improve them, SPA included.
TypeScript adds static types to JavaScript to catch bugs before they ship. What it is, how the compiler works, the features that matter (types, generics, inference), TypeScript vs JavaScript, and the honest trade-offs.
Node.js lets you run JavaScript outside the browser - on servers, APIs and build tools. What it is, how the event loop makes it non-blocking, what it's good (and bad) at, and where npm fits.