V tomto seriáli sa dozviete:
- Prečo začať so Zoneless programovaním?
- Ako odstrániť závislosti na Zone.js a zaviesť signály v Angular projekte?
- Pokročilé princípy Zoneless Angularu: Signály, efekty a nové možnosti
- Ako Zoneless projekt správne optimalizovať a sledovať jeho výkon?
- Tipy, triky a budúcnosť Zoneless Angularu: Reálne príklady z praxe
Zone.js bol kedysi neodmysliteľnou súčasťou Angularu. Vývojári veľkých projektov však v tejto dobe čoraz častejšie hľadajú spôsoby, ako sa tejto knižnice jednoducho zbaviť. Prečo? Lebo to, čo im kedysi výrazne zjednodušovalo prácu, je pre nich dnes skôr záťažou. Automatická detekcia zmien, ktorú Zone.js priniesol, končí. Na scénu sa vracia manuálna detekcia s lepšou možnosťou kontroly aj vyšším výkonom.
Čo je Zone.js a akú úlohu zohráva(l) v Angular aplikáciách?
Zone.js bol integrovaný do Angularu s cieľom automatizovať detekciu zmien v stave aplikácie. Kedykoľvek sa vykoná asynchrónna operácia, ako napríklad HTTP požiadavka, timeout a i., Zone.js tento proces odsleduje a zabezpečí, aby sa používateľské rozhranie aktualizovalo vždy, keď dôjde k zmene dát. Na prvý pohľad je to skvelé riešenie, pretože vývojári sa nemusia starať o to, kedy a ako dôjde k vykresleniu nových údajov na obrazovke. Má to však háčik.
Prečo je Zone.js v moderných aplikáciách problémom?
S rastúcimi požiadavkami na rýchlejšie a efektívnejšie aplikácie začali vývojári pracujúci so Zone.js narážať na obmedzenia. Automatické sledovanie všetkých asynchrónnych úloh totiž vedie k zbytočnému opakovaniu vykresľovania, čo spomaľuje aplikáciu. Okrem toho Zone.js často komplikuje debugging a kontrolu stavu aplikácie, pretože maskuje, kde presne k problémom v procese detekcie zmien dochádza. Odstránenie závislosti na Zone.js teda prináša zásadnú zmenu – vývojári získavajú plnú kontrolu nad tým, kedy a ako sa aplikácia aktualizuje.
Zopár štatistík z DEV Community ako dôkaz
- Zníženie zaťaženia CPU: Pri odstránení Zone.js môže spotreba CPU klesnúť z 70-100% na 30-40%, čo znamená výrazne lepší výkon pri náročných operáciách, najmä ak aplikácia často pracuje s asynchrónnymi úlohami.
- Zmenšenie veľkosti aplikácie: Zone.js pridáva približne 35kB k veľkosti aplikácie. Po jeho odstránení sa balík zmenší, čo zlepšuje rýchlosť načítania a celkový výkon.
- Lepšia stabilita pri vysokom zaťažení: Aplikácia si bez Zone.js dokáže udržať stabilný výkon aj pri náročných úlohách – aktualizácie zvládne každých 10 ms a to bez výrazného zhoršenia výkonu. V prípade verzie so Zone.js môže takáto frekvencia aktualizácii už spôsobiť preťaženie.
Ako začať so Zoneless?
Prechod na Zoneless vývoj sa realizuje prostredníctvom spomínanej manuálnej detekcie zmien (checkOnce strategy), ktorá dáva vývojárom plnú kontrolu nad tým, kedy a ktoré komponenty aplikácie sa aktualizujú. V kombinácii s ďalšími technológiami, ako sú signály (signals), standalone components či lazy loading, tak získavajú možnosť efektívnejšie spravovať dáta a znižovať zaťaženie systému. Výsledkom je plynulejšia a rýchlejšia aplikácia, ktorá reaguje len na to, čo je naozaj potrebné.
Zoneless otvára developerom nové možnosti, ako svoje projekty vylepšiť prakticky v každom smere. Aj preto sme ho začali postupne zavádzať na eHealth aplikácii Crossuite, ktorú používa vyše 4,5 milióna používateľov. A keďže sa nám táto novinka osvedčuje, chceme sa s vami o naše skúsenosti podeliť. V tomto Zoneless seriali preto vysvetlíme:
- Ako v projekte odstrániť závislosť na Zone.js,
- ako zaviesť manuálnu detekciu zmien na zvýšenie výkonu aplikácie,
- ako lepšie pracovať so signálmi a efektívne spravovať dynamické dáta,
- a ktoré pokročilé techniky vám umožnia mať úplnú kontrolu nad fungovaním vašej Zoneless aplikácie.
Ak teda hľadáte spôsob, ako získať nad svojou aplikáciou úplnú kontrolu, zrýchliť jej chod a pripraviť ju na budúcnosť, ste na správnom mieste. Sledujte našu sériu a nechajte sa inšpirovať konkrétnymi krokmi a tipmi, ktoré vám pomôžu prejsť na nový level vývoja.
Zdroje:
