Produits WordPress
Produits Joomla
Support
Nouvelles
S'identifierComment regrouper et réduire les ressources dans WordPress
Avoir les meilleures performances possibles est le rêve de tous ceux qui gèrent un site Web, regrouper et réduire les ressources sur WordPress est l'une des meilleures choses que nous puissions faire pour cela, mais cela pourrait être très difficile. Regrouper toutes vos ressources (fichiers css et js principalement) peut exposer votre site web si vous n'êtes pas développeur car cela peut générer des conflits.
WP Speed of Light est la meilleure solution pour exécuter votre site wordpress car il dispose de nombreuses options pour accélérer le chargement de votre site avec un tableau de bord vraiment convivial et oui, l'une de ces options est de regrouper et de réduire les ressources. L'inclusion/exclusion de fichier unique du processus de groupe et de minification est une clé pour une optimisation personnalisée sans conflits.
Nous allons utiliser un exemple de site WordPress pour cet article de blog et nous apprendrons comment procéder afin que le processus de configuration soit plus facile.
Comment faire une minification WordPress JS et CSS
Apprenons comment faire une minification wordpress js et CSS, mais d'abord, nous devons savoir ce que signifie la minification. « La minification fait référence au processus de suppression des données inutiles ou redondantes sans affecter la façon dont la ressource est traitée par le navigateur - par exemple les commentaires de code et formatage, suppression du code inutilisé, utilisation de noms de variables et de fonctions plus courts, etc.
Maintenant, ce que nous allons faire est un test de vitesse sur notre page afin de voir les changements, pour cet exemple, nous utilisons un site avec woocommerce et certains produits, donc la première fois, il se chargera un peu lentement.
Oui, 2,79 secondes pour charger la page, pas mal mais ça pourrait être mieux, réduisons simplement les js et CSS et voyons la différence, allez dans WP Speed of light > SpeedUp > Group & Minify , vous pourrez pour voir le menu avec toutes les options à réduire. La version gratuite du plugin inclut l'option de groupe et de réduction, mais l'exclusion visuelle de fichier n'est disponible que dans la version PRO Addon.
Les options du module complémentaire PRO sont : Exclure le script en ligne (exclure le script en ligne de la minification), déplacer les scripts vers le pied de page (cela vous permet d'accélérer votre site en déplaçant tous les scripts minifiés vers le pied de page), la police de groupe et les polices Google (les polices locales de groupe et les polices Google dans un seul fichier pour être servi plus rapidement) et l'exclusion de fichiers avancée.
Vous avez la possibilité de minifier, comme vous pouvez le voir, JS, CSS et aussi le HTML maintenant il suffit d'activer ces options, cliquez sur enregistrer et toutes vos ressources seront minifiées tout de suite, cela pourrait avoir des problèmes car il s'agit d'une configuration avancée mais tout peut être corrigé à l'exclusion de certains codes et fichiers (avec l'addon pro).
Désormais, tout le travail de développement qui pourrait prendre des heures est effectué en quelques secondes seulement.
Prochaine étape, WordPress optimise CSS et JS
Avec ce plugin, nous laisserons WordPress optimiser CSS et js simplement en activant les options de groupe sur le tableau de bord, allez dans WP Speed of Light > SpeedUp > Group & Minify , vous pourrez voir un tableau de bord avec les options de groupe CSS et js.
Ces options vous permettent de :
- Groupe JS : regrouper plusieurs fichiers Javascript en un seul fichier minimisera le nombre de requêtes HTTP
- Groupe CSS : regrouper plusieurs fichiers CSS en un seul fichier minimisera le nombre de requêtes HTTP.
Requêtes HTTP : ce sont des requêtes qui sont adressées au serveur chaque fois que nous sélectionnons quelque chose ou que nous accédons à une autre page du même site. Ainsi, si nous pouvons réduire ces requêtes, le temps de chargement diminuerait.
Pour vérifier la quantité de fichiers et de scripts que vous pouvez regrouper sur votre site Web, ouvrez simplement la console de votre navigateur (clic droit > Inspecter ou F12) et ouvrez le panneau réseau .
Vous pouvez ensuite lister tous les fichiers chargés par type, ici dans cet exemple j'ai cliqué uniquement sur la liste des fichiers JS.
Maintenant que nous en sommes à ces paramètres, activez simplement les options de groupe (Group CSS et Group JS) et cliquez sur enregistrer, gardez à l'esprit que ces options doivent être utilisées avec prudence et vous devrez tester votre page car cela peut provoquer des conflits. .
Soyons sérieux et optimisons le poids des polices
Quoi? Autre optimisation ? Oui! vous pourrez optimiser le poids de la police et ce sera aussi simple que d'activer l'option dans les paramètres, allez simplement dans WP Speed of Light option
Google Fonts L'option Groupe de polices et polices Google vous permettra de les regrouper dans un seul fichier pour être servi plus rapidement, c'est assez pratique car la plupart des thèmes et mises en page WordPress sont livrés avec 2 ou polices par défaut avec toutes les déclinaisons (régulier, gras, italique). ...)
Activez simplement cette option, cliquez sur Enregistrer et toutes les polices seront regroupées.
Maintenant que nous avons activé toutes les options pour minimiser et regrouper les ressources, nous devrions constater une différence dans le temps de chargement de notre site, vérifions la vitesse.
Quelle différence, de 2,8 à 0,56 secondes! Comme nous vous l'avons dit au début de cet article, nous pouvons améliorer le temps de chargement;)
Comment utiliser l'exclusion de minification de fichier
La minification pourrait causer des problèmes sur votre site, cela se produit principalement lorsque vous regroupez certains fichiers qui contiennent une erreur de syntaxe ou une variable similaire, un nom de classe. C'est pourquoi avec l'option « exclusion de minification de fichiers », vous pourrez exclure des fichiers du processus de minification et de groupe, allez dans WP Speed of Light > SpeedUp > Group & Minify , vous pourrez voir l' d'exclusion de fichiers avancée .
Pour utiliser l'exclusion de fichiers avancée, vous devrez d'abord exécuter une analyse, activez l'option et cliquez sur Exécuter l'analyse.
Pour pouvoir lister les scripts chargés sur votre site web, WP Speed of Light doit scanner votre dossier pour les lister. Ils sont généralement tous contenus dans votre dossier /wp-content qui regroupe tous vos plugins et thèmes. Sélectionnez ce dossier (au moins) et cliquez sur « Scanner maintenant »
Il exécutera une analyse, enfin, cliquez sur afficher les résultats une fois l'analyse terminée.
Une liste de fichiers classés par type (Tous, JS, CSS, Font) devrait s'afficher ci-dessous. Si vous avez identifié un fichier qui pose problème, lors de l'activation du groupe de fichiers et de la minification, vous pouvez l'exclure d'ici en utilisant un simple commutateur ON/OFF .
Cela vous aidera à exclure des fichiers et, de cette manière, à résoudre facilement tout problème pouvant survenir lors de la réduction des ressources… Les processus de groupement et de réduction nécessitent encore un peu de travail, en particulier lors des tests, mais cela en vaut vraiment la peine, et vous le ferez. soyez toujours en mesure de tester son fonctionnement en exécutant le test de vitesse directement depuis WP Speed of Light .
Allez-y et essayez WP Speed of Light : https://www.joomunited.com/wordpress-products/wp-speed-of-light
Lorsque vous vous abonnez au blog, nous vous enverrons un e-mail lorsqu'il y aura de nouvelles mises à jour sur le site afin que vous ne les manquiez pas.
commentaires