Monitoring mobile applications

Instana supports mobile app monitoring by analyzing actual URL request times, which provides detailed insights into the app experience of users, and deep visibility into application call paths. The Instana app monitoring uses an iOS or Android agent. The agent is installed as a dependency on mobile apps.

End-User Monitoring (EUM) or Real-User Monitoring (RUM), is a vital tool for understanding the digital user experience with mobile apps.

Installing the agent for mobile app monitoring

To install the iOS agent, use Swift Package Manager (through Xcode) or CocoaPods.

iOS

To install the iOS agent, use Swift Package Manager (through Xcode) or CocoaPods.

Configuring the Instana iOS agent

Make sure that the following prerequisites are met before you install the iOS agent:

  • iOS 11 or later
  • Swift 5.1 or later

To add Swift Package Manager, complete the following steps:

  1. Open Xcode.
  2. Open your Xcode project.
  3. Select menu File > Add Package Dependencies....
  4. In the window that pops up, enter the repository https://github.com/instana/iOSAgent in the Search or Enter Package URL field. Then, select iosagent from the search result, and click Add Package.

To add CocoaPods, complete the following steps:

  1. Within your Podfile specification, add the commands:

    pod 'InstanaAgent', '~> 1.6.8'
    
  2. Download the dependencies, run pod install.

In the command, replace 1.6.8 with the latest iOS agent version that is listed in https://cocoapods.org/pods/InstanaAgent.

For more information about the setup process, see the iOS agent API.

Android

The Android agent is composed by a Gradle plug-in and an SDK library. Apply the plug-in to your application module and add the SDK as a dependency.

Make sure that the following prerequisites are met before you install the Android agent:

  • Android 4.1+ (API level 16+)
  • Java 8+
  • Gradle 7.3.3+
  • AndroidX
  • targetSdk 33+

To use a Gradle version earlier than 7.3.3 in your project, use an Android agent version earlier than 6.0.0.

Adding the Instana Android plug-in

To add the Instana Android plug-in complete the following steps:

  1. In your project-level build.gradle file, add the following code:

Version 6.0.13 is used as an example in the following snippet. To find the latest Instana agent version, refer to https://mvnrepository.com/artifact/com.instana/android-agent-runtime.

buildscript {
   ext {
        instanaAgentVersion = "6.0.13"
    }
   repositories {
        google()
        mavenCentral()
    }
   dependencies {
      classpath "com.instana:android-agent-plugin:$instanaAgentVersion"
    }
}
  1. In your module (app-level) Gradle file (usually app/build.gradle) after you apply the com.android.application plug-in, add the following code:
apply plugin: 'com.android.application'
apply plugin: 'com.instana.android-agent-plugin'

Adding Instana Android SDK

To add the Instana Android SDK, complete the following steps:

  1. In your project-level build.gradle file, add the following code:
allprojects {
    repositories {
        google()
        mavenCentral()
    }
}
  1. In your module (app-level) Gradle file (usually app/build.gradle), add the following code:
dependencies {
    implementation 'com.instana:android-agent-runtime:$instanaAgentVersion'
}
  1. If your minSdkVersion is earlier than 24, in your module (app-level) Gradle file (usually app/build.gradle), add the following code:
android {
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}
  1. Optional: Request READ_PHONE_STATE permission. When a user accesses the internet through a cellular network, the Instana agent can report the specific type of cellular network.

To enable reporting of the cellular network type, your app needs to request the READ_PHONE_STATE permission. For more information about requesting permissions, see the Request App Permissions section in the official Android documentation.

If your app doesn't request the permission or if the user declines the permission, the Instana agent does not report the cellular network type. In your class, which extends Application, replace YOUR_REPORTING_URL and YOUR_APP_KEY with the configuration values you find in your Instana Dashboard:

class MyApplication : Application() {
    override fun onCreate() {
        super.onCreate()
        Instana.setup(
            this,
            InstanaConfig(
                key = "YOUR_APP_KEY",
                reportingURL = "YOUR_REPORTING_URL"
            )
        )
    }
}

Basic initialization is completed in this step. For a complete list of initialization options, view tracking, and other options, see the Android agent API.

Adding the Instana React Native agent

The React Native agent brings support for both Android and iOS platforms.

Review the prerequisites that are listed in Instana React Native Agent.

Adding the dependency

To configure the Instana React Native agent, complete the following steps:

  1. Add dependence, run the following command in your project's root:
npm install @instana/react-native-agent --save
  1. In your class App.js file, replace YOUR_INSTANA_APP_KEY and YOUR_INSTANA_REPORTING_URL with the configuration values you find in your Instana Dashboard:
export default class App extends Component {
  componentDidMount() {
    Instana.setup(YOUR_INSTANA_APP_KEY, YOUR_INSTANA_REPORTING_URL, null);
  }
}

Basic initialization is completed in this step. For a complete list of initialization options, view tracking, and other options, see the React Native agent API.

Considerations for using Read Native agent

  • To prevent the Instana agent-tracing communication with the Metro bundler, add http://localhost:8081 to the ignored URLs list:
Instana.setIgnoreURLsByRegex(['http://localhost:8081.*']);
  • To support iOS apps, your project must contain at least one Swift file (it can be empty). If you don't have any Swift files, open your Xcode Project in <YourReactNativeProject>/ios then add an empty Swift file. Xcode creates the Bridging Header for you.

  • To support Android apps, use the Instana Android plug-in version appropriate for your React Native version:

    • For React Native 0.63.3 or earlier, use Instana Android plug-in 1.5.3
    • For React Native 0.63.4 or later, use Instana Android plug-in 5.2.2

Enable automatic HTTP monitoring:

Your project must contain at least one Swift file. The Swift file can be empty.

If you don't have any Swift files, open your Xcode Project in <YourReactNativeProject>/ios then add an empty Swift file. Xcode creates Bridging Header for you.

Android

Every version of the Instana React Native agent is compatible with a specific version of the Instana Android plug-in. Version 6.0.13 is used as an example in the following snippet. Use the latest Instana Android plug-in version that is compatible with your React Native version. To find the latest version, see Supported React Native versions

Follow these steps to enable automatic HTTP monitoring:

  1. In your /android/build.gradle file, add the following code:

    buildscript {
        ext {
            INSTANA_ANDROID_PLUGIN_VERSION = "6.0.12"
        }
        dependencies {
            classpath "com.instana:android-agent-plugin:$INSTANA_ANDROID_PLUGIN_VERSION"
        }
    }
    
  2. In your /android/app/build.gradle file, add the following code:

    apply plugin: 'com.android.application'
    apply plugin: 'com.instana.android-agent-plugin'
    
fetch(url)

If your app uses fetch to complete network requests, you might find your app crashes on runtime whenever fetch is used: No virtual method toString(Z)Ljava/lang/String;

This problem is fixed by the React Native issues (27250 and 28425). If you encounter this problem, you can apply the following workaround.

In your Android module-level Gradle file (usually app/gradle.build), add the following code:

dependencies {
    implementation "com.squareup.okhttp3:okhttp:4.3.1"
    implementation "com.squareup.okhttp3:okhttp-urlconnection:4.3.1"
}
Execution failed for task ':app:transformClassesWithDexBuilderForDevDebug'

If you upgraded to React Native 0.63.4 from a previous version, check that you are using,

  • The compatible Instana Android plug-in version that is listed at https://www.npmjs.com/package/@instana/react-native-agent.
  • For Gradle 7.3.3 and later, refer to distributionUrl=https\://services.gradle.org/distributions/gradle-7.3.3-bin.zip in android/gradle/wrapper/gradle-wrapper.properties
  • For Android Gradle plug-in 7.2.2 and later, refer to classpath("com.android.tools.build:gradle:7.2.2") in android/build.gradle

Flutter

The Flutter agent brings support for both Android and iOS platforms.

The Flutter agent does not provide automatic HTTP tracing. HTTP tracing must be manually set up by the developer (an example is provided in this documentation).

Make sure that the following prerequisites are met before you configure the Flutter agent:

  • Flutter version 1.20.0 or later
  • Dart version between 2.12.0 and 3.0.0

Adding the package to your app

The Instana agent Flutter package is available from pub.dev.

To add the package to your app, complete the following steps:

  1. Open the pubspec.yaml file located inside the app folder, and then add instana_agent: in dependencies.

  2. Install the package, by using one of the following methods:

    • From the console: Run flutter pub get
    • From Android Studio or IntelliJ: Click Packages get in the action ribbon of pubspec.yaml
    • From VS Code: Click Get Packages in the action ribbon ofpubspec.yaml

Initializing the Instana agent

Import the package in your dart files:

import 'package:instana_agent/instana_agent.dart';

Stop and restart the app, if necessary.

Set up Instana as soon as possible. For example, in initState(), add the following code:

@override
  void initState() {
    super.initState();
    InstanaAgent.setup(key: 'YOUR-INSTANA-KEY', reportingUrl: 'YOUR-REPORTING_URL');
  }

If you want to build apps for iOS, set up a platform version in ${appFolder}/ios/Podspec with a minimum value of 11.0.

Tracing View changes

After the Instana agent is initialized, add InstanaAgent.setView('Home');:

import 'package:instana_agent/instana_agent.dart';

[...]

InstanaAgent.setView('Home');

Tracing HTTP requests

After the Instana agent is initialized, start capturing HTTP requests:

import 'package:instana_agent/instana_agent.dart';

[...]

InstanaAgent.startCapture(url: 'https://example.com/success', method: 'GET').then((marker) => marker
    ..responseStatusCode = 200
    ..responseSizeBody = 1000
    ..responseSizeBodyDecoded = 2400
    ..finish());

Create your own InstrumentedHttpClient extending http.BaseClient as shown in the following example:

class _InstrumentedHttpClient extends BaseClient {
   _InstrumentedHttpClient(this._inner);

   final Client _inner;

   @override
   Future<StreamedResponse> send(BaseRequest request) async {
      final Marker marker = await InstanaAgent.startCapture(url: request.url.toString(), method: request.method);

      StreamedResponse response;
      try {
         response = await _inner.send(request);
         marker
            ..responseStatusCode = response.statusCode
            ..responseSizeBody = response.contentLength
            ..backendTracingID = BackendTracingIDParser.fromHeadersMap(response.headers);
      } finally {
         await marker.finish();
      }

      return response;
   }
}

class _MyAppState extends State<MyApp> {

   [...]

   Future<void> httpRequest() async {
      final _InstrumentedHttpClient httpClient = _InstrumentedHttpClient(Client());
      final Request request = Request("GET", Uri.parse("https://www.ibm.com/products/instana"));
      httpClient.send(request);
   }

   [...]
}

Dashboards

Summary

The main dashboard summarizes all the important data at a glance.

Dashboard Overview

HTTP requests

Learn which of your HTTP requests are slow or problematic. Selecting a specific origin provides an insight into throughput and latency, and error rates and latency breakdown.

HTTP Request Details

Crashes

You can view the error messages that are generated for app crashes. The crashes are grouped by the error message. To view the details of the crash, click an error message. The details include the number of crashes, number of impacted users, views, error messages, stack trace, app versions, operating system, and name of the device on which the crash occurred. Analyzing crashes provides insight into the stability and performance of your mobile app. To view the raw trace of all the active threads, click All Threads. To view the following details of the crashed threads, click Crashed Threads:

  • Memory address
  • Image class
  • File name
  • Function name
  • Line number of the code in the file

The Crashed Threads button is enabled only after you upload the dSYM files for the iOS app or mapping files for the Android app. To upload the files, see Uploading dSYM files and Uploading mapping files.

Details

Views

Often it's important to isolate specific views and analyze their performance, which is also a great way to find the view with the most traffic. Select a specific view to display all the metrics for the view.

Details

Custom events

You can view the list of custom events on the Custom Events tab. Select an event to view all the related metrics.

Custom Events

Smart Alerts

View a list of all your configured Smart Alerts. Click an alert to view its configuration, modify it, or view its revision history. If required, you can also disable or remove the alert.

For more information about how to add an alert, see Smart Alerts.

Analytics

Similar to analytics capabilities for traces and calls, you can use Analytics for mobile app monitoring data to answer specific questions that aren't covered by any preconfigured dashboards. For more information on Analytics, see Working with Unbounded analytics.

A single piece of app monitoring data is called a beacon. A few beacon types exist, that is, session start and HTTP requests. You can access every beacon in Analytics. You can use the beacon data to filter and group traces and calls. The default grouping depends on the selected beacon type. You can remove groupings to inspect the individual beacon that matches the filters.

Details

Geographic data

Instana maps user IP addresses to geographic details based on the GeoLite2 database, which is provided by MaxMind. The IP addresses are collected by using the reverse proxy server. For self-hosted installation, configure the URL of the user monitoring endpoint as the reporting URL for the agent. If the reporting URL for the agent is not configured, the IP addresses are not collected, and the related geographic details information is not available.