首页 > 解决方案 > 如何提高启动时间反应原生应用程序?

问题描述

我已经发布了适用于 IOS 和 Android 的应用程序。

但该应用程序的启动时间约为 5 秒。

我检测到它在 Routes 中加载第一个屏幕大约需要 5 秒

app.tsx 代码如下:

import React, {useEffect} from 'react';
import configureStore from './Store';
import {SafeAreaProvider} from 'react-native-safe-area-context';
import {Provider} from 'react-redux';
import {PersistGate} from 'redux-persist/es/integration/react';
import {NavigationContainer} from '@react-navigation/native';
import Routes from './configs/Routes';
import {navigationRef} from './services/NavigationService';
import {LocalizationProvider} from './locales/Translation';
import ModalContainer from './modules/ModalGlobal/containers/ModalContainer';
import NetInfoContainer from './containers/NetInfoContainer';
import {
  listenNotificationForeground,
  requestUserPermission,
} from './services/NotificationService';
import axios from 'axios';
import {removeCurrentSession} from './modules/Setting/service/SettingService';
import {UNAUTHORIZED} from './configs/Constants';

axios.interceptors.response.use(
  response => response,
  error => {
    const {status} = error.response;
    if (status === UNAUTHORIZED) {
      removeCurrentSession();
    }
    return Promise.reject(error);
  },
); // User for HTTP code difirrent 200 from axios

const App = () => {
  useEffect(() => {
    let listenBackground: any;
    async function _notificationHandle() {
      await requestUserPermission();
      listenBackground = listenNotificationForeground();
    }
    _notificationHandle();
    return listenBackground;
  }, []);

  return (
    <Provider store={configureStore().store}>
      <PersistGate loading={null} persistor={configureStore().persistor}>
        <SafeAreaProvider>
          <LocalizationProvider>     // Locale language
            <NetInfoContainer />     // Use to show lost connection
            <NavigationContainer ref={navigationRef}>
              <Routes />
            </NavigationContainer>
            <ModalContainer />      // Define global modal to use many routes
          </LocalizationProvider>
        </SafeAreaProvider>
      </PersistGate>
    </Provider>
  );
};

export default App;

我可以改进这段代码中的任何内容吗?或者有什么方法可以提高启动时间?

非常感谢!

标签: androidiosreact-nativeperformance

解决方案


对于 android,您可以通过在 app/build.gradle 上启用hermes来消除项目开始时的空白屏幕。Hermes 将 js 代码转换为 java 代码。如果您背叛了您的发行版 apk,在启用 hermes 后您只能看到 java 文件,并且会进行更改以减小应用程序的大小。完整的说明和文档见这个


推荐阅读