Teiesugused lugejad aitavad MUO-d toetada. Kui teete ostu meie saidil olevate linkide abil, võime teenida sidusettevõtte komisjonitasu. Loe rohkem.

SWR (state-while-revalidate) on Verceli loodud andmete toomise meetod. See toimib nii, et esmalt hangitakse andmed, saadetakse nende uuesti kinnitamiseks toomistaotlus ja seejärel tagastatakse värskendatud andmed.

SWR on väga võimas, kuna see ei võimalda mitte ainult korduvkasutatavate andmete toomist, vaid sellel on ka sisseehitatud vahemällu salvestamine, lehekülgede otsimine ja taaskinnitamine. SWR-i kasutades kuvab veebisait vahemällu salvestatud sisu, samal ajal kui see toob taustal ajakohase sisu.

Kuidas SWR töötab?

Tavaliselt sa tahaksid hankige andmeid Axiose või toomismeetodi abil. Need meetodid loovad andmeressursiga ühenduse, toovad ja tagastavad andmed ning sulgevad seejärel ühenduse. Kuid SWR hangib andmeid erinevalt. See toimib kolmes etapis:

  1. Tagastab vahemälust aegunud andmed.
  2. Saadab toomistaotluse andmete uuesti kinnitamiseks.
  3. Tagastab ajakohased andmed.
instagram viewer

SWR ei asenda toomise API-t. Selle asemel võimaldab see renderdada vahemällu salvestatud sisu oma saidil kohe, kui kasutaja seda külastab, ja värskendada seda sisu, kui see aegub.

Niisiis, kuidas SWR teab, kui vahemälu on kehtetu? Vahemälu juhtimise päise vastuse kaudu. Vastusel on kaks olekut: värske ja aegunud. Värske olek tähendab, et vahemälu saab uuesti kasutada, samas kui aegunud olek tähendab, et see on kehtetu. Saate määrata aja, mille jooksul vastus kehtib direktiivis max-age.

SWR loeb kõik vahemällu salvestatud vastused, mis on vanemad kui maksimaalne vanus, kehtetuks. Kui teie rakendus renderdab aegunud vahemällu salvestatud andmed, kinnitab SWR need uuesti ja tagastab värsked andmed, mida saate lehe värskendamiseks kasutada.

Kuidas SWR-iga Next.js-is andmeid tuua

Alustage SWR-i kasutamist Reactis, installides selle esmalt paketihalduri kaudu. See käsk kasutab npm-i.

npm installida swr\n

Importige komponendifailis useSWR-konks swr-st.

importida kasutage SWR-i alates"swr"\n

UseSWR konks aktsepteerib kahte argumenti:

  1. Andmete kordumatu identifikaator. Tavaliselt API URL.
  2. Tõmbamisfunktsioon. Seda funktsiooni kasutatakse andmete toomiseks. See võib kasutada toomist, Axiost või muid andmete toomise tööriistu.

Konks tagastab andmed ja veaobjekti. Veenduge, et teie kasutage seda konksu parimate tavade kohaselt.

Siin on näide, mis näitab, kuidas kasutada useSWR konksu.

konst tooja = (...args) => too(...args).then(res => res.json());\nconst {andmed, viga} = useSWR("/api/data", tooja);\n

Andmed saate renderdada sellises komponendis:

importida kasutage SWR-i alates"swr"\nfunktsioon Kodu () {\n konst tooja = (...args) => too(...args).then(res => res.json());\n konst {andmed, viga} = useSWR("/api/data", tooja);\n kui (viga) tagasi<div>laadimine ebaõnnestusdiv>\n kui (!andmed) tagasi<div>laadimine...div>\n tagasi<div>{data}div>\n}\n

See on SWR-i lihtne teostus. The SWR dokumendid mine põhjalikumalt, nii et lisateabe saamiseks vaadake neid.

Miks kasutada SWR-i?

SWR-il on teiste andmete toomise meetodite ees palju eeliseid.

Vahemällu salvestamine

Traditsiooniliste andmete toomise meetodite puhul peate rakenduse andmete toomise ajal kasutajakogemuse parandamiseks kasutama ketrus- või laadimissõnumit.

SWR võimaldab teil kuvada kasutajale aegunud andmeid, samal ajal kui te neid uuesti kinnitate. See tähendab, et kasutaja ei pea ootama, kuni tooja andmed tagastab.

Revalideerimine

Uuesti kinnitamise kaudu muudab SWR vahemällu salvestatud andmed taas värskeks ja leht renderdatakse uuesti ajakohaste andmetega. Uuesti kinnitamine on eriti oluline saitide puhul, mille sisu muutub regulaarselt.

Leheküljed

The kasutage SWRIinfinite konksu SWR-ist võimaldab teil hõlpsalt lehekülgedega jagada või isegi luua lõputu laadimisliidese.

SWR võimaldab kasutajal naasta lehel kerimisasendisse, kui ta sellele tagasi pöördub. See aitab kaasa paremale kasutajakogemusele.

Sõltuv andmete toomine

Saate tuua andmeid, mis sõltuvad muudest andmetest. See võimaldab teil ühest päringust tagastatud andmeid kasutada teises päringus.

Kasutage kasutatavuse parandamiseks SWR-i

SWR on automaatse uuesti kinnitamise funktsiooniga andmete toomise tööriist, mis aitab rakendustel renderdada vahemällu salvestatud sisu, oodates ajakohast sisu. Kasutajad saavad sisuga kohe tegeleda, selle asemel, et oodata serveris andmete tagastamist.

SWR aitab teil luua ka lehekülgi, lõputut laadimist, kerimisasendi taastamist ja muid keerukaid funktsioone. Kui tõmbate andmeid, mis vajavad regulaarset värskendust, peaksite kindlasti kaaluma nende kasutamist.