> ## Documentation Index
> Fetch the complete documentation index at: https://tinyanalytics.io/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Core Web Vitals Analytics

> Measure real-user LCP, CLS, INP, FCP, and TTFB percentiles, then break Core Web Vitals down by page, location, browser, and device.

The Performance report shows your site's **Core Web Vitals** measured on real visits: LCP, CLS, INP, FCP, and TTFB. It reports each metric at the 50th, 75th, 90th, and 99th percentiles and plots them over time. Breakdowns by page, country, region, browser, operating system, and device show not just how fast your site is on average, but how slow it gets for your worst-served visitors.

## How do I turn on Core Web Vitals collection?

Performance data is collected only when you add the `data-web-vitals` attribute to your tracking script — it's **off by default**. Add it once and re-deploy:

```html theme={null}
<script defer src="https://dash.tinyanalytics.io/script.js"
  data-site-id="123"
  data-web-vitals></script>
```

With it on, tinyanalytics sends **one performance event per page load** carrying the five vitals. Until data arrives, the Performance report shows a notice explaining how to enable collection. See [Configure the tracking script](/docs/configure-tinyanalytics-tracking-script#collect-core-web-vitals) for the full attribute reference.

## What are the five Core Web Vitals?

Each metric captures a different part of the loading and interaction experience. tinyanalytics collects all five and marks each against its standard "good" threshold:

| Metric                              | What it measures                              | Unit           | "Good" threshold |
| ----------------------------------- | --------------------------------------------- | -------------- | ---------------- |
| **LCP** — Largest Contentful Paint  | When the main content finishes rendering      | milliseconds   | ≤ 2,500 ms       |
| **INP** — Interaction to Next Paint | How quickly the page responds to interactions | milliseconds   | ≤ 200 ms         |
| **CLS** — Cumulative Layout Shift   | How much the layout jumps while loading       | unitless score | ≤ 0.1            |
| **FCP** — First Contentful Paint    | When the first content appears                | milliseconds   | ≤ 1,800 ms       |
| **TTFB** — Time to First Byte       | How quickly the server starts responding      | milliseconds   | ≤ 800 ms         |

LCP, INP, and CLS are the three official Core Web Vitals; FCP and TTFB are supporting diagnostics that help explain a poor LCP.

## Why does tinyanalytics show percentiles instead of an average?

Performance is reported at percentiles because averages hide your slowest experiences. A single very slow page load barely moves an average but is exactly the experience you want to find. tinyanalytics reports four percentiles for every metric:

* **p50** — the median visit. Half of loads were faster than this.
* **p75** — the headline percentile Google uses to grade Core Web Vitals. This is the default.
* **p90** and **p99** — your slowest 10% and 1% of loads.

The report defaults to **LCP at the p75 percentile**. Switch the metric and percentile from the controls, and the cards, chart, and table all update together.

## How do I read the performance chart?

The chart plots your selected metric over time, with one line per visible percentile so you can watch p75 and p99 move independently. Threshold lines mark the "good" and "needs improvement" boundaries, so a line crossing into the upper band is an at-a-glance regression. Use the bucket selector to switch between hourly, daily, weekly, and monthly points.

## How do I find which pages or devices are slow?

The breakdown table splits your selected metric and percentile across six dimensions, one tab each:

**Pages · Countries · Regions · Browsers · Operating Systems · Devices**

This is how you find *what* is slow. A high p75 LCP overall might trace to one heavy landing page, one country far from your servers, or one browser. Click a row to filter the whole dashboard to it — the same drill-down a breakdown or map click performs.

## How do I spot a performance regression?

Turn on [period comparison](/docs/analytics-period-comparison) to add a baseline and a change indicator to each metric card. Performance comparison is aware that **lower is better** for Core Web Vitals: a rising LCP is a regression, so its change indicator turns red with an up arrow, not green.

<Note>
  Because vitals are captured only when a metric actually fires before the visitor leaves, a metric can be missing on some loads (for example, INP needs an interaction). tinyanalytics skips missing values rather than counting them as zero, so each percentile reflects only real measurements.
</Note>

## Frequently asked questions

<AccordionGroup>
  <Accordion title="Why is my tinyanalytics Performance report empty?">
    Core Web Vitals collection is off by default. tinyanalytics collects performance data only when you add the `data-web-vitals` attribute to your tracking script and re-deploy. Until data arrives, the Performance report shows a notice explaining how to enable collection.
  </Accordion>

  <Accordion title="Which percentile should I use for Core Web Vitals?">
    Use p75, the headline percentile Google uses to grade Core Web Vitals. It is also the tinyanalytics default, alongside LCP. Read p50 for the median visit, and p90 and p99 to see your slowest 10% and 1% of loads.
  </Accordion>

  <Accordion title="Why does a rising LCP show as a red increase instead of green?">
    Because lower is better for Core Web Vitals. tinyanalytics period comparison knows this, so a rising LCP is treated as a regression and its change indicator turns red with an up arrow rather than green. Turn on [period comparison](/docs/analytics-period-comparison) to add a baseline to each metric card.
  </Accordion>

  <Accordion title="What are the good thresholds for each Core Web Vital?">
    tinyanalytics marks each metric against its standard good threshold: LCP ≤ 2,500 ms, INP ≤ 200 ms, CLS ≤ 0.1, FCP ≤ 1,800 ms, and TTFB ≤ 800 ms. LCP, INP, and CLS are the three official Core Web Vitals; FCP and TTFB are supporting diagnostics that help explain a poor LCP.
  </Accordion>
</AccordionGroup>

## Related

<Columns cols={2}>
  <Card title="Configure the tracking script" icon="sliders" href="/docs/configure-tinyanalytics-tracking-script#collect-core-web-vitals">
    Add `data-web-vitals` to start collecting performance data.
  </Card>

  <Card title="Dashboard overview" icon="gauge" href="/docs/web-analytics-dashboard">
    Your traffic metrics and breakdowns alongside performance.
  </Card>

  <Card title="Compare periods" icon="arrow-right-arrow-left" href="/docs/analytics-period-comparison">
    Add a baseline to spot performance regressions.
  </Card>

  <Card title="Filter your data" icon="filter" href="/docs/analytics-filters">
    Narrow performance to one page, country, or device.
  </Card>
</Columns>


## Related topics

- [Analytics Period Comparison](/docs/analytics-period-comparison.md)
- [Configure the tinyanalytics Tracking Script](/docs/configure-tinyanalytics-tracking-script.md)
- [Website and API Uptime Monitoring](/docs/website-api-uptime-monitoring.md)
