Network

This page helps you get started with Luciq's network performance monitoring on iOS, and customize URLs grouping for React Native apps.

Getting Started

To allow our Luciq App Performance Monitoring to monitor your network requests, you will need to follow these steps.

GraphQL Support

Luciq officially supports capturing and aggregating GraphQL requests made using Apollo.

In order to enable this, follow the network monitoring steps mentioned in the getting started section.

The below sample code snippet should be added after Luciq is initialized in order for the SDK to be able to track GraphQL requests made using Apollo.

JavaScript

apollo-setup.js

import { ApolloClient, HttpLink, ApolloLink, InMemoryCache, from } from 'apollo-boost';
import { NetworkLogger } from '@luciq/react-native';

//Setting up the handler
const LCQApolloLink = new ApolloLink(NetworkLogger.apolloLinkRequestHandler);

//Sample code
const httpLink = new HttpLink({ uri: 'https://example.com/api' });
const client = new ApolloClient({  cache: new InMemoryCache(),  link: from([LCQApolloLink, httpLink])});

If you're currently using a client other than Apollo, please feel free to reach out to our support team to verify support and add it to our backlog.

Payload Size

By default, Luciq captures the payload size of the request and response; this should help with determining if the payload size could be causing any issues with network delays. The payload size is the size of the payload itself, so it does not include the header's size.

Luciq automatically buckets payload sizes into different buckets based on the distribution of the data per network group, with a minimum sensitivity of 10 bytes per bucket.

URL Patterns

URL patterns are used to group the relevant network call occurrences and aggregate their numbers. Let's take the following examples:

• sample.com/list/3/item/1

• sample.com/list/3/item/2

• sample.com/profile/

It looks like 1 and 2 are the same request, but asking for different resources. While 3 is an entirely different one. Those three examples result in the following 2 URL patterns:

• sample.com/list/*/item/*

• sample.com/profile/

What Are the URL Pattern Components?

• Plain text: works with exact string matching

• *: matches with any URL part. * matches with only one part at a time. For example if you are mapping sample.com/part/variable1/variable2, your pattern should be sample.com/part/*/* and not sample.com/part/*

Does Luciq Detect Patterns Automatically?

Luciq automatically detects numbers and hexadecimal tokens in your URLs and replaces them with *.

Can You Create Custom Patterns?

If you are using more complex URLs where variable parts may contain plain text and not only numbers and hexadecimal, we recommend defining your custom patterns. Just click on the "Create URL pattern" button in your network list.

2880

Click on the highlighted action to create new URL patterns. URL patterns are used to group relevant network calls.

Here are a few examples:

URL pattern example	Matches with	Doesn't match with
sample.com/part1/part2	sample.com/part1/part2	sample.com/part1
sample.com/part1/*	sample.com/part1/part2	sample.com/part1/part2/part3
sample.com/part1/*/part3	sample.com/part1/part2/part3	sample.com/part1/part3/part4 sample.com/part1/part2/part3/part4
sample.com/part1/*/*/part4	sample.com/part1/part2/part3/part4	sample.com/part1/part2/part4 sample.com/part1/part2/part3/part4/part5
sample.com/part1/*/*/*	sample.com/part1/part2/part3/part4	sample.com/part1/part2/part3/part4/part5 sample.com/part1/part2/part3

Some notes to consider while creating your URL patterns:

• Custom URL patterns that you define have higher precedence than the auto-generated ones. If the same call matches with a custom and an auto pattern, it gets grouped with the custom.

• At any point, you can delete a pattern to prevent grouping new calls with it.

• URL patterns shouldn't overlap. Each incoming network call gets grouped with only one pattern. In case of conflict, it gets merged with the newest pattern.

Creating or deleting patterns doesn’t affect your old data that has already been grouped. It only affects the upcoming network requests.

Disabling/Enabling Network Performance Monitoring

iOS

When APM is enabled in your account, network monitoring works out of the box. If needed, you can disable it on iOS by calling the following API after initializing the SDK.

JavaScript

apm-ios-toggle.js

// Enable
APM.setNetworkEnabledIOS(true)

// Disable
APM.setNetworkEnabledIOS(false)

Please note that disabling network monitoring in APM on iOS will disable Network Logs in Bug Reporting and Crash Reporting as well.

Android

When APM is enabled in your account, network monitoring works out of the box. If needed, you can disable it on Android via the relevant flag in Luciq's Gradle plugin as described here.

Please note that, unlike iOS, disabling network monitoring in APM on Android will not disable Network Logs in Bug Reporting and Crash Reporting.