React native, prosta aplikacja laguje na androidzie

Question

Witam, chcę zrobić swoją pierwszą aplikację w react native. Odpalam ją przez expo i zauważyłem spore lagi przy czynnościach typu wpisywanie liter w inputach, przy scrollowaniu, czy klikaniu buttonów. No generalnie cała aplikacja zacina. 

Od razu mówię, nie jest to wina kodu bo przy tworzeniu nowego projektu laguje nawet defaultowy kod aplikacji. Tutaj właśnie on delikatnie zmieniony:

import { StatusBar } from "expo-status-bar";
import React from "react";
import { StyleSheet, Text, View, TextInput } from "react-native";

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Home</Text>
      <TextInput style={styles.searchInput} />
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    paddingTop: 20,
  },
  searchInput: {
    marginTop: 200,
    borderWidth: 1,
  },
});

aktualizowałem expo-cli, wyłączyłem remote debug i próbowałem odpalić na ios'ie (tam jest ok, czyli problem jest tylko na androidzie, bądź moim telefonie(?)). 

Zauważyłem też, że usuwając <StatusBar> po automatycznym refreshu status bar robi się czarny, tak jakby odseparowany od aplikacji i aplikacja działa tak jak powinna, bez lagów. Jednak to chyba jakiś bug bo po manualnym refreshu status bar ponownie przybiera kolor backgroundu i aplikacja zacina. 

Coś pominąłem, coś robię źle, czy o co chodzi bo już nic nie rozumiem dlaczego tak się dzieje?

Z góry dziękuje za pomoc :)

Comments

Której wersji React Native używasz?

---

@ScriptyChris,  

To mój package.json:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "expo": "~39.0.2",
    "expo-status-bar": "~1.0.2",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-39.0.3.tar.gz",
    "react-native-web": "~0.13.12"
  },
  "devDependencies": {
    "@babel/core": "~7.9.0"
  },
  "private": true
}

 

---

Google rzuca sporo wyników dotyczących tego problemu - warto tam poszukać. Spodziewałem się, że powód jest prosty i może dotyczyć specyficznej wersji React Native, ale to może być też wina np. włączonego trybu debugowania. Skoro dodatkowo twierdzisz, że to nie jest kwestia kodu, bo nawet na domyślnym boilerplacie projektu jest to samo, to trzeba po prostu szukać i próbować różnych rozwiązań. Albo poczekać, może ktoś mający doświadczenie w tym frameworku pomoże.

---

@ScriptyChris, 

Właśnie sporo googlowałem na ten temat. Tryb debugowania też miałem cały czas wyłączony, ale gdy go już włączyłem wyskoczyły mi takie błędy: 

Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``: 

None of these files exist:
  * debugger-ui\debuggerWorker.cff11639.js(.native|.native.expo.ts|.expo.ts|.native.expo.tsx|.expo.tsx|.native.expo.js|.expo.js|.native.expo.jsx|.expo.jsx|.native.ts|.ts|.native.tsx|.tsx|.native.js|.js|.native.jsx|.jsx|.native.json|.json|.native.wasm|.wasm)
  * debugger-ui\debuggerWorker.cff11639.js\index(.native|.native.expo.ts|.expo.ts|.native.expo.tsx|.expo.tsx|.native.expo.js|.expo.js|.native.expo.jsx|.expo.jsx|.native.ts|.ts|.native.tsx|.tsx|.native.js|.js|.native.jsx|.jsx|.native.json|.json|.native.wasm|.wasm)
    at ModuleResolver.resolveDependency (D:\reactNative\performanceTest\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (D:\reactNative\performanceTest\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (D:\reactNative\performanceTest\node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
    at D:\reactNative\performanceTest\node_modules\metro\src\lib\transformHelpers.js:267:42
    at Server.<anonymous> (D:\reactNative\performanceTest\node_modules\metro\src\Server.js:841:41)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (D:\reactNative\performanceTest\node_modules\metro\src\Server.js:99:24)
    at _next (D:\reactNative\performanceTest\node_modules\metro\src\Server.js:119:9)

może to przez te błędy, a może przez update react native, który wydaje mi się, że jakoś niedawno robiłem?
Teraz znowu googlowałem o tych błędach i nie widzę jakiegoś klarownego rozwiązania tego problemu, próbowałem kilka rozwiązań z forów to teraz apka w ogóle nie startuje tylko pojawia się ten błąd xD Powoli tracę cierpliwość...

 

---

Tryb debugowania też miałem cały czas wyłączony

To trochę dziwne, bo błąd dotyczy modułu dubuggera. :P Może w jakichś ustawieniach/konfiguracji/parametrach masz to uruchomione? Albo debugowanie jest domyślnie włączone i trzeba je explicitly wyłączyć w konfiguracji?

---

@ScriptyChris, tylko właśnie błąd pojawia się wtedy kiedy włączam Remote debug, jeśli nie mam włączonej tej opcji błąd się nie pojawia, ale aplikacja działa tak samo wolno jak przy włączonym remote debugu. No nic poszukam jeszcze jakichś informacji na ten temat.