E’ arrivato Angular 18! Il popolare framework per il Front End sponsorizzato da Google si aggiorna e si rinnova. In questa release il team di sviluppo si è concentrato sul rendere stabile molte delle API sperimentali introdotte nelle precedenti versioni e nel rilasciare una funzionalità molto interessante e che illustreremo nell’articolo: zoneless change detection.
Per aggiornare alla versione 18 puoi visitare il sito angular.dev che ti mette a disposizione un form da compilare indicando da quale versione migrare e ti indica cosa devi fare. Se hai bisogno di assistenza contattaci subito e senza impegno.
Nelle versioni precedenti, per sfruttare la change detection in Angular, occorreva utilizzare la libreria zone.js che si è portata dietro negli anni problemi di performance. Ma a partire da Angular 18 puoi utilizzare una specifica API(al momento sperimentale) all’interno dell tua applicazione provideExperimentalZonelessChangeDetection.
Attraverso la zoneless change detection puoi:
Il miglior modo per usare la nuova API zoneless è attraverso Angular Signals. Per un approfondimento ti suggeriamo di leggere la documentazione ufficiale.
Da Angular 18 puoi trovare la documentazione ufficiale esclusivamente su angular.dev (il tradizionale sito angular.io è stato redirezionato sul nuovo): un portale appositamente creato per fornire guide intuitive e pratiche.
Nel portale sono disponibili:
Dopo aver introdotto, un paio di mesi fa in maniera sperimentale, Material 3 oggi diventa stabile e perfettamente integrato nell’ecosistema Angular. Contestualmente sono stati aggiunti nuovi temi e nuova documentazione che puoi visualizzare sul portale ufficiale.
Oltre a Material 3 sono state rese stabili le API di:
Angular e Wiz sono due framework sviluppati da Google che vengono massicciamente utilizzati all’interno dei prodotti e servizi di casa Google. In particolare Wiz è usato per le applicazioni orientate agli utenti finali e che devono essere super performanti mentre Angular per le applicazioni basate sulla produttività, quindi sulle funzionalità, e su quelle sperimentali.
Circa due mesi fa è stato annunciato un progetto a lungo termine che permettesse la convergenza tra i due framework. Come risultato di tale convergenza, Wiz ha integrato Angular Signals, per es. all’interno di YouTube, ed Angular ha integrato funzionalità specifiche per le performance come l’hydration.
Ora, un’altra libreria utilizzata direttamente nella pagina principale di google.com è parte di Angular: Event Dispatch.
Dalla versione 18, Event Dispatch potenzia la funzionalità di event replay all’interno del processo ibrido di rendering. In pratica Event Dispatch effettua il recording degli eventi utente anche se il caricamento dell’applicazione non è completo, e successivamente li replica appena l’applicazione è pronta in modo da rendere la User Experience(UX) perfetta e super performante.
Gli Angular DevTools sono stati aggiornati al fine di visualizzare il processo di hydration. Accanto ad ogni componente potrai visualizzare l’hydration status ed inoltre potrai effettuare anche la preview di tali componenti. Infine, qualora la tua applicazione presentasse qualche problema nel processo di hydration, gli Angular DevTools ti faranno visualizzare tali errori in uno specifico pannello al fine di semplificare il tuo processo di debugging.
Le App altamente performanti che sfruttano l’hydration hanno bisogno di differenti funzionalità nel rendering e nel pre-rendering sia server side sia client side. Gestire tale complessità può essere tediante, per questo motivo ora Firebase App Hosting gestisce tutte le complessità architetturali in maniera trasparente per gli sviluppatori.
Firebase App Hosting rende semplice tutto il processo di sviluppo e di deployment delle applicazioni Angular fornendo supporto built-in al framework, integrazione diretta con GitHub e con altri prodotti di Firebase come Authentication, Cloud Firestore e Vertex AI.
Nella nuova versione hanno inoltre trovato spazio:
Utilizziamo Angular dalla sua nascita, ti forniamo sviluppo di applicazioni, formazione avanzata e assistenza specialistica in modalità Time & Material, training on job e con piani di supporto tecnico per i tuoi progetti. Abbiamo integrato Angular in applicativi complessi ed in ambiti critici diventando partner tecnologico di numerosi Clienti. Le competenze avanzate ci permettono di garantirti ogni nostro progetto di sviluppo 12 mesi da qualsiasi bug. Contattaci subito e senza impegno per un preventivo gratuito.