How would you know your website or app is running smoothly if you're not even looking for problems? Without monitoring software you're essentially flying an aircraft without navigation instruments.
That's why, whether you're just getting started, or running a mission-critical website, you'll probably want some form of monitoring in place to ensure things are working as expected, and to continuously improve your end-user experience.
In this article I'll be walking you through the various types of frontend monitoring tools out there, and how they can help you ship better software.
Error tracking and crash reporting
Error tracking software lets you identify and troubleshoot runtime issues for your application. It works by installing an agent in your application which then listens for errors in the background, and sends them to a backend service for aggregation and alerting you when something's up.
Sentry is a great option for surfacing and troubleshooting errors.
This type of monitoring software has been incredibly useful to me. It has helped me spot countless bugs in the past that would only surface during real world usage and the testing suite completely missed.
When it comes to privacy, many of them offer anonymization features which can either redact or completely drop information from an error which can potentially identify a user.
There's many alternatives, some even open source in case you're looking for self hosted software. Here's some of my personal picks:
- Sentry, well known for its open source offering and my current tool of choice for error tracking. It's more than just error tracking, since it also includes things like performance monitoring and distributed tracing.
- Honeybadger, it also bundles additional features such as uptime monitoring which can come quite handy if you're looking for this combo.
- Rollbar, another great alternative which is quite popular with enterprise companies.
Synthetic monitoring
Synthetic monitoring refers to a set of tools which automatically perform checks on your website or API at regular intervals - say, every minute- and notify you when something might be off.
Transaction monitoring on Checkly.
These tools include everything from uptime monitoring services to load testing software to transaction monitoring to security scans.
They're commonly used since it's usually the most straightforward way to know if your website is down, perform benchmarks, measure SLAs and even perform end-to-end tests on user transactions (eg. arrive on the landing page, go to the signup page, submit form).
The tool you need depends on which checks you're looking to automate, but I'll mention some of the alternatives:
- NodePing, a less known website monitoring service, but previous teams I've worked at used to monitor some pretty mission-critical sites and it was rock solid throughout the 5 years we depended on it. Not affiliated in any way, just happy with their service.
- Cronitor, while focused on cron job monitoring, also includes uptime monitoring for websites, APIs, S3 Buckets and more.
- Better Uptime, one of the newer alternatives, combines incident management and monitoring in one tool.
- Uptime Robot, a very popular uptime monitoring service with a free plan.
- Checkly, automated end-to-end testing of website or API transactions. Integrates with CI workflows on GitHub and has a generous free tier.
In addition to these there's plenty others, sometimes larger platforms include uptime monitoring too, for example New Relic and Datadog both have some of these features built-in.
Marketing analytics
Marketing analytics software gives you reports and statistics to help you understand where visitors are coming from, which pages they visit, and which marketing efforts convert better.
Google Analytics is a well-known marketing analytics solution.
They're commonly used by marketing professionals, rather than product development teams, but since most website owners want to measure basic metrics such as unique visitors, top pages and referrers, they're used quite extensively across the web.
There's plenty of tools in this space, which deserve their own blog post, but here's some alternatives to get you started:
- Google Analytics, a well-known analytics product. It offers hundreds of metrics and reports, and while it's free to get started it can get prohibitively expensive once you reach a certain level of traffic.
- Matomo, a popular open source alternative to Google Analytics. You can either self-host or let them manage a cloud instance for you.
- Plausible, another open source alternative, but focused on privacy. Their cloud offering is affordable and based in the EU.
- Splitbee, focused on simple analytics while offering some distinct automation and conversion optimization features.
- Fathom, a well-known alternative with a focus on simplicity and privacy.
- Simple Analytics, a popular alternative from the Netherlands with some pretty distinctive features such as a "tweet viewer" and social share banners. Also highly focused on privacy and simplicity.
- Panelbear, while it's not entirely focused on being a marketing analytics tool, I think it's a great alternative if you're looking for analytics without cookies. Full disclosure: I'm currently building this tool. In case you check it out, let me know what you think!
Product analytics
Product analytics is often confused with marketing analytics software. The difference is that product analytics helps you understand how your website or app is being used in terms of its features, while marketing analytics focuses on giving you statistics about how visitors arrive at your website and which content is most engaging.
Amplitude is a popular product analytics tool.
For example, product analytics would be best if you want to track which product features are being used, identify user experience problems, and which customers are most likely to churn based on their usage.
This information helps product teams make decisions on how to improve on existing features or what to build next. Without it, it's difficult to understand what's working and what isn't about your product.
Here's a list of product analytics software that is used quite often:
- Mixpanel, a very popular tool focused on event and conversion tracking. Something interesting is that they have an EU Data Residency program, which lets you pick whether to store the data in the US or Europe to simplify compliance.
- Heap, a cool feature is that integrating it on your website is relatively simple, it just tracks every interaction so you can more easily understand product usage with little effort.
- Amplitude, another popular alternative which focuses on segmentation and user journeys. It groups similar to users so you can analyse usage patterns rather than individual actions.
Application performance monitoring (APM)
Application performance monitoring tools help you debug issues and identify performance bottlenecks. Many of these tools can trace request timings from the frontend to the backend and all the way to the database requests.
If you're using the ELK stack you might want to check out the Elastic APM.
These traces can be valuable if you're trying to understand which requests are slowing down your application, and whether the bottleneck is the frontend, network, backend or the database.
Which one works best for you depends highly on how detailed you want these metrics to be. There are countless tools, both SaaS and open source which can help you here, with varying levels of complexity and cost.
Here's some of the commonly used APM software I've encountered with in the wild:
- Sentry, while Sentry is well known for its error tracking product, they recently released performance monitoring features which pair well with the rest of their offering. I've been testing it for a few months now and I like what I see.
- Elastic APM, from the guys behind Elasticsearch and Kibana, it's a popular open source stack for logs and metrics which includes an APM product.
- New Relic, their APM is one of the most popular out there and integrates well with the rest of their stack.
- Datadog, this one is among my favourites. It's a comprehensive product with lots of integrations, which has served the teams I've worked with well over the years.
Real user monitoring (RUM)
Real user monitoring measures your application's usage and performance from the perspective of your end users. It's sometimes also called browser monitoring, since it can detect performance issues, Javascript errors, and other on-device information.
Panelbear provides traffic and performance insights in a simple dashboard.
Why should you care about this? It's tempting to think that access logs or measuring response times on your servers is enough, but that's only half the picture. Your end user's device, connection speed, and geographical location play a vital role in your application's real performance.
Metrics such as browser timings, the page load time, and new standards such as Core Web Vitals are best measured from the perspective of the end user under real world conditions. It's about understanding the end-to-end experience, and what your real users perceive as opposed to testing things on a powerful development workstation.
Here's some great alternatives to consider if you're looking to add real user monitoring to your application:
- SpeedCurve, while it's mainly focused on performance metrics, it's a solid product with some unique features such as page load filmstrips.
- Datadog, I've used it for several years and it's honestly great. It can get a bit expensive, but they also offer so much more. It's a complete monitoring platform.
- Raygun, which also offers others error reporting and an APM product.
- Pingdom, while it's mainly known for its uptime monitoring service, it also offers a RUM product.
- Panelbear, it includes real time traffic and performance insights, and it's free to get started. Again, I'm building this tool, and while it's still in the early stages, I'm happy to hear what you think!
Conclusion
While some teams do just fine using marketing analytics software - such as Google Analytics - it's not enough to get a complete picture over your application's usage, performance, and uptime.
At some point, most teams rely on some combination of monitoring tools which help them build and improve their software over time.
I hope this guide helped paint a more complete picture of the frontend monitoring landscape. Did you enjoy it? You can find me on Twitter in case you have any questions or comments.
Top comments (1)
Great article, I also suggest odown.io which is included in the synthetic monitoring category, simple and reliable and with beautiful status pages :)