Quickstart

Get started with PulseBear Speed Insights

Prerequisites

  • A PulseBear account.
  • Access to your project’s domain configuration.
  • A Next.js app (for the example below). Other frameworks can integrate via the JS SDK as well.

Create a project

  • In the PulseBear Dashboard, click New Project.
  • Enter your project name.
  • Set the Primary Domain (must match the site where you’ll install the SDK).

Enable Speed Insights

  • Open your project and navigate to the Speed Insights tab.
  • Toggle Enable Speed Insights.

Install the SDK

npm install @pulsebear/speed-insights
pnpm add @pulsebear/speed-insights
yarn add @pulsebear/speed-insights
bun add @pulsebear/speed-insights

Add the component in your root layout

Add the component to your app’s top‑level layout so metrics are captured on each page view.

// app/layout.tsx (Next.js)
import "./globals.css";
import { SpeedInsights } from "@pulsebear/speed-insights";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {children}
        <SpeedInsights />
      </body>
    </html>
  );
}

That’s it. Once deployed to the configured domain, data will start appearing in your dashboard within minutes.

Overview

Real-user monitoring for front-end performance with per-route insights

How it works

PulseBear Speed Insights architecture and data flow