Announcing Session Replay for Mobile – in Open Beta

Session Replay for iOS, Android, and React Native is now in open beta. If you already know what Session Replay is, amazing – click the link and update your SDK to start getting video-like reproductions of where your users are experiencing rage-inducing issues.

If you don’t know what I’m talking about, even better. Let me tell you a story.

Crashes, jank, and general unresponsiveness lead to one ⭐ reviews, which leads to people uninstalling, which leads to PMs pitching growth hacks, and no one wants that. How do you get ahead of these shenanigans?

Last year, we launched the ability to capture totally anonymized video-like reproductions of a user session for web apps – Session Replay for web-based applications. Today, over 40,000 teams have been using it to debug everything from broken checkout experiences, slow loading pages, and unexpected crashes. Turns out it’s pretty helpful – who would have thought that actually seeing what the problem is would make debugging it easier 😉. Mobile developers (who provided 400+ upvotes on GitHub and were responsible for 500+ early adopter sign-ups) want this capability too. So here we are. Session Replay for mobile is now in open beta and free to use for early adopters.

Bridging the gap between code and UX

Session Replay for mobile expands the visibility into your mobile application by giving you a visual reproduction of a user session on your app, so you can understand when, where, and how an error is impacting your app without having to repro it yourself or talk to a customer. With Replay, you get the play-by-play of your user’s journey with gestures such as taps and pinch to zoom included in the replay view, helping you better understand user interactions and identify where jankiness occurs on your app. And we don’t just show you the playback – Replay also includes debugging context such as device tags, network requests details, and thrown exceptions that help you decipher what’s happening behind the scenes to get to the root of the problem.

As with all of our products, Session Replay is integrated within the Sentry workflow. You can watch relevant replays while inspecting the stack trace in Issue Details or watch a replay from the user who submitted a bug report through User Feedback. And, you can configure your sampling settings to only capture a replay when an error occurs to reduce your data ingestion. You can also assess how severe an issue is depending on the impact on the UI or how the user responded (e.g. did they close the app?).

Confirming the root cause of a mobile error

With Sentry’s Session Replay for mobile, you have the option to prioritize sampling sessions when your users encounter an error. This means that when a crash happens, you’ll have the associated replays from real users who encountered that specific error conveniently linked to the relevant Sentry issue on the Issue Details page. By seeing what happened before, during, and after an error occurred with useful context such as OS version and name, you’ll be able to quickly pinpoint how the error happened and how large of an impact it had on your users. Plus, with sampling on error, you’ll spend less time waiting for the data you need and less anxiety monitoring your event quota.

Let’s say you’re developing a fancy lifestyle app that uses gamification and focuses heavily on UX, and has great illustrations and animations. Your Application Performance Monitoring (APM) product alerts you to an emerging crash in a third-party library. Here’s how you could use Session Replay to investigate and resolve this issue:

1. Identify the error: In your error tracking system, you analyze the recurring crash with the error message “NullPointerException in run_animation()“. The stack trace points to a third-party animation library you use, but you don’t understand the implication.
2. Find relevant session replays: You filter the replays to show only those associated with this specific crash.
3. Watch the replay: You select one of the replays, and it starts at a screen that congratulates the user on completing an achievement and awards them achievement points. While the (rather lengthy) rewards animation plays, the user taps on the “Next” button, causing the app to crash.
4. Inspect console logs: In the console logs, you notice an entry from the animation library about calling the “onAnimationCancelled” callback – you realize you missed to implement this callback.
5. Fix and verify: You implement the missing callback. For good measure, you also shorten the animation duration. After deploying the update, you monitor the number of crashes declining as they update their apps.

In this example, Session Replay allows you to visualize the exact user actions leading to the crash, identify the missing callback in the animation library as the root cause of your error, and implement a targeted fix to resolve this issue. Without Session Replay, it would have been much more challenging to understand the precise sequence of events and pinpoint the origin of this crash, potentially leading to a longer debugging process and delayed resolution.

Identifying pain points on your app

Misleading labels, broken links, permission issues – sometimes your user hits an issue that doesn’t fire an exception, but it still impacts the user experience. Session Replay can help you identify where these pain points occur in your app by seeing where your users get stuck or drop off.

Let’s say you’re developing a mobile e-commerce app, and you’ve received an increasing number of bad reviews claiming that the app becomes unresponsive during checkout. Here’s how you could use Session Replay to investigate and resolve this issue:

1. You suspect a performance problem in your app. However, your performance KPIs are still good, and the APM product doesn’t show a problem on the checkout screen.
2. Find relevant session replays: You filter the replays to show only those associated with the checkout screen, also focusing on replays with longer durations.
3. Watch the replay: You select one of the replays and observe the user’s actions. You see the user tapping the “Next” button on the check out page, which starts an API call to your server.
4. Review network requests: Examining the network tab, you see that the API call finishes successfully and in a reasonable amount of time. You now know this is not the root cause.
5. Inspect breadcrumbs: You notice a very recent state change in your app’s UI state management, causing a state conflict and the UI not to update after the API call returned. At this point, the user rage clicks and eventually terminates the app.
6. Fix and verify: You implement a fix to handle the UI state management bug. After deploying the update, you monitor subsequent session replays to confirm that users can now proceed during the checkout process—all without having to talk with customers or go through support tickets.

Our privacy-first approach

We are private by default, which means we redact all text and images out of the box before it leaves your user’s device so you can ensure that your users’ PII is fully protected. In Sentry, developers have the option to opt into content.

How to get started with Mobile Replay

Mobile Replay is currently free for any Sentry customer to use during the open beta period. We currently support Android, iOS, and React Native and will extend support to Flutter and other frameworks over the next few months.

To set it up:

• Head to your Sentry org
• Log into your mobile project
• Follow the set up instructions in these docs
  • Configure your sampling and privacy settings
• Start seeing replays in the Issues stream and on the Replays tab under Explore

Have questions? Head to our docs for details around configuration or get in touch with us on GitHub. If you don’t have a Sentry account yet, you can try it for free or request a demo to get started.

P.S. Remember to sign up for our workshop for an end-to-end product overview of Session Replay for mobile and more – happening on July 31st.