Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

HTML5 : Optimisation des flux de production

Utiliser des CDN

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Vous avez besoin de librairies JavaScript. Ces librairies ne demandent pas d'optimisation particulière et vous pouvez employer des réseaux de diffusion de contenu CDN. Faites le tour de quelques services intéressants.
03:32

Transcription

Lors de nos développements, et surtout en production, il peut être parfois intéressant d’utiliser des cdn. Alors, qu’est-ce qu’un cdn ? En fait un cdn, c’est un serveur qui va nous proposer de charger certaines librairies. Le mieux c’est d’aller sur*Wikipédia, et de regarder le petit schéma qui est dessiné, et je le trouve assez sympathique et expressif. Vous avez un serveur de production ici, qui va délivrer chacun de vos utilisateurs. Donc déjà, les montées en charge vont faire que c'est toujours le même ordinateur qui va délivrer l’information. Et si votre serveur est très loin de la personne, il va y avoir énormément de relais, avant de pouvoir servir le poste client. Un cdn va avoir des sortes de miroirs, qui va pouvoir être plus proche de chacun de vos internautes, et surtout de redispatcher les montées en charge. Donc, ces services sont continuellement en charge. On peut entendre des fois dire : oui, mais si le cdn tombe, on n’a plus de service. Oui, effectivement c’est arrivé une fois. Mais si votre serveur tombe, c’est pareil aussi Donc là, le truc, c'est que quand même, généralement, c’est bien sécurisé, c’est bien mis en place. Et puis surtout, c’est que si on utilise un cdn, par exemple ici, j’ai un jQuery qui a été téléchargé par cet internaute sur notre site, vous, vous revenez visiter juste après, ils disent que sur ce site, il a besoin de jQuery. S’il y a aussi un cdn, il est déjà dans le cache, il n’a pas besoin de le télécharger. Petit inconvénient, c’est que vous pouvez pas optimiser comme vous, vous le souhaiteriez. Ce qui est intéressant aussi, c’est le Subresource integrity ici. C'est-à-dire, c’est une sorte de scelle, une clé algorithmique qui va venir se rajouter à l’adresse url, que vous allez choisir ici. Par exemple ça, c’est crypté. Et donc vous êtes sûr, vous, en demandant le script, le navigateur peut vérifier si c’est bien, à l’octet près, le même script que ce que vous avez demandé, à l’octet près. Donc, s’il y a une différence d’un octet, le scelle va changer automatiquement. On vous dira non, non, attention, ce script, il n’est pas bon. Il a été falsifié. Et puis là, vous avez anonymous qui va permettre de travailler avec des cross domain, puisque vous ne serez pas forcément sur le même domaine que le cdn, sur lequel vous allez piocher le script. Alors, vous avez plusieurs cdn. Google, par exemple, qui propose divers types de versions : pour Angular, Dojo, Ext Core, etc. Donc vous pouvez venir voir, faire votre marché là. Vous pouvez choisir la version pré, que vous souhaitez solliciter. Vous avez Microsoft Ajax CDN ici, qui vous propose toute une série également, principalement basée sur jQuery et des scripts Microsoft. Voilà, vous avez jQuery, quand vous allez faire le download, hé bien, jQuery vous propose directement des cdn. Vous pouvez le récupérer directement depuis un cdn, voilà. Donc, c’est à peu près la même chose. Ici, vous avez JSDELIVR, Free Open, et puis, un que j’aime vraiment particulièrement, c’est cdnjs, parce qu’on y retrouve tout ce qu’on veut. Donc là, il suffit de taper le script, et puis, vous avez par exemple ici, si on veut prendre modernizr. Vous choisissez modernizr. Une fois que vous arrivez sur la librairie de modernizr, vous allez pouvoir choisir la version qu’il vous propose. Ici maintenant, cette version-là, il n’y a que Cloudfare qui vous le propose. Des fois, vous pouvez avoir différents provider. Et puis, une fois que vous voulez copier l’adresse, alors soit, vous travaillez sur la version pleine, soit la version minifiée, vous avez, soit l’url brute, le SRI, le Script Tag, ou le Script Tag With avec le CRI, tout à fait complet. Regardez, si je passe dans l’éditeur de code pour le coller, voilà, vous avez le script, l’adresse qui va bien, l’intégrité, c'est-à-dire ce qu’on a vu tout à l’heure, et le crossorigin anonymous. Vous n’avez plus qu’à copier-coller ça, directement dans votre script. Voilà, donc l’utilisation de cdn peut des fois avoir son intérêt. Son inconvénient, c’est de ne pas pouvoir compiler. Mais son intérêt, on l’a vu juste avant, avec le petit schéma de Wikipédia.

HTML5 : Optimisation des flux de production

Optimisez vos flux de production lors de vos développements en HTML5. Explorez les méthodes et les éléments essentiels à la mise en place de processus automatisés.

5h29 (62 vidéos)
Aucun commentaire n´est disponible actuellement
 
Spécial abonnés
Date de parution :26 déc. 2016

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !