TL;DR
Sentry for error monitoring — the standard, excellent free tier (5k events/month), integrates with every framework. LogRocket when you need session replay to understand what users were doing when an error occurred. Highlight.io for the all-in-one open source alternative (logs + errors + sessions + distributed tracing). Most boilerplates should add Sentry on day one.
The Cost of Untracked Errors
A real scenario: A SaaS app has a bug where users with special characters in their email fail silently during checkout. No error logging = no alert = 5% of checkout attempts fail silently = 5% revenue loss for weeks before someone reports it.
Error monitoring catches silent failures before users churn.
Sentry: The Standard
Sentry is the most widely used error monitoring platform. Free tier: 5,000 errors/month — more than enough for early SaaS.
// instrumentation.ts — Sentry initialization (Next.js App Router)
import * as Sentry from '@sentry/nextjs';
export async function register() {
if (process.env.NEXT_RUNTIME === 'nodejs') {
Sentry.init({
dsn: process.env.SENTRY_DSN,
environment: process.env.NODE_ENV,
tracesSampleRate: 0.1, // 10% of transactions for performance monitoring
integrations: [
Sentry.prismaIntegration(), // Track slow DB queries
],
});
}
if (process.env.NEXT_RUNTIME === 'edge') {
Sentry.init({
dsn: process.env.SENTRY_DSN,
tracesSampleRate: 0.1,
});
}
}
// 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: 0.1,
replaysSessionSampleRate: 0.05, // 5% of sessions
replaysOnErrorSampleRate: 1.0, // 100% of sessions with errors
integrations: [
Sentry.replayIntegration(),
],
});
User Context for Better Error Tracking
// Set user context after authentication — critical for debugging
import * as Sentry from '@sentry/nextjs';
export function identifyUserInSentry(user: User) {
Sentry.setUser({
id: user.id,
email: user.email,
username: user.name,
plan: user.plan,
});
}
// Manual error capture with context
try {
await processPayment(paymentData);
} catch (error) {
Sentry.captureException(error, {
extra: {
userId: user.id,
plan: user.plan,
paymentAmount: paymentData.amount,
},
tags: {
feature: 'billing',
errorType: 'payment-failure',
},
});
// Rethrow or handle gracefully
throw error;
}
Sentry Alerting
// Alert rules in Sentry UI (no code needed):
// - Error rate spike > 10 errors/min → Slack alert
// - New error type not seen before → Email notification
// - Error regression (fixed bug reappearing) → PagerDuty
LogRocket: Session Replay + Error Tracking
LogRocket records user sessions — you can replay exactly what a user did when they hit an error. Expensive at scale, but the debugging value is high.
// client-side only
'use client';
import LogRocket from 'logrocket';
export function initLogRocket() {
if (process.env.NODE_ENV !== 'development') {
LogRocket.init(process.env.NEXT_PUBLIC_LOGROCKET_APP_ID!);
}
}
// Identify user for session replay
export function identifyUser(user: User) {
LogRocket.identify(user.id, {
name: user.name,
email: user.email,
plan: user.plan,
});
}
// Connect LogRocket sessions to Sentry errors
LogRocket.getSessionURL((sessionURL) => {
Sentry.configureScope((scope) => {
scope.setExtra('sessionURL', sessionURL);
});
});
Now when Sentry catches an error, you have a link to watch the user's session leading up to it.
LogRocket pricing: Free: 1k sessions/month. $99/month for 10k sessions. Expensive but valuable for complex UX issues.
Highlight.io: Open Source All-In-One
Highlight.io is open source (self-hostable) and combines frontend monitoring, backend logging, session replay, and distributed tracing.
// app/layout.tsx
import { H } from '@highlight-run/next/client';
export default function RootLayout({ children }) {
return (
<html>
<body>
<H
projectId={process.env.NEXT_PUBLIC_HIGHLIGHT_PROJECT_ID!}
serviceName="frontend"
tracingOrigins
networkRecording={{ enabled: true }}
/>
{children}
</body>
</html>
);
}
// Backend tracing
import { H } from '@highlight-run/next/server';
H.init({ projectID: process.env.HIGHLIGHT_PROJECT_ID! });
export async function GET(req: Request) {
const { span } = H.startWithHeaders('user-fetch', req.headers);
try {
const user = await prisma.user.findUnique({ where: { id } });
span.end();
return Response.json(user);
} catch (error) {
H.consumeError(error);
span.end();
throw error;
}
}
Highlight.io advantages:
- Open source — self-host for full control
- Cloud plan is competitive: $50/month for small teams
- Frontend + backend + sessions in one platform
- Growing fast, active development
What Matters Most at Early Stage
Week 1: Add Sentry. That's it.
npm install @sentry/nextjs
npx @sentry/wizard@latest -i nextjs
Five minutes of setup. Sentry will catch your first production bug within days.
Month 3: If you're seeing errors you can't reproduce:
- Add LogRocket or Sentry session replay (Sentry has it on paid plans)
Month 6: If you have complex backend services:
- Consider Highlight.io for distributed tracing
Boilerplate Error Tracking
| Boilerplate | Error Tracking | Provider |
|---|---|---|
| ShipFast | ✅ | Sentry |
| Supastarter | ✅ | Sentry |
| Makerkit | ✅ | Sentry |
| T3 Stack | ❌ | Add yourself |
| Epic Stack | ✅ | Sentry |
Epic Stack includes Sentry with proper user context and source maps — it's the best reference implementation.
Source Maps for Meaningful Stack Traces
Without source maps, Sentry shows minified JavaScript errors — meaningless line numbers pointing to bundled code. Source maps are the difference between "TypeError at bundle.js:1:45983" and "TypeError at src/lib/billing.ts:47 — cannot read 'stripeCustomerId' of undefined."
# Install Sentry webpack plugin for source maps
npm install @sentry/webpack-plugin --save-dev
// next.config.js
const { withSentryConfig } = require('@sentry/nextjs');
module.exports = withSentryConfig(
{
// Your existing next.config.js options
},
{
org: process.env.SENTRY_ORG,
project: process.env.SENTRY_PROJECT,
authToken: process.env.SENTRY_AUTH_TOKEN,
silent: true, // Suppress build output
hideSourceMaps: true, // Don't expose source maps to users
}
);
Source map upload happens automatically during next build. The source maps are uploaded to Sentry and deleted from the production bundle — users never see your original source, but Sentry can map errors back to it. This setup is worth doing before your first production deploy; retrofitting it after you have unexplained errors is frustrating.
Setting Alert Thresholds
Default Sentry alert rules are too broad for SaaS applications. The result: alert fatigue from noisy notifications that obscure real incidents.
Better alert configuration:
# Alert 1: Error spike (incident detection)
Condition: error count > 50 per 5 minutes (any error)
Action: Slack #alerts
# Alert 2: New error type (first-time errors)
Condition: first_seen < 1 hour ago AND count > 1
Action: Slack #engineering (requires investigation)
# Alert 3: Billing errors (revenue impact)
Condition: transaction.name contains "checkout" AND error rate > 2%
Action: PagerDuty (wake someone up)
# Alert 4: Auth errors (security signal)
Condition: event.message contains "unauthorized" AND count > 100/hour
Action: Slack #security
# Alert 5: P95 latency spike (performance)
Condition: p95(transaction.duration) > 3000ms for any transaction
Action: Slack #performance
The billing and auth alert rules are the most important for SaaS products. A checkout error rate above 2% means you're losing revenue right now. Auth error spikes can indicate a credential stuffing attack. Configure these two before launch.
Cost at Scale
Understanding pricing before committing to a platform prevents surprise bills as your product grows.
| Users | Sentry | LogRocket | Highlight.io Cloud |
|---|---|---|---|
| 0-5K MAU | Free (5K events) | Free (1K sessions) | Free (500 sessions) |
| 10K MAU | ~$26/mo (Dev plan) | $99/mo (1K sessions) | $50/mo |
| 50K MAU | ~$80/mo | $350+/mo | $150/mo |
| 100K MAU | ~$150/mo | $600+/mo | $250/mo |
| Self-hosted | Open Source | ❌ | ✅ Open Source |
LogRocket's session replay pricing scales poorly for consumer apps with many users. Sentry becomes the value leader at scale for pure error monitoring. Highlight.io's self-hosted option is the strongest choice for teams with data residency requirements or privacy concerns about sending user sessions to third-party services.
Choosing the Right Tool by Stage
Early stage (0-1K users): Add Sentry's free tier on day one. No other monitoring needed. Five thousand error events per month is more than enough to catch every production bug at this scale. LogRocket and Highlight add cost before they add proportional value.
Growth stage (1K-10K users): Sentry's paid plan ($26/month Developer tier) for higher event volume and 90-day retention. Consider adding Sentry's session replay (included in paid plans) before buying LogRocket — the same workflow with fewer vendor relationships.
Scale stage (10K+ users): Evaluate Highlight.io if data privacy is a concern (sessions contain user behavior data). Sentry's performance monitoring becomes valuable here for identifying slow database queries and API endpoints affecting many users. LogRocket justifies its cost for B2B products where understanding one high-value customer's session is worth $100+/month.
The common mistake: buying LogRocket at early stage because session replay sounds powerful. Most early-stage bugs are server errors visible in Sentry without replay. Session replay is most valuable when you have enough users to surface UX problems that never get reported.
Sentry vs LogRocket vs Highlight.io: Summary
| Dimension | Sentry | LogRocket | Highlight.io |
|---|---|---|---|
| Primary use case | Error monitoring | Session replay | All-in-one |
| Free tier | 5K events/mo | 1K sessions/mo | 500 sessions/mo |
| Self-hostable | ✅ (complex) | ❌ | ✅ (Docker) |
| Backend errors | ✅ | Partial | ✅ |
| Performance monitoring | ✅ | ❌ | ✅ |
| Session replay | ✅ (paid) | ✅ (core feature) | ✅ |
| Best for | Any SaaS | UX-heavy products | Privacy-first teams |
For most SaaS products, Sentry is the right first choice. LogRocket adds value when session context is essential for debugging — typically consumer apps with complex UX flows or B2B tools where enterprise customers report issues you can't reproduce. Highlight.io is compelling if you're building in an industry with data residency requirements or prefer open source infrastructure.
Key Takeaways
- Add Sentry on day one — 5 minutes to install, immediate value when your first production error hits
- Source maps are non-negotiable: configure them before first deploy or errors are unreadable
- Set custom alert rules for billing and auth errors before launch — these are the high-stakes failure points
- LogRocket is powerful but expensive; Sentry's built-in replay (paid plans) covers 80% of the session replay use case
- Highlight.io is the open source alternative worth considering if data privacy or self-hosting matters
- LogRocket's cost scales poorly for high-MAU consumer apps — evaluate Sentry performance monitoring first, which covers performance bottlenecks alongside error tracking in a single platform
- Configure billing and auth error alerts before your first production deploy; these are the failure modes that cost real revenue and can indicate security incidents
Why Error Monitoring Is Non-Negotiable
The failure mode that justifies error monitoring isn't the dramatic crash where your site returns 500 errors to everyone — you'd notice that immediately. The failure mode that costs real revenue is the silent, partial failure that affects a subset of users, fails without logging, and goes undetected for days. Special characters in an email address breaking regex validation. A payment flow that succeeds 95% of the time and silently fails for specific card types. A feature that crashes on the mobile browser version your power users happen to use.
Without error monitoring, you discover these failures through user complaints, churn, and support tickets — lagging indicators that measure damage after it's occurred. With error monitoring, you discover them within minutes of the first occurrence, with a stack trace, the user's context, and the sequence of events that preceded the error.
The free tier of Sentry (5,000 errors/month) is sufficient for most early-stage SaaS applications. A product with 500 monthly active users and a reasonable error rate might generate 50-200 errors per month. The free tier provides 25x headroom before any cost. There's no good reason not to add Sentry from day one.
Sentry in Next.js App Router: Architecture Details
Sentry's Next.js integration changed with the App Router. The instrumentation.ts file registers Sentry initialization separately for Node.js (API routes, server components) and the edge runtime (middleware), because they're different execution environments. If you skip the edge initialization, errors in middleware go untracked.
The source map upload is critical for production debugging. Without source maps, Sentry shows minified stack traces that point to single-character variable names in a bundled file. Source maps let Sentry de-minify the trace and show you the exact TypeScript source line. Sentry's Next.js wizard configures this automatically; if you set up manually, verify source maps upload in your build output by checking the Sentry dashboard's Source Maps tab after your first production deploy.
Performance monitoring (tracesSampleRate) is separate from error monitoring and optional. At 0.1 (10% sampling), you get performance data without significant overhead. Be aware that performance monitoring events count toward your Sentry event quota on paid plans.
LogRocket: When Session Replay Pays for Itself
LogRocket's session replay is the right tool for a specific class of bugs: interface problems that users can reproduce but can't describe accurately. "The button doesn't work" is a useless bug report. LogRocket shows you exactly what the user clicked, what network requests returned, and what the console showed. You can watch the bug happen.
The cost model limits its applicability. For B2B SaaS products where a single enterprise customer's bug report represents tens of thousands of dollars in ARR, $99/month for 10,000 sessions is justified by a single resolved incident. For consumer apps with thousands of low-value users, the cost-per-bug-insight ratio is harder to justify.
The most productive use: enable LogRocket only for users who report issues. Add a support workflow where users can trigger session sharing, giving support agents access to the session video for that specific user's recent activity. This limits LogRocket usage to cases where the replay is actually needed, rather than recording all sessions by default and paying for recordings you'll never review. The targeted approach also avoids privacy concerns that broad session recording can raise with GDPR-conscious enterprise customers.
Highlight.io for Privacy-Sensitive Products
Highlight.io's self-hosted option is the only error monitoring + session replay solution in this comparison that lets you control where data is stored. User sessions recorded by Sentry (session replay, paid plans) and LogRocket are stored on their servers. For products in healthcare-adjacent, legal, or government sectors where storing user behavioral data in third-party systems requires additional compliance review, Highlight.io self-hosted avoids this concern.
The operational overhead of self-hosting Highlight.io is non-trivial. The Docker Compose setup includes multiple services — Clickhouse for analytics storage, OpenSearch for log storage, Redis for queuing, and the main application service. This architecture is appropriate for teams with dedicated DevOps capacity and clear compliance requirements; it's a bad fit for solo developers or small teams who want zero infrastructure overhead alongside their core error monitoring. For most teams in 2026, Sentry's free tier combined with its improved Next.js 15 App Router integration covers the majority of error monitoring needs without additional infrastructure investment.
For the full monitoring setup beyond error tracking — structured logging, APM, distributed tracing, and uptime monitoring — see the SaaS observability stack guide. For boilerplates that ship Sentry pre-configured, Epic Stack and Makerkit are the best reference implementations. The performance optimization guide covers the next layer after error monitoring.
The right choice between these options depends on your specific requirements, team expertise, and production constraints. Test each option with a realistic subset of your use case before committing — what works for one team's workflow may not fit another's.
Find boilerplates with error tracking on StarterPick.
See our guide to SaaS observability stacks for the full monitoring setup including logging and APM.
Browse best SaaS boilerplates including which ones ship with Sentry pre-configured.