useEffect की dependency array कैसे काम करती है, और उसमें आम तौर पर क्या गड़बड़ होती है?

React हर dependency की तुलना पिछले render की उसकी value से Object.is से करता है और तभी effect दोबारा चलाता है जब कोई बदली हो। खाली array का मतलब है mount के बाद एक बार चलो; array बिल्कुल न देने का मतलब है हर render के बाद चलो। गड़बड़ तब होती है जब आप कोई dependency छोड़ देते हैं और कोई बासी value पकड़ लेते हैं, या जब आप ऐसा object या function डाल देते हैं जो हर render में नया बनता है, जिससे effect हमेशा के लिए घूमता रह जाता है।

React पिछले render की array रखता है और हर item की तुलना Object.is से करता है। अगर सब मेल खाता है तो वह effect छोड़ देता है; अगर कुछ अलग है तो पुराने का cleanup चलाता है और फिर नया चलाता है। पेच यह है कि effect उसी render के props और state को अपने अंदर बंद कर लेता है जिसने उसे बनाया था, तो अगर मैं array में कुछ छोड़ देता हूं तो मुझे एक बासी value मिलती है जो चुपचाप पुरानी पड़ती जाती है। इसका दूसरा पहलू है उसमें कोई object या arrow function डाल देना, क्योंकि वे हर render में नए reference होते हैं, तो effect loop में चलता रहता है। मेरे आम हल हैं functional state updates ताकि मुझे मौजूदा value dependency के तौर पर चाहिए ही न हो, स्थिर चीजों को component से बाहर निकालना, और किसी callback को तभी लपेटना जब उसका dependency होना सच में जरूरी हो। हालांकि ईमानदारी से, मेरा पहला सवाल यही होता है कि इस effect का होना जरूरी है क्या। मैंने जितने effects हटाए हैं उनमें से ज्यादातर derived state गिन रहे थे, जो render के दौरान की सीधी गणना है, या data ला रहे थे जिसकी जगह router या कोई query library थी।