Why Should I Care About Client-Side Logging?

Recently, the Loupe team has added JavaScript client-side logging to their ASP.NET Core Agent. It’s a feature that is pretty exciting for me personally. I have worked on JavaScript projects without any client-side logging and know it’s a pain. If I did have client-side logging, I could have avoided some embarrassing phone calls and most likely spotted some errors I never even knew about in the first place.

If you are not familiar with client-side logging, this is your chance to get to know it. Here we will discuss why it’s useful for JavaScript developers and how it will improve your troubleshooting experience.

What is Client-Side Logging?

By default, errors in the browser are written into the console rather than into a file. The browser console is a great resource when developing applications. But it has an inherent weakness: none of the console output is saved by default. Once the browser session ends or the user changes pages, any data is virtually gone for good.

That may not be a problem during development. You can save any console output you really need. But, this can be a tricky issue once an application is in production. When more people are using your application in ways you never intended, there are bound to be unexpected errors. Since this data is not saved anywhere by default, many developers rely on user reports to discover these errors.

Client-side logging is an alternative to this. It allows you to capture in-browser errors and send them to a location where developers can easily view them. This way, no one relies on user reports and can catch errors as they happen in production.

User Reports are Not Enough

User Reporting Workflow Chart

This is a possible workflow due to relying on user reports!

User feedback of any kind is valuable, especially feedback that can improve the experience for others. But, there are some problems with relying on user feedback as the only way to discover JavaScript errors for your application:

  • The user may not know they have encountered an error. Most people do not have the console open while browsing the web and will not always know when an error occurs. What is unexpected behavior for your application may not register as a problem for the user at all.

  • The user can be an unreliable narrator. If someone struggles with a technical problem, they may not be in the best frame of mind to discuss the issue. They may not remember the steps they took that resulted in the error. Or worse, remember incorrectly.

  • It may be difficult to replicate an error. There are a lot of different browsers, devices, and ways to use your application. Frankly, too many variables to guarantee you can replicate the error in the first place.

  • The user is likely to stop using your application rather than call you about an error. By the time a user wants to email or call you about an error, it may have already happened to ten other users who decided to find something else instead. In a world where applications rely on free versions or trials to get people’s attention, many users can cut bait easily if something doesn’t work for them.

I have worked on projects that did not have client-side logging, and it was very frustrating. For every user that was kind enough to call and report they were having an issue, I knew there were ones that would have never bothered. Honestly, it was also embarrassing. I would have to ask a lot of questions to get a sense of what the issue was. The result was often a spotty user account and a lot of their time spent.

How Does Client-Side Logging Make Troubleshooting Easier?

Client Side Logging Workflow Chart

This is an example of a client-side logging workflow using Loupe Server

The number one feature of client-side logging is that it allows you to collect log data you otherwise couldn’t. But there are additional benefits that are worth mentioning as well:

Complete Logging for Single-Page Applications

JavaScript on the client-side does so much of the heavy lifting in a Single-Page Application. From the user’s point of view, it is hard to beat the convenience of browser-based applications. They can run on a wide variety of hardware, no installation is required, and using the application from one location to the next is as simple as logging in on another machine.

With client-side logging, you can be sure you catch all of the issues with the application.
So much of what happens with Single-Page Applications results from what happens on the client, and having the context available can also help you solve problems with the back end. For Single-Page Applications, client-side logging will reveal issues with the application’s frontend and provide you context for what is going on in the backend.

Know the Scope of a Client-Side JavaScript Error

Whether an error appears for one user or one thousand users makes a significant difference when prioritizing an error. Client-side logging gives you the ability to make these decisions based on real data. This works better if you have a log management system that can count the occurrences of a specific error for you instead of doing a hand count. But no matter which situation you are in, the good news is that you have the option.

Client-Side Logging is Even Better When Part of a Log Management System

If you have a log management system already, you may have custom notification settings for errors in your applications or a specific error triage workflow in place already. But if you don’t have a form of client-side logging, those errors will be excluded from this process. If you have client-side logging that works with or built into your log management solutions, you can start treating JavaScript errors like any other application error.

  • Set up error notifications. If your client-side logging is integrated with your log monitoring system, you can use the same alert rules for your JavaScript errors as you would for any other error in your application. Whether this means sending a notification to a specific developer or a thread in Microsoft Teams, you now at least have the choice.

  • Easily search your JavaScript logs. Part of a log management system’s appeal is that they make searching your logs much easier than grep or “findstr.” When client-side logging is part of the package, you get the same enhanced search for your JavaScript logs.

  • Make troubleshooting widespread JavaScript errors easier. Powerful log analysis tools that can identify the operating system, the specific machines that had the error, and other metrics across all of your logs can save a significant amount of time. An error that occurred 1,000 times on one machine vs. an error that occurred 1,000 times on 1,000 machines are two vastly different problems that log analysis tools will allow you to identify quickly.

Get a Handle on Your JavaScript Applications

If you have an application that uses JavaScript, client-side logging will help you better understand your application’s health and know errors as they happen, not as you are told. Don’t let yourself be in a position where you are dependent on your users’ goodwill to keep up with your application.

If you have an application using ASP.NET Core, you can learn more about how you can use client-side logging within the Loupe ecosystem. We have built an agent both for general JavaScript applications and a robust agent targeted specifically for Angular.

Or you can learn how to use it hands-on, and install the agent with the link below.

Download the Agent

Rock solid centralized logging

Unlimited applications, unlimited errors, scalable from solo startup to enterprise.