How to implement code with long execution time in React Native with Expo?

How to / Third Party Tooling
1

I’m building a new app with React Native and Expo.
The main function of this app is to generate plans for user.
The generating algorithm will take estimated around 300-500 seconds to execute. (It contains maximum 2,100,000 times of random generating.)

Currently I am facing two problems:

Q1. during testing, this piece of code is put in the App.js - App class - render function directly. however, it seems that if the execution time exceeds 32 seconds the app will just fail to render and stay no response forever.

So the question is:

1.1 what’s the reason of the maximum 32 seconds otherwise no response?

1.2 are there better ways to do testing?

Current testing method:

export default class App extends React.Component {
  componentDidMount() {
    if (__DEV__) {
      Reactotron.connect();
      Reactotron.log('hello rendering world');
    }
  }

  render() {
    //test
    generatePlan(store.getState(), 0);

    return (
      <Provider store={store}>
        <AppContainer />
      </Provider>
    );
  }
}

Q2. at the end, it’s not possible to let user keep dazing such a long time after click an “generating” button. So ideally, this long executing task should be running in the background with limited resource (both memory and calculating), so that the user can do other things during waiting without too much being influenced(like a virus scanning task, once it finishes, pops up a message, etc.)

So the question here is:

how to implement this?

What I have tried:

For Q1:
currently I have no idea about the reason and even can’t figure out the accurate key words to search.
(I tried search “react native long execution time”, “no response”, etc in google, react native github issue, Expo forum, but no luck.)

currently my idea to do testing is to execute each part separately and manually store the result of each part. Then do the final part with the stored result of each part.

For Q2:
There is a library “react-native-background-task”:

“This library allows the scheduling of a single periodic task, which executes when the app is in the background or closed, no more frequently than every 15 minutes. Network, AsyncStorage etc can be used (anything except UI), so perfect for things like a background data sync for offline support.”

But there are two questions about this potential solution:

a. how to run task in the background when the app is open?

b. how to limit the calculating resource used by this task?
(as the task can be executed slowly, but it shouldn’t occupy too much calculating resource if the user is still using the mobile phone.)

1 Like