Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

The Error Tracking Space Is Heating Up

DZone's Guide to

The Error Tracking Space Is Heating Up

A plethora of crash reporting and error tracking tools have sprouted up in the past couple of years. But why is this so?

Free Resource

Years ago, technologies like Adobe Flash, Flex, and Microsoft Silverlight used to be the standard for creating visually pleasing, interactive web experiences. The term “single-page application” was more of a buzzword, and while employed by smaller ventures, larger companies were nowhere near adopting such approach.

These days we see that HTML5 and JavaScript libraries are dominating the web development world. The rising adoption of JavaScript also signals the growth of client-side problems, both in terms of absolute numbers and complexity, which invariably makes reproducing these issues more difficult and costly.

What’s a SPA?

Just like the name suggests it, single-page applications (SPAs) are web applications that load a single HTML page which gets dynamically updated as the user interacts with the app. Most of the work gets done on the client side, in JavaScript, allowing SPA’s to offer a desktop-like experience to users, without constant page reloads. A growing ecosystem of JavaScript frameworks (like Angular, React, EmberJS, Meteor, and Backbone) is available to support the development and adoption of SPAs.

Why Now?

We all know that the present-day user gets easily distracted. Our attention span is getting shorter and shorter. Providing a snappy, enjoyable user experience to web visitors today is a key factor in achieving business goals.

Similarly, it’s not news for anyone that mobile traffic’s been growing faster than traditional desktop traffic, and mobile device users by default expect the look and feel of native mobile apps.

With single-page applications, organizations can mimic the native app-like experience (and performance!) within the browser. This provides an answer to the common question a lot of companies are facing nowadays: app or website? Saving the costs and effort to upload and maintain an app on the app stores is not negligible. On top, you can update your web application as many times as you want, this way shortening time to market.

The single-page model also supports more elaborate user interactions which can be harder to implement with server-side rendering: Pinterest’s deep linking, Artsy’s fade between pages, infinite scroll, just to name a few (i.e. Rise of the SPA by Dan Pupius).

What’s more, adding more logic to the client side of the SPA and allowing the app to handle separation of data and view layers help radically improve performance by reducing the number of client-server loops.

JavaScript and the Enterprise

There’s a growing list of large companies adopting JavaScript for more than just front-end work. Last year VMWare announced its decision to work towards transitioning its vSphere web client to HTML5. Groupon rebuilt its entire web layer with Node.js, switching from Ruby. Further, GoDaddy ditched. NET to work with Node.js. Netflix, Capital One, NASA — just to throw in a few more names. Despite the continuously growing mobile traffic, the desktop is still the norm in the office environment and among B2B customers alike. Hence the investment we see enterprises make in JavaScript development, and SPA’s in particular, comes as no surprise.

The numbers speak for themselves:

Source: 2016 StackOverflow Developer Survey data

Source: 2016 StackOverflow Developer Survey data.

Image title

A continuous cycle of growth in the enterprise. Source: Salesforce Developers Blog.

The Explosive Growth of Error Tracking Tools

The past few years saw the vigorous development of crash reporting and error tracking tools to fill an increasing need to understand, reproduce and debug application problems, both on the server- and the client-side.

Furthermore, with the growing popularity of SPAs, where a substantial part of the app logic gets added to the client, the debugging challenges for developers are multiplying. The application client-side gets more dynamic and complex and developers struggle to replicate the errors that occurred in user browsers.

The increasing popularity of hosted software and the fact that these tools managed to freeride the SaaS wave helped them quickly secure traction and user base.

In less than 5 years, from an internal tool for exception logging in Django applications, Sentry.io grew to support other popular languages like PHP, Java, Ruby, and eventually JavaScript. Just a year ago they secured $9 million funding to grow their team and expand the product feature set.

Image title

A stack trace of a JavaScript error in Sentry.

There’s a lot of similar solutions in the space, and competition is heating up. In the past few years, tools like Rollbar and Bugsnag also managed to secure funding and the interest of VC and angels investors alike.

The New Frontier

A new concept has started to gain traction in the past year: tools that help developers get the context in which an error happened in order to reproduce the issue and debug faster. These tools get plugged into the web app, CPAs including, to collect data on how users interact with it. When a user runs into an error (something breaks, a network request fails, etc.), the tool recreates the collected data as a video in which developers can see every step the user took to get the error.

In addition, they get the stack traces of JavaScript and server errors, details of failed network requests, and debug messages. SessionStack is one such tool with a couple of more solutions that sprung up in the last few months.

Image title

A SessionStack user session recording. All user actions and tech details can be expanded on the left.

Topics:
performance ,bugs ,error tracking

Published at DZone with permission of Antonia Bozhkova, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}