Comment Angular est-il devenu une technologie majeure chez Yoozly ?
Comment Angular est-il devenu une technologie majeure chez Yoozly ?

Comment Angular est-il devenu une technologie majeure chez Yoozly ?

par Guillaume dans Développement
Les technologies que nous utilisons pour développer sont omniprésentes dans notre quotidien. Elles nous aident à matérialiser nos idées tout en concrétisant les projets de nos clients. Malgré tout, il m’a toujours semblé qu’en dépit de son importance, la technologie doit rester un outil, et ne jamais constituer un objectif ou une fin en soi. C’est pourquoi nous sélectionnons les outils que nous utilisons en phase de conception, toujours en fonction du besoin et du contexte projet, et jamais pour elles-mêmes. Cependant, ces dernières années, l’un de nos outils a pris une place prépondérante dans nos réalisations, il s’agit d’Angular.
Dès lors, lorsque l’on s’interroge sur les raisons sous-jacentes à cette tendance, on remarque qu’elles tiennent :
  • dans la capacité d’Angular à standardiser et unifier le code
  • dans la propension du framework à s’adapter aux projets d’entreprises
« Technology is the campfire around which we tell our stories.« 
– Laurie Anderson

DES CONVENTIONS DE CODE STRICTES

GÉNÉRALISATION DE LA CLI

D’abord, Angular est composé de dizaines de sous-projets qui constituent un écosystème complet. Chacun de ces projets est développé et maintenu officiellement dans le cadre du projet global, ce qui permet d’en contrôler toutes les briques applicatives et d’en assurer la compatibilité.
Sous-projets Angular
Sous-projets Angular

L’outil de base de tout développeur Angular est la CLI (Command-Line Interface). En effet, celle-ci a été encouragée par le projet depuis son lancement jusqu’à devenir une brique incontournable. La CLI permet de générer la structure initiale des projets, permettant à tous les développeurs de partager le même socle lors d’une nouvelle application. Elle est également dotée de nombreuses commandes destinées à générer automatiquement des compositions de code, ce sont les _Schematics_. Le recours à ces schematics procure à l’ensemble des développeurs Angular la possibilité de générer des structures de code identiques, et ce, dans le respect des bonnes pratiques établies, ce qui concoure naturellement à l’uniformisation du projet et à la qualité du code.

UNE LOGIQUE DE FRAMEWORK

Ensuite, à l’inverse d’autres outils, Angular est un framework plutôt qu’une librairie. La différence réside dans sa philosophie :
  • la librairie vous fournit le minimum pour assurer une fonction précise et vous laisse compléter selon vos besoins
  • le framework vous procure une suite complète d’outils directement associés les uns avec les autres
C’est ainsi qu’Angular comporte par défault un router, un gestionnaire de ressources AJAX, il exploite Typescript, la programmation réactive (RxJs), etc. Ces éléments sont disponibles en standard, et Angular fournit le cadre ainsi que les commandes pour les exploiter en harmonie. Cette organisation permet à chaque développeur Angular d’utiliser des outils similaires et unifiés, ce qui résulte en une fragmentation moindre des projets.

DES CONVENTIONS STRICTES

D’autre part, Angular force des conventions strictes. Là où certaines librairies sont très souples et laissent organiser son code librement, Angular se veut beaucoup plus directif et exigeant. De ce fait, il est de coutume de dire qu’ il n’existe pas dix manières de faire la même chose avec Angular, mais une seule, à savoir celle poussée par Angular ! Ce point est considéré par beaucoup comme un inconvénient, mais il constitue selon moi un énorme avantage. En effet, une fois les mécanismes compris, la contrainte devient une aide et rédiger du code structuré et qualitatif devient une seconde nature. Par ailleurs, cette uniformisation facilite l’échange entre développeurs qui peuvent, sans même connaître un projet, partager leurs idées et problématiques liées au développement dans la mesure où ils disposent d’un référentiel commun.

STANDARDISATION

Enfin, grâce à ses conventions de structuration fortes, le code devient facilement portable vers une autre équipe ou une autre prestataire. Pour le client, c’est une garantie importante pour l’évolutivité du projet. On sait que lorsqu’un projet vit de nombreuses années, les équipes bougent, les pratiques évoluent, et les chances que les bonnes pratiques initiales soient détournées sont grandes. C’est pourquoi l’apport de guidelines strictes va gommer cet effet et allonger la qualité intrinsèque du code source et par extension, sa durée de vie.

UN FRAMEWORK ADAPTÉ AUX APPLICATIONS D’ENTREPRISE

L’ensemble des points précédents font d’Angular un excellent candidat pour le déploiement sur des projets d’ampleurs où de nombreuses équipes de développeurs interviennent. En effet, les guidelines imposées par le framework lui permettent de maintenir naturellement un code normé et facilement compréhensible par tous les membres de l’équipe.

MULTI-PROJET

Par ailleurs, depuis la version 6, Angular propose nativement la prise en charge d’applications multiples au sein du même projet (logique de monorepo). Ce type d’organisation présente de nombreux bénéfices :
  • elle facilite la parallélisation du travail des équipes
  • elle encourage le partage des ressources (ex.: design système déployé sur de multiples apps)
  • elle offre une structure plus flexible sur des projets d’ampleur comportant plusieurs dizaines d’applications, voire plus.
Grâce à la librairie Nx de Nrwl, il est même possible de mélanger plusieurs technologies dans le même espace de travail (ex: des apps Angular, une app en React, et des API en NodeJs, le tout en partageant les mêmes modèles de données).

BAZEL ET IVY

En outre, les prochaines versions, notamment la version 9 prévue pour le 4e trimestre 2019 comporte de nombreuses fonctionnalités pour les applications d’entreprise. L’une de ces nouveautés est Bazel, un nouveau compiler déjà utilisé en interne par Google depuis plus de 10 ans. Il offre des fonctionnalités innovantes telles que la compilation différentielle, la compilation centralisée dans le cloud ou le partage des artifacts de compilation. Le principal avantage est une réduction drastique des temps de compilation, ce qui est particulièrement important sur de grosses applications qui peuvent prendre des dizaines de minutes à compiler. À titre indicatif, le temps de compilation du projet Angular avec ses dépendances est passé de 60 à 7.5 minutes avec Bazel.
Framework Angular
Framework Angular
La seconde grande nouveauté de cette fin d’année sera Ivy, le nouveau moteur de rendu qui apporte :
  • plus de sécurité en améliorant les contrôles et le debuggage durant le développement
  • plus de performances en réduisant sensiblement le poids des applications compilées et en limitant la charge CPU générée.

UNE ORIENTATION AFFIRMÉE

Enfin, dans la core team Angular, on note une volonté de s’ouvrir au domaine des très grandes applications. La version du framework que nous connaissons actuellement est récente et date de 2016. À cette époque, parmi les objectifs principaux de la réécriture complète, on comptait :
  • l’amélioration des performances rencontrées sur les applications volumineuses
  • la pérennisation du code en garantissant un rythme de release fixe avec l’introduction du Long Term Support (LTS) sur les branches plus anciennes.
Cette réécriture portait déjà les germes d’un framework orienté entreprise ainsi qu’une volonté affirmée de s’adapter à des projets d’ampleurs. Cette volonté ne semble pas s’essouffler si l’on en croit les annonces faites par Brad Green lors de la keynote inaugurale de la NG-Conf 2019. Mieux, un projet interne à la core team nommé Photon à pour ambition d’ouvrir Angular au domaine des très grandes applications. Dans le langage de Google, il s’agit d’applications comportant des milliards d’utilisateurs, comme peut l’être Gmail par exemple.
Positionnement des versions 4 à 8 du framework Angular
Positionnement des versions 4 à 8 du framework Angular
Positionnement du projet Photon
Positionnement du projet Photon

POUR CONCLURE

Au sein de l’agence Yoozly, Angular était initialement une technologie parmi tant d’autres. Puis, au fil du temps, elle s’est naturellement développée pour occuper une place prépondérante. D’une part, ses guidelines strictes permettent d’insuffler naturellement un code plus uniforme, qualitatif et portable.
D’autre part, avec l’expérience, Angular s’avère particulièrement bien adapté pour la réalisation d’applications d’entreprises. A ce titre, les récentes annonces de la communauté, poussées par Google, nous annoncent une tendance qui risque de s’accentuer.
Pour conclure, je souhaite insister sur le fait qu’il n’existe pas de technologie meilleure ou moins bonne qu’une autre, mais simplement des outils adaptés à des usages différents.
« New technology is not good or evil in and of itself. It’s all about how people choose to use it. » – David Wong
*Illustration extraite de la conférence inaugurale de la ng-conf 2019 à Salt Lake City donnée par Brad Green et Igor Minar.
DoutriauxGuillaume
Guillaume - Directeur technique