5 Tools That Can Help You Manage Your JavaScript Error Reporting

Introduction

Error reporting is very beneficial when diagnosing client-side browser errors. If an error occurs on a client’s browser, then error reporting can help us understand what occurred and how to fix it.

This article will show you what is available when it comes to helping you manage your JavaScript error reporting. The tools shown will give you an inclination of how easy they are to set up in your code, and this article will show you the main benefits you receive from each tool.

Sentry

A tool that is by far one of the most used is Sentry. Sentry is an error tracking system that is open-source, and comes with all the components necessary to start reporting errors out of the box. They use Raven.js, which is the official JavaScript client for Sentry, which can be incorporated into your application using their CDN.

The main benefit of Sentry is its ease of use. You can use classic try-catch styles when using the Raven client, and it allows you to easily hook this up to a data source name (DSN) they provide. The main disadvantage is you have to pay for such a great system. If working in small team, then it would cost you $29/month at the time this article was written.

Bugsnag

Bugsnag is similar to Sentry, focusing on error monitoring, web, mobile, and server applications. Bugsnag allows easy setup with provision of their own CDN link to run bugsnag on the client-side browser. You can also install it through your favourite package manager such as npm or yarn.

One of neat features of Bugsnag is the idea of breadcrumbs. Similar to informational logging, breadcrumbs can written within your code in order to capture stateful information that may lead up to a bug being thrown. These breadcrumbs will then be logged along with the thrown error, to give you increased contextual information.

Again, the one downside to Bugsnag is you have to pay for it. This platform comes in at a price of $29/month as well, at the time of writing.

Raygun

Raygun targets a market that is concerned with the visual aspects of error reporting. Raygun is advertised as a workflow tool, that can be setup to track down bugs and see if they are resolved by new releases. With more messy integration steps into your JavaScript code compared to Sentry or Bugsnag, it does allow you to integrate well into your client-side code and report on issues found. There also seems to be a lot of configuration that Raygun can give you, if you are not happy with the conventions it provides.

Ragun seems to be very visual with its bug reports and progress tracking. Depending on how you work, you may or may not find this beneficial. The biggest downside to Raygun is that it is a huge $199/month for even a startup to use.

TrackJS

The previous tools shown are tailored to many domains and programming languages. TrackJS specifically targets issues with client-side JavaScript error reporting. This is an advantage in itself, as it is a tool that has a feature set tailored to JavaScript, and so you won’t be paying for features that you never use. Like the previous tools, it is easy setup by adding some script tags to your html.

TrackJS gives you a dashboard which can show trends in errors, and even allow you to blackbox an error, reproducing the error locally in order to be able to fix issues that are costly. The basic version of TrackJS is $29.99/month at the time of writing. This is slightly more expensive than Sentry and Bugsnag, which is interesting considering TrackJS only works with JavaScript.

Usersnap

Usersnap takes JavaScript error monitoring in a different direction. It has a simplified way of recording client-side errors, with its main focus in user interaction and feedback. If you fancy a user interactive solution, then Usersnap can provide user feedback widgets, and allow various integrations to provide timely feedback.

Usersnap allows you to integrate with many technologies, such as JIRA, Asana, Slack, and more, making it a tool that works well with your bug-tracking team. Similar to other tools, it will cost you $29/month at the time of writing for one project and one team.

Conclusion

All things considered, I would say Bugsnag has the edge. If investing in an error reporting tool, then Bugsnag provides a solution that is priced similar to competition. But it provides a lot of integration points into a lot of different software stacks. It can hook into your build & deployment systems, allowing you to monitor health metrics of all your deployments.