Fermer

novembre 4, 2021

Quoi de neuf dans Angular 13


Nous avons une autre excellente version d'Angular qui nous est publiée. Voici les points forts de la version 13 !

Alors que je suis assis ici à regarder les oiseaux par ma fenêtre, à siroter un café glacé et à me prélasser dans la lumière du soleil d'automne dans mon bureau, je peux à peine croire que nous sommes déjà bien dans l'automne et que nous saluons le dernière version d'Angular, v13, dans nos vies. Personnellement, je pense que les changements apportés et proposés par l'équipe Angular nous amènent dans un endroit merveilleux – 2022 devrait être une période vraiment cool pour être un Angularite.

Voici quelques-uns des faits saillants de ce qui s'est passé dans ce domaine. Libération. Consultez le Blog Angular et la roadmap pour plus de détails !

Mises à jour Angular Core

Suppression de la prise en charge du moteur de vue

Comme promis dans les annonces précédentes, la version 13 d'Angular n'est pas prend plus en charge l'ancien moteur de rendu View Engine. Pour aller de l'avant, Angular doit laisser tomber ces chaînes dans le passé. Vous devez vous attendre (dans une prochaine version bientôt) à ce que ngcc soit également abandonné. Pour le développeur Angular moyen, cela ne signifie pas grand-chose (à part profiter des avantages d'un framework plus performant). Pour les constructeurs de bibliothèques dans Angular, cependant, c'est un gros problème. Donc, pour vous tous, auteurs de bibliothèques, préparez-vous et assurez-vous que votre code est à jour et qu'il utilise Ivy.

J'aime comment Younus l'a dit :

🧹 auteurs de bibliothèques, passons de « enableIvy : false » à « mode de compilation : partiel »

Création de composant dynamique sans Usines de composants

Une mise à jour de l'API activée par Ivy est un moyen plus propre de créer dynamiquement un composant. ViewContainerRef.createComponent ne nécessite plus de fabrique instanciée pour mettre à jour un composant. Consultez les comparaisons de code de Mark avant et après les modifications activées par Ivy : Mises à jour de l'API des composants.

La prise en charge de la rétrocompatibilité de View Engine est supprimée ainsi que ces fournisseurs pour un tel cas d'utilisation :

  • ModuleWithComponentFactory
  • Compiler
  • CompilerFactory
  • JitCompilerFactory
  • NgModuleFactory

Consultez le CHANGELOG pour plus de détails à ce sujet.

Mises à jour et modifications du format de package angulaire)[19659023Angularv13seralivréaveclaversionlaplusmoderned'APF(AngularPackageFormat):ModulesES+ES2020

Si vous avez déjà géré une bibliothèque npm, vous savez à quel point il est difficile de trouver le bon format de package. moderne et fonctionne pour la plupart des cas d'utilisation ! 🚀https://t.co/A8HPqixfKk

— Igor Minar (@IgorMinar) 2 novembre 2021

TestBed Teardown Now Default

Configurations TestBed qui permettent un meilleur démontage des modules de test et les environnements sont désormais activés par défaut. Cette fonctionnalité a été ajoutée dans la v12 et même si elle est désormais par défaut, elle peut être désactivée ou configurée par module.

Améliorations de la documentation

Les documents ont également reçu plus d'amour dans la version de cette version. Consultez ces $localize docs pour voir un exemple de la façon dont ils ajoutent d'autres exemples pour faciliter l'apprentissage et l'entrée dans Angular !

Prise en charge en ligne des polices Adobe

Par défaut, vous pouvez désormais en ligne non uniquement vos polices Google (v11) mais aussi vos polices Adobe ! Regardez la vidéo de Mark Thompson sur l'accélération de vos performances en utilisant l'inling de polices !

Une capture d'écran du didacticiel vidéo de Mark sur l'inlining des polices" title="Une capture d'écran du didacticiel vidéo de Mark sur l'inlining des polices"/>[19659041]Une capture d'écran du didacticiel vidéo de Mark sur l'intégration des polices qu'ils ont reçu était <a href= massivement en faveur de le faire. plus rapide tout – les applications se chargeront plus rapidement (en raison de leur taille plus petite) et la mise en œuvre sera plus rapide (en raison de l'API améliorée).Découvrez les inconvénients que l'équipe Angular a répertoriés dans la RFC  :

  • « Nous pourrons supprimer les JS et C spéciaux Chemins de code SS, polyfills, passes de construction et infrastructure de développement qui n'existent que parce que nous prenons en charge IE11. qui existent depuis des années, mais nous ne pouvions pas les utiliser en raison de la prise en charge d'IE11 et des limitations du polyfilling. Ces API incluent : "
  • Variables CSS, Intersection Observers, CSS Grid (components/issues#7374)
  • Version native des API EcmaScript (par exemple regexp)
  • API d'animation Web
  • Proxies
  • Etc.

La suppression d'IE11 est une bonne chose – cela signifie qu'Angular peut pleinement adopter les API Web des navigateurs modernes et à feuilles persistantes. S'il s'agit d'un navigateur que vous devez prendre en charge, vous pourrez cependant utiliser Angular v12 jusqu'en novembre 2022 avec une prise en charge complète. Je suis enthousiasmé par ce changement et je pense que le LTS qu'Angular v12 fait est plus que généreux, puisque Microsoft a déjà supprimé la prise en charge d'IE11 dans ses produits Microsoft 365.

Angular CLI

Par défaut, nouveaux projets Angular dans v13+. aura le cache de construction persistant activé ! Cela accélère considérablement la création d'applications angulaires :

« 68% d'amélioration de la vitesse de création et des options plus ergonomiques » — Mark Thompson

Il s'agit d'un autre élément sur lequel l'équipe Angular a demandé des commentaires et a pris les commentaires à cœur. Le haut niveau de support les a amenés à implémenter cela dans la v13, alors soyez à l'affût des futures RFC – l'équipe écoute vraiment et se soucie vraiment des commentaires de la communauté alors qu'elle fait avancer le framework.

TypeScript 4.4

TypeScript 4.4 est désormais entièrement pris en charge. Y33T. Certains des grands points forts de TS 4.4 incluent :

Il y avait beaucoup plus de choses couvertes (et maintenant prises en charge par Angular) dans cette mise à jour—consultez le blog Microsoft pour en savoir plus.

RxJS 7.4

Comme vous le savez peut-être ou non, RxJS est maintenant à jour jusqu'à la version 7. À partir d'Angular v13, les nouvelles applications créées avec la CLI seront par défaut RxJS 7.4. Si vous utilisez actuellement RxJS 6 dans votre application, vous devrez exécuter manuellement cette commande pour mettre à jour : npm install rxjs@7.4.

Angular Material Accessibility Improvements

Angular Material Components (maintenant basé sur les composants MDC) ont reçu des améliorations d'accessibilité. Emma Twersky a expliqué plus en détail l'amélioration de l'accessibilité des composants angulaires dans ce post.

La case à cocher s'affiche comme « clavier focusable » dans devtools
La case à cocher s'affiche comme « clavier focusable » dans DevTools

Merci Vous et l'avenir

J'adore la section merci sur le CHANGELOG et c'est cool de voir combien de contributeurs ont fait la liste cette fois-ci. Je pense que je vais le perpétuer en les énumérant ici également.

❤️ Merci à l'équipe et aux amis qui aident à faire avancer Angular. Au plaisir d'entrer dans une brillante année 2022 avec vous tous.

Ahmed Ayed, Alan Agius, Alex Rickabaugh, Andrew Kushnir, Andrew Scott, Bjarki, Charles Lyding, Dmitrij Kuba, Doug Parker, Dylan Hunn, George Kalpakas, Jessica Janiuk, Jochen Kraushaar, Joe Martin (Crowdstaffing), Joey Perrott, Jon Rimmer, JoostK, Kristiyan Kostadinov, Maximilian Köller, Paul Gschwendtner, Pei Wang, Pete Bacon Darwin, Tomasz Domański, Willy Schott, anandtiwary, dario-piotrowicz, iRealzyNirdersmalt, iRealzyNirdersmalt -grzybek, mgechev et vthinkxie

Comme toujours, l'interface utilisateur Kendo pour les composants angulaires est prête à être utilisée lorsque vous choisissez de mettre à jour vers Angular v13. Il s'agit également du lien vers le Guide de mise à jour angulaire si vous avez besoin d'une aide supplémentaire pendant votre processus de mise à jour.

Assurez-vous de consulter toutes les RFC. À l'heure actuelle, il y en a un particulièrement juteux ouvert pour les composants autonomes, les directives et les tuyaux . Je pense que nous verrons cette fonctionnalité derrière un indicateur dans la v14 ou la v15, ce qui signifie de gros changements dans la structure de l'API pour Angular et une courbe d'apprentissage plus facile pour démarrer ! Comme nous l'avons vu dans cette mise à jour, l'équipe écoute vraiment les commentaires de la communauté, alors assurez-vous que votre voix est entendue en participant lorsque de nouvelles RFC sont supprimées.

Le meilleur outil 2023 pour ta croissance Instagram !



Source link

novembre 4, 2021