SoLoader error using App Bundle
  • 14-May-2023
Lightrun Team
Author Lightrun Team
Share
SoLoader error using App Bundle

[ANDROID] SoLoader error using App Bundle

Lightrun Team
Lightrun Team
14-May-2023

Explanation of the problem

A critical issue has been identified in our Android app bundle, resulting in frequent crashes experienced by approximately 200 users on a daily basis. However, reproducing this bug has proven to be challenging. The error message associated with the crash is as follows:

This error has multiple variations and occurs on different Android versions. Here are a few examples:

  • Fatal Exception: java.lang.UnsatisfiedLinkError: Couldn’t find DSO to load: libreactnativejni.so caused by: Couldn’t find DSO to load: libfb.so caused by: Couldn’t find DSO to load: libgnustl_shared.so caused by: dlopen failed: “/data/data/com.traveloka.android/lib-0/libgnustl_shared.so” is 64-bit instead of 32-bit.
  • Fatal Exception: java.lang.UnsatisfiedLinkError: Couldn’t find DSO to load: libreactnativejni.so caused by: Couldn’t find DSO to load: libfb.so caused by: Dynamic section string-table not found.
  • Fatal Exception: java.lang.UnsatisfiedLinkError: Couldn’t find DSO to load: libreactnativejni.so.

Troubleshooting with the Lightrun Developer Observability Platform

Getting a sense of what’s actually happening inside a live application is a frustrating experience, one that relies mostly on querying and observing whatever logs were written during development.
Lightrun is a Developer Observability Platform, allowing developers to add telemetry to live applications in real-time, on-demand, and right from the IDE.

  • Instantly add logs to, set metrics in, and take snapshots of live applications
  • Insights delivered straight to your IDE or CLI
  • Works where you do: dev, QA, staging, CI/CD, and production

Start for free today

Problem solution for [ANDROID] SoLoader error using App Bundle

The reported issue pertains to crashes occurring in an Android app that uses app bundles. The error message indicates a java.lang.UnsatisfiedLinkError, specifically mentioning the inability to find the libreactnativejni.so dynamic shared object (DSO). This error is encountered during the loading process of native libraries required by the app. The crashes have been observed in multiple variations and on different Android versions. With a daily occurrence of 200 crashes, it becomes crucial to identify the root cause and provide a solution to prevent the app from crashing.

One proposed solution involves modifying the app’s build.gradle file to include packaging options that address the issue of missing DSO files. By using the pickFirst directive within the packagingOptions block, specific shared libraries, such as libc++_shared.so and libjsc.so, are selected to be included in the build. This ensures that only the first occurrence of these libraries is retained, mitigating conflicts that may arise from duplicate library entries. The provided code block demonstrates how to add the packaging options to the android block in the build.gradle file.

Additionally, another potential solution involves performing a clean build of the Android project. This can be achieved by navigating to the android/ directory within the project and running the command ./gradlew clean. This command cleans the build artifacts, ensuring that the subsequent build process starts with a clean slate. By doing so, it resolves any potential inconsistencies or conflicts that may have occurred in the previous build. Running this command is suggested as a complementary step to address the crash issue caused by the unsatisfied link error.

Other popular problems with React Native

Problem: Package Version Conflicts

One of the most common problems faced by React Native developers is version conflicts between different packages. React Native uses a large number of packages, and sometimes, updates to these packages can cause compatibility issues with other packages.

Solution:

To resolve these conflicts, developers need to identify which packages are causing the issue and update them to compatible versions.

Example: 
If you are encountering a version conflict with react-native-vector-icons, you can update the version in your package.json file as follows:

"dependencies": {
  "react-native-vector-icons": "^6.6.0"
}

Then run the following command to install the updated package:

npm install react-native-vector-icons@latest

Problem: Issues with Xcode and iOS Builds

Another common problem faced by React Native developers is related to building the iOS app using Xcode. The build process can sometimes fail due to issues with the Xcode project configuration or with the React Native dependencies.

Solution:

To resolve these issues, developers need to troubleshoot the Xcode project and make sure all dependencies are correctly installed and configured.

Example: 
If you are encountering build errors related to CocoaPods, you can try the following steps to resolve the issue:

1. Update CocoaPods to the latest version
2. Run the following command in your iOS project directory:

pod install

3. Clean your Xcode build folder by holding down the option key and clicking on the "Product" menu, then "Clean Build Folder".

4. Restart Xcode and build the project again.

Problem: Debugging Issues with the JavaScript Debugger

React Native comes with a built-in JavaScript debugger, but sometimes, it can be difficult to get it working correctly. Debugging issues can arise due to incorrect setup, incorrect configuration, or compatibility issues with other tools.

Solution:

To resolve these issues, developers need to make sure the JavaScript debugger is correctly set up and configured, and also try using alternative debugging tools if necessary.

Example: 
If you are encountering issues with the React Native JavaScript debugger, you can try the following steps to resolve the issue:

1. Make sure the debugger is correctly set up in your React Native app by following the instructions in the official React Native documentation.

2. Try using a different JavaScript debugger, such as React Native Debugger or Chrome DevTools.

3. If all else fails, try adding console.log statements to your code to isolate the issue.

A brief introduction to React Native

Facebook React Native is a popular open-source platform for developing cross-platform mobile applications. It enables developers to build high-quality, native-feeling apps for both iOS and Android using a single codebase written in JavaScript. React Native uses native components rather than WebViews to create a more performant and seamless user experience.

React Native leverages the power of React, Facebook’s JavaScript library for building user interfaces, to create mobile applications. This allows developers to reuse their knowledge and skills from web development to build robust and scalable mobile applications. React Native also provides a wide range of ready-to-use components and APIs, reducing the amount of custom code that developers have to write. In addition, React Native provides a hot reloading feature that allows developers to see changes in the app in real-time without having to rebuild the entire project. This speeds up the development process and enables developers to focus on delivering great user experiences.

Most popular use cases for React Native

  1. Cross-Platform Mobile App Development: Facebook React Native can be used for developing cross-platform mobile applications for both iOS and Android operating systems, with a single codebase. This reduces development time and increases productivity, as developers don’t need to maintain separate codebases for each platform.
  2. Complex User Interfaces: Facebook React Native allows developers to create complex and interactive user interfaces with high performance and smooth animations, which are crucial for modern mobile applications. For example, you can use code like the following to create a custom UI component with state updates and animations:
import React, { useState } from 'react';
import { Animated, Text, View } from 'react-native';

const FadeInView = (props) => {
  const [fadeAnim] = useState(new Animated.Value(0))  // Initial value for opacity: 0

  React.useEffect(() => {
    Animated.timing(
      fadeAnim,
      {
        toValue: 1,
        duration: 10000,
      }
    ).start();
  }, [])

  return (
    <Animated.View                 // Special animatable View
      style={{
        ...props.style,
        opacity: fadeAnim,         // Bind opacity to animated value
      }}
    >
      {props.children}
    </Animated.View>
  );
}

export default function App() {
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
      <FadeInView style={{width: 250, height: 50, backgroundColor: 'powderblue'}}>
        <Text style={{fontSize: 28, textAlign: 'center', margin: 10}}>Fading in</Text>
      </FadeInView>
    </View>
  );
}
  1. Building Mobile Applications with Complex UI: React Native enables developers to create mobile applications with complex user interfaces. The framework provides a wide range of UI components and APIs that help to design and render interactive and visually appealing applications. These components can be easily styled and customized, making it possible to create a unique and immersive user experience. The following code block demonstrates how to use React Native’s built-in components to build a custom UI:
import React, { Component } from 'react';
import { View, Text, StyleSheet } from 'react-native';

class MyApp extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.text}>Welcome to my app!</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  },
  text: {
    fontSize: 20,
    fontWeight: 'bold'
  }
});

export default MyApp;

In this code example, the View component is used as a container to hold and display the text, while the Text component is used to render the text itself. The styles object is used to define the appearance of the components. This code demonstrates the simplicity and flexibility of React Native’s approach to building custom UI, which makes it a great choice for applications with complex user interfaces.

Share

It’s Really not that Complicated.

You can actually understand what’s going on inside your live applications.

Try Lightrun’s Playground

Lets Talk!

Looking for more information about Lightrun and debugging?
We’d love to hear from you!
Drop us a line and we’ll get back to you shortly.

By submitting this form, I agree to Lightrun’s Privacy Policy and Terms of Use.