Best Error Tracking Libraries for JavaScript in 2026

TL;DR

Sentry for the best developer experience and ecosystem; Highlight.io for session replay + errors in one tool. Sentry (~4M weekly downloads) is the industry standard — integrations for every framework, source maps, performance monitoring, and a generous free tier (5K errors/mo). Highlight.io (~50K downloads) is newer and open-source — it combines error tracking with full session replay at a lower price. For most projects, Sentry is the safe bet.

Key Takeaways

• Sentry: ~4M weekly downloads — full-featured, 5K errors/mo free, every framework
• Highlight.io: ~50K downloads — open-source, session replay + errors + logs bundled
• Bugsnag: ~200K downloads — stability monitoring focus, good mobile support
• Sentry source maps — upload during build to see original TypeScript code in errors
• @sentry/nextjs — automatic route instrumentation, server + client errors unified

---

Why Error Tracking Is Non-Negotiable

Every web application has bugs that make it into production. Some you know about from user reports; most you don't. Error tracking services automatically capture JavaScript exceptions, server errors, and performance issues the moment they occur — before users file bug reports or (worse) silently leave.

Without error tracking, debugging production issues is detective work: you look at logs hoping to find something relevant, try to reproduce bugs locally, and often can't. With error tracking, you have: the exact error message and stack trace, the user's browser and OS, the page they were on, the sequence of actions that led to the error (breadcrumbs), and a recording of exactly what happened on their screen (session replay).

The gap between "debugging with error tracking" and "debugging without" is enormous. For any application with real users, error tracking is among the highest-ROI tools you can add.

---

Sentry (Industry Standard)

// Sentry — Next.js setup
// npm install @sentry/nextjs
// npx @sentry/wizard@latest -i nextjs

// sentry.client.config.ts
import * as Sentry from '@sentry/nextjs';

Sentry.init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
  environment: process.env.NODE_ENV,
  tracesSampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1.0,
  replaysSessionSampleRate: 0.1,     // 10% of sessions
  replaysOnErrorSampleRate: 1.0,     // 100% of error sessions
  integrations: [
    Sentry.replayIntegration({
      maskAllText: true,             // Privacy: mask all user text
      blockAllMedia: true,
    }),
  ],
});

// sentry.server.config.ts
import * as Sentry from '@sentry/nextjs';

Sentry.init({
  dsn: process.env.SENTRY_DSN,
  tracesSampleRate: 0.1,
  // Profiling (requires plan)
  profilesSampleRate: 0.1,
});

// Sentry — manual error capture and context
import * as Sentry from '@sentry/nextjs';

// Capture specific errors with context
async function processPayment(userId: string, amount: number) {
  try {
    await chargeCard(userId, amount);
  } catch (error) {
    Sentry.captureException(error, {
      tags: {
        feature: 'payments',
        userId,
      },
      extra: {
        amount,
        timestamp: new Date().toISOString(),
      },
      level: 'error',
    });
    throw error;
  }
}

// Set user context (shows in Sentry UI)
Sentry.setUser({
  id: user.id,
  email: user.email,
  username: user.name,
});

// Custom breadcrumbs
Sentry.addBreadcrumb({
  category: 'ui.click',
  message: 'User clicked checkout button',
  level: 'info',
});

// Performance spans
const transaction = Sentry.startTransaction({ name: 'processOrder' });
const span = transaction.startChild({ op: 'validateInventory' });
await checkInventory(items);
span.finish();
transaction.finish();

// Sentry — error boundary (React)
import * as Sentry from '@sentry/react';

export function ErrorBoundaryWrapper({ children }) {
  return (
    <Sentry.ErrorBoundary
      fallback={({ error, resetError }) => (
        <div>
          <h2>Something went wrong</h2>
          <pre>{error.message}</pre>
          <button onClick={resetError}>Try again</button>
        </div>
      )}
      beforeCapture={(scope, error, componentStack) => {
        scope.setTag('react_component', 'App');
      }}
    >
      {children}
    </Sentry.ErrorBoundary>
  );
}

Sentry's wizard (npx @sentry/wizard) automates the entire setup: installs the SDK, creates config files, adds the webpack/Vite plugin for source maps, and configures environment variables. For Next.js, it instruments both the client and server automatically, including API routes, middleware, and server actions.

The breadcrumb system is particularly valuable for debugging: Sentry automatically records DOM clicks, navigation events, network requests, and console.log calls in the sequence they occurred. When an error triggers, you see exactly what the user was doing for the previous 30 seconds.

---

Highlight.io (Open-Source, Session Replay)

// Highlight.io — setup with React
import { H } from 'highlight.run';

H.init(process.env.NEXT_PUBLIC_HIGHLIGHT_PROJECT_ID!, {
  environment: 'production',
  version: process.env.NEXT_PUBLIC_APP_VERSION,
  networkRecording: {
    enabled: true,
    recordHeadersAndBody: true,   // Record network requests
  },
  privacySetting: 'strict',        // Mask PII by default
});

// Identify user
H.identify(user.email, {
  id: user.id,
  name: user.name,
  plan: user.plan,
});

// Manual error
try {
  await riskyOperation();
} catch (err) {
  H.consumeError(err as Error, {
    payload: { operation: 'riskyOperation' },
  });
}

// Track custom events
H.track('Checkout Started', { items: cart.length, total: cart.total });

// Highlight.io — Node.js backend
import { H } from '@highlight-run/node';

H.init({ projectID: process.env.HIGHLIGHT_PROJECT_ID! });

// Express middleware
app.use(H.Handlers.errorHandler());

// Manual capture
H.consumeError(new Error('Payment failed'), 'user@example.com', {
  payload: { amount: 99.99 },
});

Highlight.io's key differentiator is that it bundles session replay, error tracking, and structured logging in a single product. When an error occurs, you can immediately replay the user's session to see exactly what happened — no switching between tools.

Being open-source (Apache 2.0 licensed), Highlight.io can be self-hosted. For companies with data sovereignty requirements, self-hosting means error data never leaves your infrastructure.

The pricing model is also different: Highlight.io's hosted pricing is session-based rather than event-based, which often works out cheaper for applications with many small errors per session.

---

Source Maps (Critical for Any Tool)

// next.config.js — automatic source map upload with Sentry
const { withSentryConfig } = require('@sentry/nextjs');

module.exports = withSentryConfig({
  /* next.js config */
}, {
  // Sentry webpack plugin options
  silent: true,
  org: 'my-org',
  project: 'my-project',
  // Automatically upload source maps after each build
  widenClientFileUpload: true,
  // Delete source maps from bundle (don't expose to users)
  hideSourceMaps: true,
});

Source maps transform minified production JavaScript stack traces back into original TypeScript code. Without source maps, an error shows app.js:1:45892 — with source maps, it shows src/components/checkout/PaymentForm.tsx:142:5. Source map upload should be configured for any error tracking tool on day one.

---

Comparing Features

Feature	Sentry	Highlight.io	Bugsnag
Session Replay	✅ (addon)	✅ (included)	❌
Performance Monitoring	✅	Limited	❌
Open Source	Partial	✅	❌
Self-Hosting	✅ (Sentry self-hosted)	✅	❌
Free Tier	5K errors/mo	500 sessions/mo	Trial only
Logging Integration	❌	✅	❌
Mobile SDK	✅	Limited	✅

---

Pricing in 2026

Sentry: Free tier includes 5,000 errors/month. Team plan starts at $26/month for 50K errors. Business plan for custom volumes and SLAs.

Highlight.io: Free tier for 500 monthly sessions. Growth plan starts at $50/month. Self-hosted is free with no limits.

Bugsnag: No permanent free tier. Starts at $59/month for basic plans.

For startups and side projects, Sentry's free tier (5K errors/mo) is usually sufficient. For high-traffic applications generating millions of events, Highlight.io's session-based pricing can be more predictable.

---

When to Choose

Scenario	Pick
Standard error tracking	Sentry
Session replay + errors + logs bundled	Highlight.io
Open-source, self-hostable	Highlight.io
Mobile apps (React Native + web)	Bugsnag or Sentry
Stability score / error budget	Bugsnag
Performance monitoring	Sentry (transactions + spans)
Free tier (small project)	Sentry (5K errors/mo free)
Enterprise SLA	Sentry or Datadog
Data sovereignty / self-hosting	Highlight.io

---

Compare error tracking library package health on PkgPulse. Also see our best Node.js logging libraries for observability tooling and how to set up CI/CD for a JavaScript monorepo.