Search code examples
sentry

What should be an transaction in Sentry for React application

The concept of transaction is explained briefly here in the Sentry documentation

enter image description here

And also here https://docs.sentry.io/product/performance/transaction-summary/

My question is: For a client side (React) application

Is It OK to make a transaction start at the time when a main/top-level component is created/rendered and end when it is destroyed, knowing that, the user may spend lots of time not interacting with the browser/component and no code is running? - Or that is not the designed purpose of transaction

Solution

  • Hopefully it’s not too late, but might be interesting for others finding the question:

    No, that’s not the designed purpose of a transaction. In another part of the Sentry documentation there’s a more detailed explanation with some examples (highlights are mine):

    A trace represents the record of the entire operation you want to measure or track - like page load, an instance of a user completing some action in your application, or a cron job in your backend. When a trace includes work in multiple services, such as those listed above, it's called a distributed trace, because the trace is distributed across those services.

    Each trace consists of one or more tree-like structures called transactions, the nodes of which are called spans. In most cases, each transaction represents a single instance of a service being called, and each span within that transaction represents that service performing a single unit of work, whether calling a function within that service or making a call to a different service.

    In your client-side application you might be more interested in measuring e.g. (in the case of React) the time it takes for a component being mounted until data is loaded and the first rendering is finished. Your transaction could be the rendering of the component, consisting of multiple spans (mounting, fetching data, rendering).

    In theory you can do of course what you want to do and Sentry allows you to have these long running transactions, check e.g. the option maxTransactionDuration when setting up instrumentation (it’s 10min as default, so your example might work).

    If you want to know how long people stay on one screen/in one widget/view and how they’re interacting with it, a classic tracking system where you can collect these events might be more what you want and need.