आप कैसे तय करते हैं कि कोई खास state कहां रहनी चाहिए?

जितना हो सके उतना local शुरू कीजिए, उसी component के अंदर जो उसे इस्तेमाल करता है, और तभी सबसे नजदीकी साझा पूर्वज तक उठाइए जब भाई बहन components को उसे सच में साझा करना हो। अगर वह server का data है, तो उसकी जगह component state नहीं, कोई caching परत है। अगर user को उसका link भेजने लायक होना चाहिए, जैसे filters या मौजूदा tab, तो उसे URL में रखिए। global store आखिरी उपाय है।

मेरा पहला कदम यह तय करना है कि यह किस किस्म की state है, क्योंकि जिन चीजों को लोग state कहते हैं उनमें से ज्यादातर असल में local state होती ही नहीं। अगर वह server से आई है तो वह query cache में जाती है, ताकि मुझे उसे useState और किसी effect में हाथ से गूंथने की जगह deduplication, revalidation और बासीपन का इंतजाम मिले। अगर उसे refresh के बाद बचना चाहिए या link के तौर पर साझा होना चाहिए, जैसे चालू filters या कौन सा tab खुला है, तो वह URL में जाती है। जो बचता है वह सच्ची UI state है, और वह उसी component में शुरू होती है जो उसे इस्तेमाल करता है। मैं तभी ऊपर उठाता हूं जब किसी दूसरे component को वह सच में चाहिए, और तब भी सिर्फ सबसे नजदीकी साझा parent तक। global stores मैं उन चीजों के लिए रखता हूं जो सच में पूरे app की हैं, जैसे मौजूदा user या कोई websocket connection। जो गड़बड़ मैंने सबसे ज्यादा बार साफ की है वह ऐसी state है जिसे किसी ऊपरी provider तक इसलिए उठा दिया गया क्योंकि दो components को वह एक बार चाहिए थी, और दो साल बाद हर keystroke पर सब कुछ दोबारा render होता है और उसे नीचे लाने की हिम्मत किसी में नहीं।