Fluxi arhitektuurimustri sissejuhatus

BookAuthority nimetas Discover Funktsionaalse JavaScripti üheks parimaks uueks funktsionaalse programmeerimise raamatuks !

Flux on arhitektuurimuster, mille Facebook on välja pakkunud SPA-de rajamiseks. Selles soovitatakse jagada rakendus järgmisteks osadeks:

  • Kauplused
  • Dispetšer
  • Vaated
  • Tegevuse / tegevuse loojad

Pood

Pood haldab riiki. See saab salvestada nii domeeni olekut kui ka kasutajaliidese olekut.

Pood ja olek on erinevad mõisted. Olek on andmete väärtus. Store on käitumisobjekt, mis haldab olekut meetodite abil. Raamatute haldamise korral: raamatute loend on olek ja BookStore haldab seda loendit.

Kauplus haldab mitut objekti. See on nende konkreetsete objektide ainus tõeallikas. Rakenduses võib olla palju poode. Näiteks: BookStore, AuthorStore, UserStore.

Kaupluses pole kindlaid meetodeid. Oleku muutmist saate taotleda ainult dispetšerile toimingu edastamisega.

Kauplus kuulab ära kõik toimingud ja otsustab, millist neist teha. See tähendab tavaliselt switchväidet. Kui pood on olekumuudatused teinud, väljastab see muutussündmuse. Kauplus on ürituste tekitaja.

Kauplused ei võta muid poode sõltuvust.

Dispetšer

Dispetšer on üks objekt, mis edastab toiminguid / sündmusi kõikidesse registreeritud poodidesse. Kauplused peavad rakenduse käivitamisel üritustele registreeruma.

Kui toiming tuleb, edastab see selle kõigile registreeritud poodidele.

Vaade

Vaade on kasutajaliidese komponent. Ta vastutab kasutajaliidese renderdamise ja kasutaja interaktsiooni käitlemise eest. Vaated on puustruktuuris.

Vaated kuulavad poe muudatusi ja renderdavad uuesti.

Vaateid saab jaotada esitlus- ja mahutivaadetes.

Esitlusvaated ei ühendu dispetšeri ega kauplustega. Nad suhtlevad ainult omaenda omaduste kaudu.

Konteinerivaated on ühendatud kaupluste ja dispetšeriga. Nad kuulavad sündmusi kauplustest ja esitavad andmed esitluskomponentide jaoks. Nad saavad uued andmed kaupluste avalike meetodite abil ja edastavad need seejärel vaatepuust alla.

Konteiner vaatab saatmise toiminguid vastuseks kasutaja iteratsioonile.

Toimingud

Toiming on tavaline objekt, mis sisaldab kogu toimingu tegemiseks vajalikku teavet.

Toimingutel on typeomadus, mis tuvastab toimingu tüübi.

Kui tegevusobjektid rakenduses ringi liiguvad, soovitan need muuta muutumatuks.

Toimingud võivad tulla erinevatest kohtadest. Need võivad pärineda kasutajate interaktsiooni tulemusel vaadetest. Need võivad pärineda muudest kohtadest, näiteks lähtestuskood, kus andmeid võidakse võtta veebi API-st ja vaadete värskendamiseks käivitatakse toimingud. Toiming võib tulla taimerist, mis nõuab ekraani värskendamist.

Tegevuste loojad

Praktika on koodi kapseldamine, toimingute loomine funktsioonidesse. Neid funktsioone, mis loovad ja edastavad toiminguid, nimetatakse tegevuse loojateks.

Veebi API kõned

Kasutajaliidese värskendamiseks veebi-API-kõnede tegemisel järgneb veebi-API-kõnele poe värskendamiseks vajalik toiming. Kui poodi värskendatakse, väljastab see muutussündmuse ja selle tulemusel kuvatakse seda sündmust kuulav vaade uuesti.

Veebi-API-kõned tehakse tegevuste loojatega. Saame välja tuua koodi, mis API API utiliidi funktsioonides API-kõnet kutsub.

Ühesuunaline andmevoog

Vaadete voo värskendamine ühes suunas:

Vaated ei muuda saadud andmeid. Nad kuulavad nende andmete muudatusi, loovad uute väärtustega toiminguid, kuid ei värskenda andmeid.

Kauplused, vaated ja muud toimingud ei saa olekut (muudes) poodides otseselt muuta. Nad peavad dispetšeri kaudu hagi saatma

Andmevoog on poe lugemises lühem kui kirjutamises. Andmevoog poes kirjutatuna erineb asünkroonsetest ja sünkroonsetest toimingutest.

Store Reads

Kirjutiste salvestamine sünkroonsetes toimingutes

Kirjutiste salvestamine asünkroonsetes toimingutes

Plussid

Räbuarhitektuur on parem rakenduses, kus vaated ei kaardistu otse domeenipoodidesse. Teisisõnu, kui vaated võivad luua toiminguid, mis värskendavad paljusid poode, võivad käivitada muudatused, mis värskendavad paljusid vaateid.

Toiminguid saab jätkata ja seejärel uuesti mängida.

Miinused

Flux võib lisada tarbetut keerukust rakendusele, kus iga vaade kaardistatakse ühe poega. Sellises rakenduses piisab vaate ja poe eraldamisest.

Vaadake näiteks jaotist Kuidas luua kolmekihiline rakendus Reactiga.

Järeldus

Kauplused haldavad riiki. Nad muudavad olekut ainult tegevust kuulates. Kauplused teavitavad vaateid värskendamiseks.

Vaated renderdavad kasutajaliidest ja töötlevad kasutajaga. Konteinerivaated kuulavad poe muudatusi.

Dispetšer edastab toiminguid kõikidesse registreeritud kauplustesse.

Toimingud on lihtsad objektid.

Avastage funktsionaalne JavaScript nimetati üheksparimad uued funktsionaalse programmeerimise raamatud BookAuthoritylt !

Funktsionaalsete programmeerimisvõtete rakendamise kohta Reactis lisateabe saamiseks vaadake funktsionaalset reageerimist .

Õpi funktsionaalset reaktsiooni projektipõhiselt koos funktsionaalse arhitektuuriga koos React ja Redux .

Jälgi Twitteris