Track your Website or App Like a Pro(grammer)
Tracking a website or native app is a vital yet often overlooked portion of the development process. As a business, it’s important to know the monetary impact of features. As a programmer, it’s important to find the source of bugs as soon as possible.
At Walmart Labs, customer impacting issues tend to come to front end engineers first, and it’s our job to find the cause. Whether it’s bad data from an upstream dependency, high latencies contributing to timeouts, or even faulty regex causing memory leaks, there’s always a fire igniting somewhere. At companies where each minute is highly valuable, learning to efficiently track your website or app is one of the best skills to practice. To start, it’s helpful to break down your tracking approach into two types: business and debugging.
Business
Business metrics focus on the monetary value of new features and total site revenue. It typically involves tracking events like page interactions, transactions, user retention, and GMV (gross merchandise value). There are also performance metrics like TTFB (time to first byte), speed index (time to display above-the-fold content), TTI (time to interaction), and much more that revolve around site speed (check out https://medium.com/@vikigreen/impact-of-slow-page-load-time-on-website-performance-40d5c9ce568a for more info on how site speed affects business metrics). By collecting this type of data, we make better estimations on how changes like architectural refactoring or new features impact the company, which is especially true when utilizing AB tests. This type of tracking and analyzing practically guarantees revenue growth. But what about when there’s an existing issue with the site? Let’s move on to debugging.
Debugging
To begin with debug tracking, it’s important to first understand every service call dependency made. It’s also helpful to gather debugging info about the dependencies of your service calls, those dependencies’ dependencies, and so forth. Yes, this can turn into a rabbit hole situation, but the more knowledge the better. This really helps your team understand the end to end process of the website or app. Once that’s established, it’s helpful to log stats about these service requests and responses, such as request headers, response status, error stacks, and latency.
Besides service calls, it’s also useful to gather info about a user’s environment and personal experience with the site. The browser type and version, request cookies, and requested URL will already be part of request headers. However, there’s also some other things worth considering. For example, if serving different bundles depending on an AB test or device type (such as websites serving different content between mobile and desktop users), it’s important to log which code bundles are served. A client’s network speed, viewport size for responsive designs, and other info may also be valuable when debugging errors only occurring to a subset of users. These help developers find the exact conditions where a problem occurs.
Monitoring
Once you’ve covered your bases, it’s important to make sure this data is easily queryable through a platform like Splunk or Elasticsearch. No matter the logging platform you use, always ensure your logs are standardized. When given the task to query through some logs, nothing feels worse than not knowing how to begin searching because of sloppy formatting.
Lastly, if your company depends on quick response times 24/7 in the event of an emergency, you’d better set up an automatic alerting system such as PagerDuty or xMatters which looks for spikes in certain logs; a lot of this will have to be configured at your server rather than app level. Just know that you should look for things like spikes in non-200s, resource tracking like CPU and memory usage, service latencies, bot tracking, and more.
Graphing this data with a metrics analyzing tool suite such as Grafana is also extremely helpful. After all, logging is only useful if the team can understand it. A good rule of thumb is to visualize any important data to prevent unnecessary manual log digging.
Use this advice, and I promise you you’ll have a much better time as your website or native app evolves!
