Back to top

Angular 5 – le novità rispetto ad Angular 4

Build Optimizer, RxJS, Localizzazione, ExportAs e Router Events

Angular si rinnova e rilascia ufficialmente la versione Angular 5.0.0, riepiloghiamo di seguito le novità rispetto ad Angular 4.

Ottimizzazione della build

Ora attraverso la Command Line Interfcae (CLI) verrà applicato di default il build optimizer, un tool che permettere di rendere le build delle applicazioni più leggere rimuovendo parti addizionali dell’applicazione che non sono necessarie in produzione ( pure marking) e rimuovendo i decorator dal codice.
I vantaggi principali di questo miglioramento sono la diminuzione del codice JavaScript ed il consequenziale aumento della velocità di boot per gli utenti.

Angular Universal State Transfer API e supporto al DOM

Ora è possibile condividere più facilmente lo stato dell’applicazione tra versioni server e client dell’applicativo.
Angular Universal è un progetto focalizzato a permettere il rendering lato server (SSR) di applicazioni Angular permettendo di aggiungere supporto per gli scraper ed i crawler che non posso gestire JavaScript e di migliorare le performance della Web Application.
In particolare sono stati aggiunti i moduli ServerTransferStateModule e BrowserTransferStateModule che permettono di trasferire informazioni tra Server e Client.

Inoltre è stato implementata la manipolazione del DOM lato server aggiungendo l’estensione Domino.

Miglioramenti nel Compiler

E’ stato migliorato il Compiler con il supporto alla compilazione incrementale per certamente più rapidi rebuild dell’applicazione soprattutto con i build Ahead-of-time (AOT).
In particolare grazie al fatto che il compiler opera come Transform TypeScript( una nuova funzionalità disponibile da TypeScript 2.3) è possibile ridurre i tempi di build anche del 95%.

Inoltre è possibile ora scegliere se preservare la formattazione come tab e spazi nella build semplicemente inserendo tale configurazione nel decorator o nel file tsconfig.son con il comando “preserveWhitespaces: false“. Per approfondimenti puoi visitare il seguente link.

Supporto Cross Browser di Numeri, Date e Moneta

E’ stata migliorata la standardizzazione cross browser di numeri, date e monete per evitare la necessità di polyfill i18n.  Nella versione 4, Angular utilizzava la formattazione del browser mentre ora nella versione 5 utilizza una propria implementazione basata su CLDR per fornire ampio supporto a qualsiasi localizzazione. E’ possibile approfondire tali differenze al seguente articolo.
E’ comunque possibile usare il modulo DeprecatedI18NPipesModule per mantenere il vecchio comportamento di Angular.

Sostituzione del ReflectiveInjector con StaticInjector

E’ stato sostituito il ReflectiveInjector con lo StaticInjector per ridurre la dimensione dell’applicazione e l’aggiunta di polyfill.

Miglioramento della velocità delle Zone

E’ stata migliorata la velocità delle zone ed è stata data possibilità di bypassare completamente le zone per applicazioni ancora più performanti. Per un esempio puoi visitare il seguente link.

Aggiunta di exportAs

E’ stato aggiunto il supporto per nomi multipli per components e directives. Funzionalità utile per migrazione di codice come è già stato nel caso di Angular Material.

Aggiunta della validazione dei form onBlur e onSubmit

Puoi ora validare i form sugli eventi onBlur e OnSubmit invece che su ogni evento di input, inoltre puoi specificare una validazione asincrona ( asyncValidators) direttamente nelle opzioni dell’oggetto anche per reactive form.

Utilizzo di RxJS 5.5.2 e superiori

E’ stato aggiunto l’utilizzo delle versioni 5.5.2 e superiori di RxJS al fine di beneficiare di una nuova modalità di utilizzo di RxJS chiamata “lettable operators“.

Nuovo ciclo di vita degli eventi per il router

E’ stato aggiunto un nuovo ciclo di vita degli eventi al router che permette agli sviluppatori di tracciare tutto il ciclo. I nuovi eventi sequenziali sono : GuardsCheckStart, ChildActivationStart, ActivationStart, GuardsCheckEnd, ResolveStart, ResolveEnd, ActivationEnd, ChildActivationEnd.

Come aggiornare Angular

Il team ufficiale di Angular ha scritto una guida disponibile attraverso il seguente link su come effettuare l’update di Angular e le relative applicazioni.

Glue Labs e Angular 5

Esperti di Angular, eroghiamo corsi di formazione su Angular 5 e forniamo assistenza tecnica per sviluppo funzionalità e bugfixing. Realizziamo Web Application e le possiamo ospitare in Google Cloud grazie al nostro servizio di hosting con consulenza gratuita inclusa. Contattaci subito senza impegno per maggiori informazioni.

Casi di Successo

Il leader mondiale in sistemi di controllo di impianti refrigeranti, umidificazione e aereazione presente in 75 paesi usa le nostre soluzioni Web Application e System Integration per selezionare le componenti industriali e fornire documentazione tecnica in ambiente controllato e sicuro.

Inizia ora il tuo progetto

CONTATTI

Scrivici dal form di contatto

Tel +39 06 87811067
Fax +39 06 99335373

Mail: info@glue-labs.com
Pec: gluelabs@legalmail.it

Dove Siamo
Roma: Piazza Don Sturzo 15
Padova: Via Savonarola 217
Milano: Viale Monza 345
Torino: Via Nizza 262

Nome*

E-mail*

Telefono(per un contatto più rapido)

Come possiamo aiutarti?

Altro che vuoi dirci?

Inviando i tuoi dati accetti le condizioni sulla privacy. Li useremo per rispondere alle tue domande e richieste.

TOP