2016-12-27 10 views
32

आधिकारिक React docs बताता है कि "React.PureComponent का shouldComponentUpdate() केवल वस्तुओं की तुलनात्मक रूप से तुलना करता है", और यदि राज्य "गहरा" है तो इसके खिलाफ सलाह देता है।प्रतिक्रिया। कॉम्पोनेंट बनाम React.PureComponent

यह देखते हुए, क्या कोई कारण है कि किसी को प्रतिक्रिया घटक बनाते समय React.PureComponent क्यों पसंद करना चाहिए?

प्रश्न:

  • वहाँ React.Component कि हम React.PureComponent के लिए जा रहा विचार कर सकते हैं प्रयोग करने में कोई प्रदर्शन प्रभाव है?
  • मुझे लगता है कि shouldComponentUpdate()PureComponent केवल उथले तुलना करता है। यदि यह मामला है, तो कहा जा सकता है कि गहन तुलना के लिए विधि का उपयोग नहीं किया जा सकता है?
  • "इसके अलावा, React.PureComponent के shouldComponentUpdate() पूरे घटक उपखंड के लिए प्रोप अपडेट छोड़ देता है" - क्या इसका मतलब है कि प्रोप परिवर्तनों को नजरअंदाज कर दिया जाता है?

प्रश्न medium blog में पढ़ने से उत्पन्न हुआ, अगर यह मदद करता है।

+1

मुझे पता है कि यह पोस्ट करने के बाद से कुछ महीने हो गए हैं, लेकिन मैंने सोचा कि यह आलेख मदद कर सकता है: https://60devs.com/pure-component-in-react.html – MrOBrian

उत्तर

57

React.PureComponent और React.Component के बीच प्रमुख अंतर PureComponent स्थिति परिवर्तन पर एक उथले तुलना करता है। इसका मतलब है कि स्केलर मानों की तुलना करते समय यह उनके मूल्यों की तुलना करता है, लेकिन वस्तुओं की तुलना करते समय यह केवल संदर्भों की तुलना करता है। यह ऐप के प्रदर्शन में सुधार करने में मदद करता है।

आपको React.PureComponent के लिए जाना चाहिए जब आप निम्न स्थितियों में से किसी एक को संतुष्ट कर सकते हैं।

  • राज्य/प्रॉप्स अपरिवर्तनीय वस्तु
  • राज्य होना चाहिए/प्रॉप्स एक पदानुक्रम
  • आप forceUpdate बुलाना चाहिए जब डेटा में परिवर्तन

आप React.PureComponent उपयोग कर रहे हैं आप यह सुनिश्चित करना चाहिये नहीं होना चाहिए सभी बच्चे के घटक भी शुद्ध हैं।

वहाँ React.component का उपयोग कर कि हम React.PureComponent के लिए जा रहा विचार कर सकते हैं किसी भी प्रदर्शन प्रभाव है?

हाँ, यह (उथले तुलना की वजह से)

मैं shouldComponentUpdate() की Purecomponent केवल उथले तुलना करता है अनुमान लगा रहा हूँ अपने एप्लिकेशन के प्रदर्शन में वृद्धि होगी। यदि यह मामला गहन तुलना के लिए का उपयोग किया गया तरीका नहीं है?

आपने इसे सही ढंग से अनुमान लगाया है। यदि आप उपरोक्त वर्णित शर्तों में से किसी एक को संतुष्ट करते हैं तो आप इसका उपयोग कर सकते हैं।

"इसके अलावा, प्रतिक्रिया दें।PureComponent के shouldComponentUpdate() पूरे घटक सबट्री "के लिए प्रोप अद्यतन को छोड़ देता है - क्या यह मतलब है कि परिवर्तन सहारा अनदेखी कर रहे हैं

हाँ, प्रोप परिवर्तन नजरअंदाज कर दिया जाएगा यह उथले तुलना में अंतर नहीं मिला, तो

?।
+0

हाय @ विमलराज शंकर। यहां सहायता के लिए धन्यवाद। क्या आप कृपया निम्नलिखित कथन का उदाहरण दे सकते हैं: 'इसका मतलब है कि स्केलर मानों की तुलना करते समय यह तुलना करता है आईआर मान, लेकिन वस्तुओं की तुलना करते समय यह केवल संदर्भों की तुलना करता है। यह ऐप के प्रदर्शन में सुधार करने में मदद करता है। धन्यवाद –

+0

@ श्रीस्क्रिप्ट मुझे आशा है कि इससे मदद मिलेगी https://stackoverflow.com/a/957602/2557900 – vimal1083

+0

'राज्य/प्रॉप्स में पदानुक्रम नहीं होना चाहिए', क्या आप यहां कुछ पदानुक्रम का अर्थ समझ सकते हैं? –

संबंधित मुद्दे