web-dev-qa-db-fra.com

Est-il préférable d'utiliser Cache ou CDN?

J'étais en train d'étudier les performances du navigateur lors du chargement de fichiers statiques et ce doute est venu.

Certaines personnes disent que l’utilisation de fichiers statiques CDN (c’est-à-dire Google Code, la dernière version de jQuery, AJAX CDN, ...) est meilleure pour les performances, car elle demande à un autre domaine que la page Web entière.

Une autre manière d'améliorer les performances consiste à définir l'en-tête Expires sur quelques mois plus tard, ce qui oblige le navigateur à mettre en cache les fichiers statiques et à réduire les demandes.

Je me demande quelle est la meilleure façon de penser en termes de performances et si je peux combiner les deux.

Merci d'avance les gars, j'adore StackOverflow.

19
Gustavo Gondim

En fin de compte, il est préférable d’utiliser les deux techniques si vous effectuez l’optimisation des performances Web (WPO) d’un site, également appelée optimisation front-end (FEO). Ils peuvent travailler étonnamment main dans la main. Bien que si je avais pour en choisir un sur l’autre, je choisirais certainement caching n’importe quel jour. En fait, je dirais qu'il est impératif de configurer correctement la mise en cache des ressources pour tous les projets Web, même si vous allez utiliser un CDN.

Mise en cache

La définition des en-têtes Expires et la mise en cache des ressources est indispensable et doit être effectuée 100% du temps pour vos ressources. Il n'y a vraiment aucune excuse pour ne pas faire de cache. Sur Apache, il est très facile à configurer après avoir activé mod_expires.c et mod_headers.c. Le projet Boilerplate HTML5 a un bon exemple d'implémentation dans le fichier .htaccess et si votre serveur est autre chose que nginx, lighttpd ou IIS, consultez ces autres configurations de serveur .

Voici une bonne lecture si quelqu'un souhaite en savoir plus sur la mise en cache: Didacticiel de Mark Nottingham sur la mise en cache

Réseau de diffusion de contenu

Vous avez mentionné Google Code, jQuery latest, AJAX CDN et je veux simplement aborder le CDN en général, y compris ceux pour lesquels vous payez et héberger vos propres ressources, mais il en va de même si vous utilisez simplement les fichiers hébergés jquery cdn ou chargez quelque chose depuis http: // cdnjs .com / par exemple.

Je dirais qu'un CDN est moins important que la définition de la mise en cache d'en-tête côté serveur, mais qu'un CDN peut offre des gains de performances significatifs, mais que les performances de votre réseau de distribution de contenu varient (en fonction du fournisseur } _.

Cela est particulièrement vrai si votre trafic concerne un public mondial et que le fournisseur de CDN dispose de nombreux emplacements Edge/peer dans le monde entier. Cela réduira également considérablement votre bande passante d'hébergement Web et votre utilisation de l'unité centrale (un peu), car vous déchargez une partie du travail sur le CDN pour fournir des ressources.

Dans certains cas plus rares, un CDN peut avoir un impact négatif sur les performances si la latence du CDN finit par être plus lente que celle de votre serveur. De même, si vous optimisez et utilisez trop parallélisation de ressources (en utilisant plusieurs sous-domaines tels que cdn1, cdn2, cdn3, etc.), il est possible de ralentir l'expérience utilisateur et de créer un temps système avec des recherches DNS supplémentaires. Un bon équilibre est nécessaire ici.

Un autre impact négatif qui peut survenir est si le CDN est en panne. C'est arrivé et il va arriver encore. Ceci est plus vrai avec CDN gratuit. Si le CDN tombe en panne pour une raison quelconque, votre site disparaît également. C'est encore un autre potentielPOINT UNIQUE D'ÉCHEC (SPOF). Pour les ressources javascript, vous pouvez être malin et charger la ressource à partir du CDN. En cas d'échec, dans tous les cas, détectez et chargez une copie locale. Voici un exemple de chargement de jQuery à partir de ajax.googleapis.com avec un repli (tiré du HTML5 Boilerplate):

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.2.min.js"><\/script>')</script>

Outre les ressources évidentes des API gratuites (jquery, google api, etc.), si vous utilisez un CDN, vous devrez peut-être payer des frais d’utilisation, ce qui augmentera les coûts d’hébergement. Bien sûr, pour certains CDN, vous devez même payer un supplément pour accéder à certains emplacements. Par exemple, les nœuds asiatiques peuvent représenter un coût supplémentaire par rapport à l’Amérique du Nord. 

60

Un CDN présente l'avantage de fournir plusieurs serveurs et d'acheminer automatiquement votre trafic vers l'emplacement le plus proche de votre client. Cela peut entraîner une livraison plus rapide, optimisée par emplacement. 

De plus, le contenu statique ne nécessitant pas de serveurs d'applications spéciaux (comme le contenu dynamique), vous devez donc le décharger sur un CDN pour réduire complètement ce trafic. Un clip vidéo en streaming est peut-être trop gros pour être mis en cache ou ne doit pas l'être. Mais vous ne voulez pas nécessairement prendre en charge cette bande passante. Un CDN prendra ce trafic pour vous. 

Ce n'est pas toujours à propos du cache. Un serveur Web de petite application peut simplement vouloir fournir le contenu dynamique, mais a besoin d'une solution pour le média lourd qui change rarement. Les CDN traitent le problème de la mise à l'échelle pour vous. 

4
jdi

Pour les applications publiques, optez pour CDN. La mise en cache est utile pour les demandes répétées, mais pas pour la première demande. Pour garantir un chargement rapide lors de la première page, utilisez un CDN, il y a de bonnes chances que le fichier est déjà mis en cache par un autre site. Comme d'autres l'ont déjà mentionné, les résultats CDN sont bien sûr fortement mis en cache.

Cependant, si vous avez un site Web intranet, vous voudrez peut-être héberger les fichiers vous-même, car ils se chargent plus rapidement d'une source interne que d'un CDN. Vous avez également la possibilité de combiner plusieurs fichiers en un pour en réduire le nombre. de demandes.

3
Albin Sunnanbo

D'accord avec @Anthony_Hatzopoulos (+1)

CDN complète la mise en cache, mais peut également aider à optimiser les directives de mise en cache.

Par exemple, une entreprise pour laquelle je travaille intègre des algorithmes d'apprentissage comportemental dans son CDN afin d'identifier et de mettre en cache des objets générés dynamiquement.

Normalement, ces objets ne pourraient pas être cachés (c'est-à-dire [Cache-Control: max-age = 0] en-tête Http), mais dans ce cas, le système est capable d'identifier les possibilités de mise en cache et de remplacer les directions d'origine de l'en-tête HTTP. (par exemple: un produit populaire généré dynamiquement qui devrait être mis en cache ou une page de résultats de recherche populaire qui, bien que générée dynamiquement, est toujours présentée au fil du temps sous la même forme à des milliers d'utilisateurs). 

Et oui, avant que vous ne le demandiez, le système peut également identifier des données personnalisées et très fraîches, afin d'éviter les faux positifs ... :)

La mise en œuvre d'un tel algorithme n'a été possible que grâce à une technologie de CDN par proxy inverse. Il s'agit d'un exemple de la façon dont CDN et Caching peuvent se compléter pour créer des solutions d'accélération meilleures et plus intelligentes.

1
Igal Zeifman

Au-dessus de ces citations d’experts, les explications sont parfaites pour comprendre la technologie CDN et aussi pour mettre en cache Je voudrais simplement faire part de mon expérience personnelle, j’avais travaillé sur le site joomla virtuemart et, malheureusement, il ne permettra pas la mise à jour des nouvelles versions de joomla et virtuemart, il y avait trop de champs personnalisés dans les pages de produits, donc une fois que le visiteur jusqu'à 900/DAY et beaucoup d'utilisateurs ne pouvaient pas mettre leurs articles dans leur panier, car chaque fois que l'appelait un lot, jj et ajax demandaient des articles trop longs

Après l’optimisation du site, nous décidons d’utiliser CDN, puis les performances s’améliorent, comme en témoigne l’enregistrement de gtmetrix, le premier YSlow Score était de 50%, puis après optimisation + CDN, il passe à 74%.

https://gtmetrix.com/reports/www.florihana.com/jWlY35im

et à partir du tableau de bord de CDN, vous pouvez voir quel centre de données coûte le plus cher et quel sont les données les plus chargées pour améliorer votre marketing:

 enter image description here

Mais oui, pour configurer le CDN, il faut faire attention au temps de purge et équilibrer le nombre de ressources du CDN des ressources. Si un problème survient, vous devez déterminer la cause du CDN des ressources.

J'espère que cela aide

0
tess hsu