Most bugs a user reports start in the browser and end in your API. Frontend monitoring puts both sides in one project. The browser SDK sends the errors, logs, and network calls of your web app to the same service as your backend, so a failed click and the request behind it show up in the same trace.
Catch frontend errors with their context
Uncaught errors and unhandled promise rejections become issues, grouped with your server errors. With source maps uploaded, stack traces point to your original files and lines instead of the minified bundle. Minified React errors are decoded.
Each occurrence carries the build version, the user, and the trace it happened in. When session replay is on, it also links to a recording of what the visitor did before the error.
The SDK drops the usual browser noise, such as errors from extensions and ResizeObserver warnings. An error thrown in a loop can't use up your quota.
Follow a click into the backend
Requests from the browser to your API carry a traceparent header. Your backend continues the same trace, so the trace waterfall starts with the browser call and shows the backend work under it, with the network time in between. When a page is slow, you see whether the time goes to the network, the API, or the database.
Know who hit the error
Call monocle.setUser() after sign-in. Errors, logs, and requests then carry the user, so you can answer "which customers saw this?" without asking them.
The Users page only lists users seen by your backend. Identify the user there too.
Measure page speed
With the analytics() integration, the SDK measures the Core Web Vitals of each page. Analytics shows LCP, INP, and CLS per page, next to the JavaScript error rate, so you see which pages are slow or broken for real visitors.