Use jQuery Cloudflare

Mis à jour le
Un plugin WordPress ultra light pour charger les bibliothèques JQuery depuis le CDN de Cloudflare

Ce plugin a été supprimé du dépôt de WordPress suite à un différent avec l’équipe des plugins de WordPress. Lire : WordPress : le partage est mort ! Vive le commerce !
  • Présentation générale

    1. Ce plugin a été conçu pour mon usage personnel sur ce présent site web qui est hébergé sur les pages perso de FREE. Néanmoins, il fonctionne parfaitement chez tout autre hébergeur.
    2. Il a été conçu pour être le plus simple possible à l’usage : il ne nécessite aucun réglage et est entièrement automatique. Il fonctionne avec n’importe quel thème WordPress.
    3. Il permet d’utiliser le cache du navigateur web du visiteur plutôt que de charger les scripts jquery et jquery-migrate depuis son propre site web.
    4. Ce plugin est utile pour les sites qui n’utilisent pas de plugin de cache. Les sites utilisant un plugin de cache bien configuré n’ont pas besoin de faire appel à un CDN pour charger ces scripts.
    5. Il accélère le chargement des pages de votre site web très facilement comme le montrent ces deux captures d’écrans des tests effectués avec GTmetrix (Cliquez sur les images pour voir l’intégralité des tests sur GTmetrix).
      Plugin non activé :

      Report generated: Fri, Aug 8, 2014, 3:42 AM -0700
      Report generated: Fri, Aug 8, 2014, 3:42 AM -0700

      Plugin activé :

      Report generated: Fri, Aug 8, 2014, 3:41 AM -0700
      Report generated: Fri, Aug 8, 2014, 3:41 AM -0700

      Soit un gain de 4 % pour le « Page Speed Grade » et un chargement de la même page 0,97 seconde plus vite.

    6. Sur certains sites déjà bien optimisés, seuls les tests de Google Page Speed Insights permettent de mesurer les gains qui n’ont lieu que pour un appareil mobile.
      Plugin non activé :
      Plugin non activé
      Plugin non activé

      Plugin activé :
      Plugin activé
      Plugin activé
    7. Ce plugin fait suite à une discussion sur le forum USENET de support des pages perso de FREE au sujet de l’optimisation d’un site WordPress hébergé chez FREE. Je remercie chaleureusement les bénévoles de ce forum pour leur conseils et tout particulièrement « Al » l’administrateur du site Les Pages Perso Chez Free
    8. WordPress 3.9.1 consommant 26 Mo (nu, sans aucun plugin) sur les 32 Mo de mémoire PHP disponible sur les pages perso de FREE, je l’ai conçu afin qu’il soit aussi léger que possible. Il est écrit en seulement 10 lignes de code et consomme environ 0,005 Mo de mémoire PHP sur les pages perso de FREE.
  • Intérêt

    • La bibliothèque jQuery est utilisée par presque tous les sites web existant.
    • Charger cette bibliothèque depuis le serveur de son propre site web consomme inutilement de la bande passante sur le serveur de votre site web et n’a strictement aucun intérêt.
    • En chargeant cette bibliothèque depuis un CDN (Content Delivery Network) comme celui de CloudFlare, le navigateur web du visiteur met en cache cette dernière uniquement lors de la première visite d’un site qui y fait appel.
    • Ainsi, cette bibliothèque mise en cache est partagée par tous les sites web qui y font appel.
      Et donc, les pages sont chargées bien plus rapidement, le plus souvent dès la première visite.
  • Schématiquement

    Sans utiliser un CDN, lorsqu’un visiteur va sur le

    • site n°1, le navigateur met en cache la bibliothèque jQuery
    • site n°2, le navigateur met à nouveau en cache la bibliothèque jQuery
    • site n°3, le navigateur met encore en cache la bibliothèque jQuery

    La même bibliothèque jQuery est donc téléchargée à chaque fois.
    Mais en utilisant un CDN, lorsqu’un visiteur va sur le

    • site n°1, le navigateur met en cache la bibliothèque jQuery
    • site n°2, la bibliothèque jQuery n’est pas chargée puisqu’elle est déjà dans le cache local et il n’y a donc aucune requête effectuée.
    • site n°3, idem

    La même bibliothèque jQuery est donc téléchargée une seule fois.

  • Fonctionnement

    • Le plugin détecte automatiquement la version des scripts jquery et jquery-migrate utilisés par votre thème WordPress et effectue une requête vers la même version de ces scripts sur le CDN de Cloudflare.
      Par exemple, dans le cas de mon propre site, il remplace les requêtes effectuées nativement par WordPress dans le header suivantes :

      <script type='text/javascript' src='http://additifstabac.free.fr/wp-includes/js/jquery/jquery.js?ver=1.11.0'></script>
      <script type='text/javascript' src='http://additifstabac.free.fr/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>

      Par les requêtes suivantes vers le CDN de CloudFlare qui sont alors effectuées dans le footer :

      <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js'></script>
      <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.2.1/jquery-migrate.min.js'></script>
    • Si votre site utilise un plugin de cache bien configuré, normalement ce plugin est inutile.
    • Il fonctionne en arrière plan et ne nécessite aucun réglage.
  • Installation

    1. Placez le dossier dézippé « use-jquery-cloudflare » dans le dossier wp-content/plugins via FTP (avec Filezilla, par exemple)
    2. Puis activez-le depuis le tableau de bord, c’est tout.
  • Téléchargement

    jquery_cloudflare

    <---- Use jQuery CloudFlare
    Cliquer sur l’image pour aller sur le dépôt de WordPress

  • Variantes avec d’autres CDN

      Le même plugin est disponible pour utiliser d’autres CDN :

    • Celui de jQuery’s CDN délivré par MAXCDN :

      jquery-cdn
      <---- Use jQuery CDN
       Cliquer sur l’image pour aller sur le dépôt de WordPress

    • Celui de jsDelivr :

      jsdelivr
        <---- Use jQuery jsDelivr
      Cliquer sur l’image pour aller sur le dépôt de WordPress

    • Celui de Microsoft ASP.NET :

      asp-net
      <---- Use jQuery ASP.NET
       Téléchargé fois depuis le

Si vous avez trouvé une faute d’orthographe, informez-nous en sélectionnant le texte et en appuyant sur Ctrl + Enter

5 réflexions au sujet de « Use jQuery Cloudflare »

  1. Bonjour,
    Cloudflare a résolu son problème de failles de sécurité qui a provoqué des d’attaques DDoS au mois de Février?
    Juste pour savoir les tests de GTMetrix ont été effectué avec un compte chez eux? Serveur London, UK ?
    C’est Vancouver,Canada par défaut, alors moins précis comme résultat.
    Merci

    1. Bonjour,
      Il semble que CloudFlare ait résolu ses problèmes, mais je n’en ai pas la preuve.
      Il est tout à fait possible de faire un plugin identique en utilisant un autre service de Cloud en choisissant bien ce dernier car certains ne permettent de charger que la dernière version du script jQuery qui ne fonctionnera pas obligatoirement avec WordPress.

      Perso, je préfère éviter Google qui est un véritable espion incontournable. Connaissez-vous d’autres services de Cloud qui hébergent la bibliothèque jQuery ?

      Je n’ai pas de compte sur GTmetrix, il est possible que le résultat soit moins précis. En cliquant sur les images, vous ouvrez la page où sont conservés mes tests sur GTmetrix.
      Si vous faites des tests précis, merci de me tenir au courant.

  2. Hello,

    Je voudrais juste signaler que ce plugin (par ailleurs fort utile) pose problème avec les sites wordpress en HTTPS, car le protocole HTTP est écrit en dur dans les URLs qu’il remplace. Du coup, pour les navigateurs, c’est l’ensemble de la sécurité du site qui est compromise.

    Il faudrait que lors de la réécriture de l’URL le protocole originel soit conservé. Peut-on espérer une mise à jour ?

    Merci.

    1. Bonsoir,
      Je viens de regarder le site de CloudFlare et en effet, l’adresse a changée, désormais c’est bien https.
      Le temps de mettre à jour le plugin dans une nouvelle version et c’est fait.
      bonne soirée

      Edit 20 h 00 : Voilà, c’est fait !

Les commentaires sont fermés.