Blogfoon

Blogfoon is a personal space for thoughtful notes on technology, coding, travel, and ordinary life.

  • Published:

Speed Insights

If a Next.js project is already hosted on Vercel, two of the platform's own tools are worth switching on: Web Analytics and Speed Insights. One tells you who is visiting and from where, the other tells you how the site actually feels to those visitors. Both take only a few minutes to install.

Web Analytics

Start with the package:

npm i @vercel/analytics

Then mount the component inside the body of your root layout:

import { Analytics } from '@vercel/analytics/next';

export default function RootLayout({ children }) {
return (
    <html lang="en">
    <head>
        <title>Next.js</title>
    </head>
    <body>
        {children}
        <Analytics />
    </body>
    </html>
);
}

Save the file and push to GitHub. Once Vercel rebuilds, you have basic visit tracking and traffic analysis waiting for you in the Vercel dashboard — no extra configuration, no third-party script to manage.

Speed Insights

Speed Insights focuses on something different: the real browsing experience of actual visitors. It shows you how quickly people are connecting to the site, and those numbers become the basis for deciding which pages need work. There is a secondary benefit too — pages with strong performance metrics tend to be picked up more easily by search engines.

Installation follows the same pattern:

npm i @vercel/speed-insights

And the component goes into the same layout file:

import { SpeedInsights } from '@vercel/speed-insights/next';

export default function RootLayout({ children }) {
return (
    <html lang="en">
    <head>
        <title>Next.js</title>
    </head>
    <body>
        {children}
        <SpeedInsights />
    </body>
    </html>
);
}

Push the change, let Vercel rebuild, then reload the page — speed data starts appearing shortly after.

Taken together, the two dashboards answer complementary questions: how much traffic arrives, and whether that traffic is having a good experience once it lands. That combination gives you a concrete basis for deciding what to optimize first, rather than guessing at what might be slow or unpopular.

Related Posts