|
|
Publikuota: 2024-12-30 11:02:42
|
|
|
|
Neseniai "Angular" išleido nepriklausomą "patirtinę" kūrimo funkciją "Zone.js". Nors ši funkcija vis dar eksperimentinė, "Angular" komanda ilgą laiką dirbo su šia svarbia naujove. Reaguojantys primityvūs kūrėjams tampa vis svarbesni, o tai rodo, kad "Angular" įžengia į naują erą. Kampinės priklausomybės"Signals" ir "Rxjs" pranašumai yra dar ryškesni, todėl nereikia nuolat klausytis pokyčių, nuo kurių Zone.js priklausytiir nutraukė tarpininkavimo veiklą kūrimo metu.
"Angular" ir ateityje išliks drąsi ir galinga sistema ir pradės naują transformaciją.
Visų pirma, mano straipsnis nėra skirtas nieko mokyti. Tikiuosi, kad mano skaitytojai nesijaučia nusipelnę būti tokie pasyvūs. Stengiuosi kuo daugiau dalintis savo patirtimi ir žiniomis bei atsiverti diskusijoms. Svarbu diskutuoti kartu, keistis idėjomis ir vertinti remiantis kritiniu mąstymu. Nereikėtų pamiršti, kad vis dar kyla painiavos dėl to, kaip tiksliai jie veikia, ypač kai šiame straipsnyje aptartos technologijos vis dar yra patiriamos, ir sakyčiau, kad net pokyčių aptikimo mechanizmas vis tiek gali sukelti tam tikrą painiavą pagrindinėje "Angular" komandoje.
Kas yra Zone.js ir ką jis daro?
Zone.js yra nedidelė biblioteka, kurią 2010 m. sukūrė Brianas Fordas pavadinimu "Zonos", skirta valdyti asinchroninį darbą "JavaScript". Įkvėptas tokių kalbų kaip Erlang ir Dart, jis siekia struktūrizuotai sutapti su "JavaScript" vienos gijos aplinka. "Angular" komanda įgavo pagreitį, kai "Angular 2" priėmė "Zones" kaip pokyčių aptikimo mechanizmą, o "Angular" komanda pradėjo prie jo prisidėti Zone.js forma, suteikdama platesnį bendruomenės dalyvavimą ir tolesnę plėtrą. Šiandien, nors jis vis dar glaudžiai susijęs su "Angular", Zone.js gali būti laikomas galingu asinchroninių užduočių stebėjimo ir įsikišimo įrankiu, įgalinančiu našumo analizę, klaidų tvarkymo galimybes ir daugybę abejotinų funkcijų.
Taigi kodėl "Angular" atsisakė Zone.js?
Pasinaudoję dirbtinio intelekto gebėjimu be vargo paversti mūsų įsivaizduojamus vaizdus piešiniais, panaudojome "kempinės po lova" metaforą, kad sukurtume vaizdą, kad būtų lengviau suprasti.
Įsivaizduokite aukščiau esančiame paveikslėlyje esančią lovą, kuri dedama ne ant grindų, o ant didelės kempinės. Zone.js yra tarsi kempinė kampinėje programoje. Ši kempinė užtikrina, kad lova sėdėtų ant patogaus, palaikančio pagrindo, tuo pačiu suteikdama santykinį komfortą miegančiajam. Kempinė sugeria kiekvieną lovos judesį, neleisdama judesiui lovos viduje atsispindėti į išorę.
Beždžionių pataisos Zone.js klausytis visų asinchroninių API naršyklėje, tokių kaip: įvykiai, įsipareigojimai, stebimi, setTimeout, setInterval ir kt.
Klausydamasi jų, "Angular" programa gali aptikti bet kokius pakeitimus ir taip atnaujinti vartotojo sąsają, tiesą sakant, kaip ir kempinės atraminė lova, Zone.js taip pat leidžia sklandžiai veikti "Angular" programai. Tokiu atveju gali kilti našumo problemų, kurių nejaučiame labai dideliuose projektuose.
Kita vertus, atrodo, kad ši sudėtinga struktūra neleidžia mums suvokti tam tikrų konkrečių pokyčių laikui bėgant. Kiekviena ankstesnė savybė ir vystymasis, kartu su savo vidiniu vystymusi ir besikeičiančiais poreikiais, staiga tampa kliūtimi kitam ir vystymuisi.
Kai ištraukiame kempinę iš po savęs, matome, kad natūrali judėjimo laisvė pradeda atsirasti, kai lova tiesiogiai liečiasi su žeme. Kai pradeda dėvėti komfortą ribojantis kempinės poveikis, tai reiškia, kad judėjimas ant lovos dabar atsispindės tiesiai ant žemės.
Tokia metafora gali reikšti, kad kempinė suteikia komforto zoną ir suteikia santykinai patogesnį miegą. Zone.js kaip ir ši kempinė, ji suteikia rimtą komforto zoną, leidžiančią pajusti kiekvieną paviršiaus pokytį. Tačiau laikui bėgant ši sudėtinga struktūra gali neleisti mums suvokti kai kurių konkrečių pokyčių. Apatinės nugaros dalies skausmas gali atsirasti, kai ištraukiame kempinę iš po mūsų, ir šie skausmai rodo, kad nusileidome iš dirbtinės žemės į natūralią žemę, ir nors ši perėjimo patirtis gali būti šiek tiek skausminga, galiausiai su tiesia apatine nugaros dalimi, patogesniu miegu ir geresne kraujotaka, taip pat sveikesniu fiziniu ir psichiniu aštrumu. Kai pereiname prie zonos, t. y. nugaros ir sąnarių skausmas miegant lovoje be kempinės, yra geras ženklas, kad pereiname nuo dirbtinio prie natūralaus pagrindo. Nors ši pereinamoji patirtis yra šiek tiek skausminga, pereinamasis skausmas taip pat išnyksta, nes mūsų apatinė nugaros dalis pradeda persitvarkyti į buvusią natūralią būseną, užtikrindama geresnę kraujotaką; Perėjimo pavyzdys čia atitinka eksperimentinį "Zoneless", kurį girdėjome "Angular v18".
Manoma, kad Zone.js prideda papildomos apkrovos, nes seka asektron operacijas ir perduoda jas kampiniams aptikimo mechanizmams, tokiems kaip skambučiai, įvykiai, klaidos ir kt. Šiandien, kalbant apie "Angular" našumą, čia nematome ar net nejaučiame papildomo krūvio. Zone.js galėtų būti toliau tobulinamas ir kai kurios derinimo problemos galėtų būti išspręstos, tačiau pagrindas čia yra "Angular" veiksmų planas. Matome, kad pačios "Angular" sukurtos "Signals" reaguojančios primityvios Zone.js dabar trukdo "Angular" ateities planams. Nors signalų struktūra yra labai naudinga aptikimo mechanizmų požiūriu, taip pat gera našumo požiūriu, paprasta naudoti ir galinga, Zone.js nebėra būtina, tačiau tai nėra biblioteka, kurios galima atsisakyti per naktį.
Suprantame, kad "Angular" nenori riboti savo svajonių, o nori sukurti lankstesnę ir patikimesnę programą su savarankiškesne sistema, kiek įmanoma pašalindama tarpinius procesus. Matome, kad "Angular" juda link praktiškesnės būsenos ir bando pasinaudoti galimybe ateityje vėl įžengti į kilimo tendenciją. Deja, iš dabartinės "StateofJS" apklausos negalime teigti, kad tai yra tokia tendencija, tačiau taip pat matome, kad "Angular" yra atvira visoms įmanomoms naujovėms.
Kaip perjungti į režimą be zonos "Angular 18"?
"Angular 18" yra su žingsniu, leidžiančiu perjungti į režimą be zonos ir atsikratyti kempinės. Kaip parodyta toliau, dabar galime suteikti šią patirtį naudodami zonos pokyčių aptikimo mechanizmą įkrovos fazėje.
Pridėję aukščiau pateiktą funkciją prie teikėjo, dabar galime naudoti komandą npm uninstall zone.js, kad pašalintume zone.js, apibrėžtą toliau pateiktame poliužpildų masyve iš angular.json.
Dabar galime naudoti "Angular Zoneless"!
Kokie yra "Zoneless" pranašumai?
"Zoneless" suteikia supaprastintą mūsų programų ekosistemą, pašalindama nereikalingas klausymosi operacijas. Tai reiškia greitesnį atvaizdavimą, didesnį našumą, greitesnį puslapių įkėlimą, mažesnius paketų dydžius ir lengvesnį derinimą.
Atlikite klasikinį testą, kuriame pridėsite skaitiklį spustelėdami mygtuką ir spustelėdami mygtuką norite padidinti šį skaičių. Tokiu atveju matome, kad pakeista vertė pateikiama suaktyvinus kiekvieną funkciją, o ši reikšmė pasikeičia HTML. Kadangi tai jau funkcija ir mes ją suaktyviname tiesiogiai, ji pateikiama čia. Bet kas atsitiks, jei ši vertė pasikeis dėl išorinių poveikių ir norime pamatyti bet kokį vertės pokytį nesuaktyvindami jos rankiniu būdu? Jei yra Zone.js, jis nuolat klausosi visų pakeitimų ir praneša "Angular" mūsų vardu. Tačiau kadangi šiuo metu tokio mechanizmo nėra, turime arba įjungti pokyčių aptikimo mechanizmą po tam tikros asinchroninės operacijos, arba tiesiogiai naudoti signalus arba RxJS, kad pokytį būtų galima aptikti tiesiogiai dėl šio reaktyvumo.
Kempinės išnykimas mus moko, kad išnyksta ne tik Zone.js, bet ir "komforto zona".
Jei naudosime Zone.js kaip modulį su neapdorotu JavaScript, jis atrodys taip.
"Angular" mums nereikia spręsti tokių situacijų; Naudojant ngZone, šios operacijos jau veikia kartu su aptikimo mechanizmu.
Pavyzdžiui, tiesioginio DOM, įvykių klausytojų, stebimų ir įsipareigojimų, HTTP užklausų ir sinchroninių valdymo srautų atveju turime rankiniu būdu įjungti asinchroninių operacijų pokyčių aptikimo mechanizmą.
Kadangi signalai arba R xjs automatiškai aptinka pokyčius, nereikia įjungti pokyčių aptikimo mechanizmo.
Signalo pavyzdys:
Dabar parašykime programą, kad išbandytume bezonių ir kampinių pokyčių aptikimo mechanizmus ir pažiūrėtume, kaip tai veikia.
Pradėję aukščiau apibrėžtą intervalą kaip standartą, matome, kad jis pradeda veikti, tačiau DOM nėra atnaujinamas ir pokyčiai neatsispindi. Kai naudojame signalo pradžios intervalą, matome, kad jis veikia nesuaktyvindamas "Angular" pokyčių aptikimo mechanizmo. Kaip matote, kai prasideda paspaudimo įvykis ir signalo intervalas, "Angular" pastebi pokytį, iš karto užfiksuoja standartinio intervalo pokytį ir jį atleidžia.
Kai siunčiame kintamojo reikšmę į pirminį komponentą, pastebime, kad ji suvokiama skirtingai tiek stumiamu, tiek numatytuoju atveju.
Kai susiejame įvestį kairėje, pokytis atsispindi, kai nėra srities, ir panašiai matome, kad pokytis atsispindi spustelėjus dėl pažado.
Čia matome, kad po HTTP skambučio be aptikimo pakeitimų pakeitimai neatsispindi, tik tada, kai juos suaktyviname rankiniu būdu. Žinoma, signalai lengvai atspindi naujokus norimame ekrane. Kai kurie kodai yra tokie:
app.component.ts
change-detection-demo.component.ts
Programa buvo paskelbta "Stacklibitz", o likusius testus galite peržiūrėti. Taip pat galite stebėti vartotojo sąsajos rezultatus naudodami kodą.
Stackblitz:Hipersaito prisijungimas matomas.
"GitHub":Hipersaito prisijungimas matomas.
Žemiau taip pat yra programos pavyzdys, kuriame parodyta, kaip veikia "Angular" pokyčių aptikimo mechanizmas, ir jūs taip pat galite jį išbandyti.
Hipersaito prisijungimas matomas.
Į ką reikia atsižvelgti pereinant prie režimo be regiono
Svarbu pažymėti, kad, kaip rodo pavadinimas, "ExperimentalZonelessChangeDetection" vis dar yra eksperimentinis.
Atlikdami kai kuriuos bandymus, pastebėjome keletą keistenybių pakeitimų aptikimo mechanizme. Pavyzdžiui, kai kai kurie pakeitimai nesuaktyvinami rankiniu būdu, DOM pokyčių nematome ir būsena neatnaujinama. Tačiau kai kitas signalas ar reakcijos kintamasis veikia už pokyčių aptikimo mechanizmo ribų ir sukelia DOM atnaujinimą, galime pastebėti, kad anksčiau neatnaujinta būsena taip pat atnaujinama.
Jei norite įdiegti šią funkciją esamame projekte, turėtumėte atidžiai išbandyti visus veiksmus ir programos veikimą. Visų pirma, trečiųjų šalių bibliotekos gali pasikliauti Zone.js, o tai gali sukelti tam tikrų klaidų ir atvaizdavimo problemų.
Originalus:Hipersaito prisijungimas matomas. |
Ankstesnis:[AI] (1) Atvirojo kodo didelių modelių reitingaiKitą:.NET/C# naudoja "FastDeploy", kad įdiegtų OCR modelius, kad atpažintų tekstą
|
Savininkas|
Paskelbta 2024-12-30 11:04:13
|
