ज्ञान और दशा

किसी भी आधुनिक वेबसाइट या ब्राउज़र एप्लिकेशन का दिल (वह एसपीए, वह पीडब्ल्यूए, किन्हीं अन्य तीन अक्षर) उसका राज्य या राज्य है।

हम जितना बेहतर है उसके बारे में उतना ही तर्क दे सकते हैं - रिएक्ट, वीयू, स्वेल्ट, कोणीय, हम jQuery का उपयोग करना जारी रख सकते हैं, लेकिन वास्तव में यह इतना महत्वपूर्ण नहीं है। यह हमारे आवेदन का एक हिस्सा है जिसे हम देखते हैं - इसकी "मांसपेशियां" और "त्वचा"। लेकिन आप जिस तरह से सोचते हैं - आप किन शर्तों के साथ काम करते हैं, आप किस मैकेनिक का उपयोग करते हैं, यह भी कल्पना करें कि आपके आवेदन में डेटा "प्रवाह" कैसे होता है - यह सब उसके कंकाल से आता है। राज्य प्रबंधक से।

याद है, कुछ साल पहले, हम जावास्क्रिप्ट से थक गए थे ? अब मुझे भारी संख्या में लोग राज्य के प्रवासियों से थक गए हैं। Redux? हाँ , हाँ और हाँ । RxJS? बहुत । MobX? यदि यह इतना सरल है - लानत है, तो इसका प्रलेखन में एक जाल पृष्ठ क्यों है ?

जवाब "यह कई लोगों के लिए इतना कठिन क्यों है", लेकिन पहले आपको समस्या को सही ढंग से तैयार करने की आवश्यकता है।

एक राज्य चरनी चुनना - हम सोचने का एक तरीका चुनते हैं। अभी कई विकल्प हैं, लेकिन सबसे लोकप्रिय दृष्टिकोण 3 समूहों में आते हैं:

• फ्लक्स / Redux-like : क्रियाओं और रिड्यूसर के साथ एक वैश्विक भंडार। वहाँ काफी एक उनमें से कुछ हैं, लेकिन मैं होता उल्लेख Redux , प्रेरक , Storeon , अनकहा , और Reatom अपने आप को । ये "सबसे अच्छे से उत्तम" नहीं हैं, बल्कि "सबसे विविध" हैं। सूची से सभी समाधान कुछ अनोखे और असामान्य तरीके से चलते हैं, और आप उनसे विभिन्न दिलचस्प विचारों को पकड़ सकते हैं।

  
  

  यह दृष्टिकोण मुख्य रूप से अनिवार्य (थ्यूरिंग-पूर्ण) और वैश्विक है ।

  
  

• वेधशाला और पाइप। इस समूह में आज के सबसे लोकप्रिय समाधान RxJS और MobX हैं । कम ज्ञात में से - केफिर , बेकन , साइकिलज । वैसे, Svelte भी इस सूची में आती है। वे सभी डेवलपर अनुभव के दृष्टिकोण से बहुत अलग हैं, लेकिन मौलिक दृष्टिकोण से वे केवल एक ही तरीके से भिन्न हैं: MobX, Svelte और अन्य को सामान्य रूप से टोपोलॉजी के दृष्टिकोण से वर्णित किया जा सकता है "क्या ग्राफ़ ट्रिगर करता है, लेकिन RxJS नहीं है, इसका लिंक ग्राफ है" बहुआयामी और "अजीब लूप" इसमें दिखाई दे सकते हैंवेधशालाओं में वेधशालाओं को प्रेषित करना। यह एक ओर इसे अधिक शक्तिशाली बनाता है, और दूसरी ओर अधिक जटिल। ऐसी ही कहानी पटकथा के साथ थी। उन्हें पता चला कि उनका टाइप सिस्टम थुरिंग-कम्प्लीट है। इसके बाद केवल एक चीज यह थी कि यह सत्यापन कदम पर स्थिर हो सकता है, और उन्होंने काम के लिए एक समय सीमा जोड़ दी।

  
  

  यह अजीब लग सकता है, लेकिन सामान्य रूप से समाधानों का यह वर्ग स्थानीय, या तदर्थ और घोषणात्मक हो जाता है - लेकिन मनमाने ढंग से तर्क का उपयोग करने की क्षमता में कटौती के बिना।

  
  

  , - , , , , “” . , Lodash, Ramda, io-ts. - LISP JS, — -- “”, , .

  
  

• GraphQL . Apollo Relay — , . Falcor — GraphQL Netflix, GunDB PouchDB. , Redux, MobX, RxJS . “” GraphQL. , . 100% ( )

  
  

, . — , ; , - . .

: “” “” 100% : redux- , , RxJS — . JS , , .

: - ID ID, — . (), — .

. - . , , , "state of js” .

.

.

, , . , — , . , .

— , , . , , — GraphQL . , , .

, - .

SPA , : , , SQL- ; .

Rails, , .

, , ( ) — API , .

:

• : . , , , .
• : statechart. — . — observables (RxJava, RxRuby, RxSwift, RxBrainfuck — ) . — - , , - .

. , , . — . , , , , — . , , - . — , .

— - , . - , . — , , , .

. , , , corrupted. : , DTO. . — LISP-. : , .

— . , — , , , — - , . , , . : - — , . , , CRDT-. — .

:

.

— , , — , , . , . , , . await getBlogPost(id), : @gql("blogPost(id){...}") class extends Component, — , .

. . ImmutableJS, Object.freeze, readonly Record & Tuple stage 1 proposal. . - shared worker.

, — , . XState , ( ), . , . .

दो दुनियाओं के बीच किसी भी बातचीत को स्पष्ट रूप से, कोड में सीधे प्रतिष्ठित किया जाना चाहिए, ताकि कोड की समीक्षा के दौरान संयोग से ऐसा न हो, और सबसे महत्वपूर्ण बात - उपयोगकर्ताभूमि में होने के लिए, और पुस्तकालयों में नहीं।

आपको विशिष्ट समाधानों का चयन नहीं करना चाहिए, लेकिन अपनी नई परियोजना के लिए मैं ज्ञान को संग्रहित करने के लिए ग्राफकॉल + अपोलो का उपयोग करूंगा , और राज्य प्रबंधन के लिए - एक्सस्टेट + आरएक्सजेएस, सौभाग्य से, वे एक दूसरे के साथ दोस्त हैं ।

सब कुछ एक समाधान में भर जाने की चिंता करना बंद करें। तुम्हे जरुरत नहीं।