React-native-router-flux: एंड्रॉइड पर बेहद धीमा

समस्या मेरे पास android. शायद समुदाय मदद कर सकता है। क्या आपने डीबग करने का प्रयास किया है? यह घटक exNavigator के चारों ओर सिर्फ आवरण है। क्या ExNavigator Android पर अच्छा काम करता है?

@timsuchanek , क्या आपने इसे लाइव

अरे, हाँ मैंने डीबगर सक्षम किए बिना इसे आजमाया। लेकिन मुझे क्या मिला:
यदि इसे पहले ही एक बार खोला जा चुका है, तो यह बहुत तेज़ है।
केवल पहले 1-2 बार यह धीमा है।
मैं ExNavigator स्टैंडअलोन की जाँच करूँगा

अरे @timsuchanek इसकी रिपोर्ट करने के लिए धन्यवाद। क्या यह एनिमेशन के बिना धीमा है (यानी <Scheme> जिसमें कोई एनीमेशन कॉन्फिगर नहीं है)? मैं प्रदर्शन के लिए एनिमेशन से समझौता करने को तैयार हूं यदि बदतर स्थिति बदतर हो जाती है। मेरे पास Android भी नहीं है, नहीं तो मैं इसे स्वयं आज़माऊँगा।

मैं पुष्टि कर सकता हूं कि एंड्रॉइड 4.4 पर ऐप धीमा हो गया है (किसी भी रूट परिवर्तन के लिए बटन पर क्लिक करने में ~ 2s लगते हैं)। और पूर्व नेविगेटर उदाहरणों में एक ही समस्या नहीं है।

संपादित करें: क्रोम डिबगिंग को सक्षम करने के बाद देरी जादुई रूप से गायब हो जाती है -__________-

@sbycrosz क्या यह टैब बार या सभी पृष्ठों के लिए धीमा है?

मैं आज एंड्रॉइड पर इस लाइब्रेरी का परीक्षण कर रहा हूं और ऐसा लगता है कि जब तक मैं क्रोम डिबगिंग का उपयोग नहीं करता तब तक यह ठीक काम कर रहा है।

ऐसा लगता है कि टैब के बीच 'स्विच' एनिमेशन में देरी हो रही है। मैं इसमें देख रहा हूं।

मैंने टैब पर 'स्विच' का परीक्षण किया है, यह बहुत धीमा है, टैब बदलने के लिए लगभग 1.5s। मैंने क्रोम डीबग और लाइव रीलोड बंद कर दिया है, यह वही है।

क्या आप नवीनतम संस्करण की जांच कर सकते हैं? कृपया डिबग.जेएस के भीतर कंसोल लॉगिंग को अनकम्मेंट करें और जांचें।

मैंने एंड्रॉइड टैबलेट पर संस्करण 2.3.1 से उदाहरण ऐप को डीबग करने का प्रयास किया है। एनिमेशन बेहद धीमे थे।
यहाँ डिबग.जेएस के साथ कंसोल आउटपुट असम्बद्ध है
मैंने सरल ऐप (संस्करण 2.3.1 का उपयोग करके) का रिलीज़ बिल्ड भी बनाया और इसे सैमसंग गैलेक्सी एस 3 पर चलाया। फिर सब कुछ बहुत धीमा था।
हो सकता है कि "@ एक्सपोनेंट/रिएक्शन-नेटिव-नेविगेटर": "^ 0.3.5" को नवीनतम में अपडेट करने से यह ठीक हो जाएगा?

कृपया कोर एक्सनेविगेटर कोड जांचें

पावेल।

24 अप्रैल। 2016 अप्रैल, 21:18 को, कयामत की सूचनाएँ @github.com написал(а):

मैंने एंड्रॉइड टैबलेट पर संस्करण 2.3.1 से उदाहरण ऐप को डीबग करने का प्रयास किया है। एनिमेशन बेहद धीमे थे।
यहाँ डिबग के साथ कंसोल आउटपुट है। जेएस असम्बद्ध है
मैंने सरल ऐप (संस्करण 2.3.1 का उपयोग करके) का रिलीज़ बिल्ड भी बनाया और इसे सैमसंग गैलेक्सी एस 3 पर चलाया। फिर सब कुछ बहुत धीमा था।
हो सकता है कि "@ एक्सपोनेंट/रिएक्शन-नेटिव-नेविगेटर": "^ 0.3.5" को नवीनतम में अपडेट करने से यह ठीक हो जाएगा?

-
इस ईमेल का सीधे उत्तर दें या इसे GitHub पर देखें।

नमस्ते,

मुझे भी सुस्ती का अनुभव हो रहा है। हालांकि, जब क्रोम डिबगिंग सक्षम होता है, तो यह तेज़ होता है।
सिम्युलेटर (एंड्रॉइड और आईओएस) और भौतिक डिवाइस में व्यवहार वही होता है जब क्रोम डिबगिंग अक्षम होता है।

क्या समस्या को पूरी तरह से अलग करने के लिए "@ एक्सपोनेंट/रिएक्शन-नेटिव-नेविगेटर" को अक्षम करने के लिए वैसे भी है?

डोडी

नमस्ते,

मुझे भी यह समस्या थी, लेकिन मैंने इसे देव मोड को अक्षम करके हल किया।

यहाँ प्रतिक्रिया देशी जीथब पर मुद्दा:
https://github.com/facebook/react-native/issues/3049

मैंने एक और राउटर की कोशिश की और यह एंड्रॉइड पर बिल्कुल वैसा ही था। डेमो था
बहुत धीमी गति से। तो, मुझे यकीन नहीं है कि यह प्रतिक्रिया-मूल-राउटर-प्रवाह की बात आती है :)

टोनी

ले वेन। 26 फरवरी। 2016 à 03:10, doddys [email protected] एक écrit:

नमस्ते,

मुझे भी सुस्ती का अनुभव हो रहा है। हालाँकि, जब क्रोम डिबगिंग है
सक्षम है, यह तेज़ है।
सिम्युलेटर (एंड्रॉइड और आईओएस) और भौतिक डिवाइस में व्यवहार समान है
जैसे कि जब क्रोम डिबगिंग अक्षम हो।

वहाँ वैसे भी अक्षम करने के लिए "@ एक्सपोनेंट/प्रतिक्रिया-मूल-नेविगेटर" पूरी तरह से है
समस्या को अलग करने के लिए?

डोडी

-
इस ईमेल का सीधे उत्तर दें या इसे GitHub पर देखें
https://github.com/aksonov/react-native-router-flux/issues/199#issuecomment -189078772
.

नमस्ते,

मैंने अंत में पाया कि यह मेरे डिवाइस/सिम्युलेटर पर धीमा क्यों था। मैं अपनी ही गलती की वजह से था।
मैं reducers में एक कंसोल.लॉग (एक्शन) कर रहा था। यह धीमी चीजों को बहुत कुछ बदल देता है। खासकर जब डिवाइस पर निष्पादित किया जाता है। क्रोम डिबगिंग चालू होने पर यह ठीक था क्योंकि इसे क्रोम जावास्क्रिप्ट इंजन का उपयोग करके निष्पादित किया जाता है जो कि अधिक शक्तिशाली (लैपटॉप बनाम डिवाइस) है।

सभी लॉग (कार्रवाई) को हटाने के बाद, अब यह बहुत बेहतर है।

डोडी

@doddys मेरे लिए काम करता है

@doddys मैं अपने लकड़हारा मिडलवेयर में हूं😂😂

मैं इसे बंद करने जा रहा हूं। भविष्य के संदर्भ के लिए सुनिश्चित करें कि कोड में कहीं भी कंसोल.लॉग नहीं है, चाहे वह आपका रेडक्स मिडलवेयर हो या इस लाइब्रेरी के डिबग में

नमस्ते।
मैं इसका अनुभव कर रहा हूं। मैंने पूरे प्रोजेक्ट में कंसोल.लॉग पर सभी कॉल्स को हटाने की कोशिश की, देव मोड को बंद करने की कोशिश की, क्रोम डीबग का उपयोग करने/नहीं करने का प्रयास किया ... यहां तक ​​​​कि एक रिलीज एपीके बनाने और अपने प्रतिक्रिया-मूल-राउटर-फ्लक्स डेमो को चलाने की कोशिश की ... और समस्या अभी भी बनी हुई है।
ट्रांज़िशन कुछ समय के लिए ठीक लग सकता है लेकिन अगर आप नेविगेटर को आगे और पीछे जाकर ज़ोर देते हैं, तो ऐप अंततः धीमा हो जाएगा और कभी-कभी फ्रीज भी हो जाएगा।
संबंधित प्रतिक्रिया-मूल मुद्दे पर एक टिप्पणी है https://github.com/facebook/react-native/issues/3049#issuecomment -143505930 जो एक समाधान का वर्णन करता है।
Android प्रदर्शन के बारे में रिएक्ट नेटिव आधिकारिक नोट्स पर, इस समाधान का भी उल्लेख किया गया है: https://facebook.github.io/react-native/docs/performance.html#slow -navigator-transitions
क्या किसी तरह प्रतिक्रिया-मूल-राउटर-फ्लक्स पर इंटरेक्शनमैनेजर वर्कअराउंड को एकीकृत करना संभव होगा?
तब तक मुझे लगता है कि मैं वास्तव में एंड्रॉइड डिवाइस पर मॉड्यूल का उपयोग नहीं कर सकता, जो एक वास्तविक दया है।

मैं एक वास्तविक एंड्रॉइड डिवाइस और सिम्युलेटर दोनों के साथ आज के अपडेट किए गए उदाहरण की कोशिश कर रहा था और यह बस अनुपयोगी था।
मैंने नवीनतम react-native "react-native": "^0.25.1", का उपयोग करने के लिए package.json को अपडेट करने का प्रयास किया और अब यह बहुत सुचारू रूप से चलता है।

वास्तविक Android डिवाइस पर चलते समय जो है
यूएसबी में प्लग इन करने के लिए आपको निम्नलिखित चलाने की आवश्यकता है:
कमांड लाइन से।

$ react-native start
$ adb reverse tcp:8081 tcp:8081
$ react-native run-android

"जेएस देव मोड" बंद करें

आप यह सुनिश्चित करना चाहेंगे कि आप "जेएस देव मोड" को बंद कर
डिवाइस पर धीमी गति से चलेगा।

"रिएक्शन-नेटिव रन-एंड्रॉइड" चलाने के बाद आपको अपने डिवाइस को "शेक" करना चाहिए
मेनू लाने के लिए। "देव सेटिंग्स" चुनें और फिर "जेएस देव मोड" को अनचेक करें।

उसके बाद फिर से "रिएक्शन-नेटिव रन-एंड्रॉइड" चलाएं और यह अधिक होना चाहिए
कलाकार, कम से कम मैं आपके लिए आशा करता हूं :)

उपरोक्त ठीक नहीं हुआ। मेरा नेक्सस 6 अत्यधिक धीमी गति से चलता है डीबग में उपयोग नहीं किया जा सकता है।
कौन बता सकता है कि आप अपने Android संस्करण को कैसे डिबग करते हैं...
लंबे समय से समस्या का समाधान नहीं...

नेक्सस 5x के लिए भी तय नहीं है।

ऐसा लगता है कि RN (https://github.com/facebook/react-native/pull/10289) से एक पुल अनुरोध है जो JS थ्रेड से एनिमेशन को ऑफ़लोड करने के लिए नेविगेशन एक्सपेरिमेंटल को अपडेट करता है, जिससे इस समस्या का समाधान होना चाहिए।

हालांकि, प्रतिक्रिया-मूल-राउटर-फ्लक्स नेविगेशन प्रायोगिक (प्रतिक्रिया-मूल-नेविगेशन-प्रयोगात्मक) के एक फोर्क संस्करण का उपयोग कर रहा है, जिसमें कुछ बहिष्कृत फ़ाइलें हैं (उदाहरण के लिए नेविगेशनएनिमेटेड व्यू अब नेविगेशन ट्रांज़िशनर है) इसलिए शायद इसे अपडेट करने लायक है।

@aksonov प्रतिक्रिया-मूल-नेविगेशन-प्रयोगात्मक को अनफोर्क करना संभव है? परिवर्तनों की आवृत्ति को देखते हुए एक काँटेदार प्रति बनाए रखना संदिग्ध लगता है।

नेक्सस 5 पर रिमोट डीबगिंग के साथ बहुत धीमी गति से चालू हुआ

मेरे पास एक ही मुद्दा है। एक एमुलेटर पर यह ठीक काम करता है। लेकिन एक डिवाइस पर, रिमोट जेएस डिबगिंग सक्षम होने पर एनिमेशन बेहद कम होते हैं (स्क्रीन के बीच रूटिंग जो क्षैतिज/लंबवत एनिमेट करते हैं)। बहुत बुरा है, इसे बहुत चालू और बंद करना होगा।
विको लेनी 2

सिर्फ जानकारी के लिए:

एक दिन पहले, मुझे लगता है कि जब मैं अपने डिवाइस में स्थापित करने के लिए "प्रतिक्रिया-मूल रन-एंड्रॉइड" चलाता हूं, बिना किसी स्पष्ट कारण के, इसे समाप्त होने में लगभग 15/20 मिनट लग रहे हैं (हां, मैं प्रतीक्षा के लिए नायक हूं ) इसलिए दर्द से दौड़ने और दौड़ने के बाद, कुछ बदलते हुए मुझे पता चला कि मेरी समस्या यह थी कि मैं एक प्रॉक्सी के पीछे हूँ और मैंने अपने प्रॉक्सी कॉन्फ़िगरेशन को gradle.properties फ़ाइल पर टिप्पणी की है। इसलिए मैं कॉन्फ़िगरेशन को असम्बद्ध करता हूं और सब कुछ फिर से तेजी से चलता है। मैं वास्तव में नहीं जानता क्यों, लेकिन मेरे लिए काम करता है, और यह सुनिश्चित करने के लिए कि मैं इस कॉन्फ़िगरेशन पर फिर से टिप्पणी करता हूं और सब कुछ धीरे-धीरे चलता है। इसलिए, अगर किसी को यह समस्या हो रही है और कोई अन्य समाधान काम करता है, तो इस लाइन को yout gradle.properties फ़ाइल में डालने का प्रयास करें (केवल अगर आप प्रॉक्सी के पीछे हैं, तो निश्चित रूप से):

systemProp.http.proxyHost=192.168.X.XX //put your server IP here
systemProp.http.proxyPort=8888 //put your server PORT here
systemProp.http.proxyUser=xxxxxxx //put your PROXY USER here
systemProp.http.proxyPassword=xxxxxxx //put your PROXY USER PASSWORD here

systemProp.https.proxyHost=192.168.X.XX //put your server IP here
systemProp.https.proxyPort=8888 //put your server PORT here
systemProp.https.proxyUser=xxxxxxx //put your PROXY USER here
systemProp.https.proxyPassword=xxxxxxx //put your PROXY USER PASSWORD here

मुझे आशा है कि यह किसी की मदद करेगा।

हे दोस्तों, यह वही है जो मुझ पर सबसे अधिक प्रभाव डालता है ( dev=false और दूरस्थ जेएस डिबगिंग को अक्षम करना)

समस्या

राउटर ट्रांज़िशन + एंड्रॉइड + react-native-svg

समाधान

स्पष्ट रूप से Svg से बचने की कोशिश करें, लेकिन अगर आपको उनका उपयोग करना है, तो संक्रमण होने तक उन्हें रेंडर करने में देरी करें। आप इस तकनीक की विविधता का उपयोग कर सकते हैं: https://facebook.github.io/react-native/docs/performance.html#slow -navigator-transitions

मेरे मामले में, svg छवियां काफी कम हैं, लेकिन सौभाग्य से उन्हें स्क्रीन के निचले भाग पर प्रस्तुत किया जाता है, इसलिए उपयोगकर्ता को उन्हें देखने के लिए स्क्रॉल करने की आवश्यकता होती है। इसलिए केवल उन svgs को प्रस्तुत करने में देरी से प्रदर्शन पर बहुत अधिक प्रभाव पड़ा (शुरुआत में यह लगभग 4s था और बाद में यह 1s से कम था)।

देरी करना अपने आप में काफी मुश्किल है इसलिए मैंने इसे करने के लिए एक HOC बनाया। यहाँ सार है (ध्यान रखें कि मैंने टीएस में लिखा था और मैंने सिर्फ प्रकार की जानकारी को स्ट्राइप किया है, इसलिए यह जेएस बन जाता है लेकिन मैंने इसकी कोशिश नहीं की है):

import React from 'react'
import { InteractionManager } from 'react-native';

const MAX_DELAY = 500;

export default function providePartialRender(Component) {
  return class PartialRenderProvider extends React.Component {
    // initialize state (same as inside the constructor, just syntax sugar)
    state = {
      partialRender: true,
    };

    componentDidMount() {
      const updatePartialRender = () => {
        this.setState(state => {
          state.partialRender = false
          return state;
        });
      }
      // workaround https://github.com/facebook/react-native/issues/8624
      let called = false;
      const timeout = setTimeout(() => { called = true; updatePartialRender() }, MAX_DELAY);
      InteractionManager.runAfterInteractions(() => {
        if (called) return;
        clearTimeout(timeout);
        updatePartialRender();
      });
    }

    render() {
      const props = Object.assign(
        {},
        this.props,
        { partialRender: this.state.partialRender }
      );

      return <Component {...props}/>
    }
  }
}

तो अब, जिन घटकों को आप इस एचओसी के साथ बढ़ाते हैं, उनके पास partialRender नामक एक नया प्रोप होगा जो उन्हें बताएगा कि घटक के हल्के संस्करण को प्रस्तुत करना है या नहीं ( partialRender = true ) या सब कुछ प्रस्तुत करना है ( partialRender = false )।

Facebook के नए "आधिकारिक" नेविगेटर के लिए https://reactnavigation.org/ देखें, जो ट्रांज़िशन के लिए नेटिव एनिमेशन का उपयोग करता है।

@Jickelsen यह कितना आधिकारिक है?

@adambene सहयोगियों की सूची देखें।

बस अपना क्रोम डीबगर बंद कर दें और सब कुछ तेज हो जाएगा :)

@doddys आप एक महान व्यक्ति हैं! आपको यह पता है?

@doddys धन्यवाद यार, आपने दिन बचा लिया!

हल नहीं किया गया

"रिएक्शन-देशी-राउटर-फ्लक्स": "4.0.6",