Comparaison des performances Divi vs Avada (2021) : laquelle est la plus rapide ?

Vous essayez de choisir entre Divi et Avada pour créer votre site WordPress ?

Ces deux thèmes sont deux des thèmes WordPress premium les plus populaires de tous les temps – Elegant Themes (le développeur de Divi) prétend avoir plus de 806 000 clients, et Avada a été acheté plus de 747 000 fois sur ThemeForest. Ce sont à la fois des chiffres incroyablement impressionnants et la preuve que chaque thème compte de nombreux utilisateurs satisfaits.

L'un des principaux facteurs du succès des deux thèmes est leurs générateurs visuels groupés par glisser-déposer. Avec ces constructeurs, vous pouvez créer de magnifiques sites WordPress personnalisés - aucun code requis.

Mais la flexibilité de conception n'est pas la seule chose à considérer dans un thème WordPress - vous devez également évaluer la rapidité avec laquelle ce thème aidera votre site Web à se charger, car les temps de chargement du site Web jouent un rôle dans tout, de l'expérience utilisateur au référencement, en passant par les taux de conversion, etc. .

Cela est encore plus vrai depuis la mise à jour Page Experience de Google, où Google a commencé à prendre en compte Core Web Vitals dans son classement.

À cette fin, nous avons décidé de créer une comparaison Divi vs Avada axée sur une métrique spécifique : la performance.

Autrement dit, est-ce que Divi ou Avada vous aide à obtenir un site Web à chargement plus rapide ? Pour répondre à cette question, nous avons effectué nos propres tests - continuez à lire pour voir les données et l'analyse.

Remarque – nous avons initialement publié cet article et effectué ces tests en juillet 2021. Cependant, Elegant Themes a publié une mise à jour avec des mises à jour majeures des performances de l'interface en août 2021 (Divi 4.10) qui fait une énorme différence dans les performances de Divi. Pour cette raison, nous avons complètement relancé ces tests et collecté toutes les nouvelles données et conclusions en novembre 2021.

Comment nous allons tester les performances du thème Divi vs Avada

Avant d'aborder les données, parlons de la façon dont nous allons tester les performances Divi vs Avada afin que vous sachiez exactement comment nous configurons les choses.

Tout d'abord, nous allons tester deux scénarios de haut niveau :

• Test #1 – nous testerons uniquement les thèmes. Autrement dit, nous n'utiliserons pas leurs constructeurs visuels groupés. Au lieu de cela, nous allons simplement tester la "page d'exemple" par défaut construite avec l'éditeur de blocs.
• Test n ° 2 - nous testerons une page simple construite avec le constructeur de chaque thème, car les constructeurs visuels sont un élément clé de ce qui rend Divi et Avada si populaires. Nous essaierons d'utiliser des modules comparables pour rendre la comparaison aussi égale que possible.

Pour chaque scénario de test de haut niveau, nous testerons également deux configurations différentes :

• La première configuration ne concerne que les thèmes eux-mêmes et aucune autre optimisation des performances.
• La deuxième configuration est avec WP Rocket installé et configuré afin que vous puissiez voir à quoi ressemblent les choses si vous implémentez les meilleures pratiques de performance WordPress.

En plus de la mise en cache des pages et d'autres bonnes pratiques de base, WP Rocket propose également des fonctionnalités uniques qui peuvent optimiser le code de chaque thème et améliorer les métriques Core Web Vitals.

• Supprimer le CSS inutilisé – cela vous permet de supprimer les CSS inutiles de votre site page par page. Cela peut être particulièrement utile pour réduire la taille des pages de thèmes tels que Divi et Avada.

• Retarder l'exécution de JavaScript - cela vous permet d'attendre l'exécution de JavaScript jusqu'à une interaction de l'utilisateur, ce qui fait un excellent travail pour accélérer le temps de chargement initial. Vous pouvez toujours exclure manuellement certains scripts si vous avez besoin qu'ils se chargent immédiatement .

Nos sites de test sont hébergés sur une gouttelette DigitalOcean bon marché de 5 $ par mois alimentée par RunCloud et une pile entièrement Nginx. Nous n'avons apporté aucune amélioration des performances au-delà de l'ajout de WP Rocket dans certains des tests, comme indiqué ci-dessus.

Pour tester et mesurer les données de performances de WordPress, nous utiliserons WebPageTest pour collecter des données de performances axées sur les mobiles :

• Appareil de test – iPhone 8. Les appareils plus modernes auront des processeurs plus puissants pour traiter JavaScript plus rapidement, ce qui pourrait entraîner des temps de chargement légèrement plus rapides. Cela pourrait être le contraire avec des appareils plus anciens ou moins puissants.
• Vitesse de connexion – connexion LTE limitée (12 Mbps, 70 ms RTT). Les temps de chargement réels seraient plus rapides si un visiteur navigue sur Wifi ou plus lents si l'utilisateur dispose d'une connexion 3G.

Pour chaque test, WebPageTest exécutera neuf tests distincts et prendra la valeur médiane. Cela nous aide à éviter la variabilité d'un seul test et à obtenir des résultats plus cohérents.

Voici les quatre mesures sur lesquelles nous allons nous concentrer :

1. Largest Contentful Paint (LCP) – fait partie des nouvelles métriques Core Web Vitals de Google et un facteur de classement SEO dans la mise à jour Page Experience.
2. Time to first byte (TTFB) – cela mesure la rapidité avec laquelle le serveur est capable de répondre avec le premier octet de données après avoir traité le PHP du site/thème (ou livré depuis le cache, dans le cas de notre test WP Rocket).
3. Taille de la page – toutes choses égales par ailleurs, une taille de page plus petite est toujours préférable.
4. Requêtes HTTP – toutes choses égales par ailleurs, moins de requêtes HTTP sont toujours meilleures.

Enfin, voici les numéros de version de tout ce que nous testons :

• Thème Avada – 7.5
• Constructeur Avada – 3.5
• Thème Divi – 4.13.1
• WP Rocket – 3.10.3.

Tests de vitesse Divi vs Avada

Passons maintenant à nos tests pratiques de performances Divi vs Avada.

Test n°1 : uniquement les thèmes

Dans ce premier test, nous testons uniquement les thèmes sans utiliser les constructeurs visuels :

• Divi – juste le thème Divi car Divi est déjà fourni dans Divi Builder.
• Avada – nous avons également installé les plugins Avada Core et Avada Builder car ce sont des plugins essentiels requis. Cependant, nous n'avons installé aucun plugin optionnel.

Le contenu réel est la "page exemple" fournie avec une nouvelle installation de WordPress. Il est construit avec l'éditeur de blocs natif.

Voici les données pour les thèmes par eux-mêmes :

Vous pouvez voir que Divi est le gagnant assez clair ici en ce qui concerne le temps de peinture le plus important, car le temps d'Avada est 50% plus élevé.

Pourquoi la différence ?

Eh bien, nous allons deviner qu'une grande partie des performances plus rapides de Divi est le fait que la taille de la page d'Avada est de 544 Ko alors que celle de Divi n'est que de 201 Ko. Gardez à l'esprit qu'il s'agit d'une page qui n'est pas construite à l'aide du constructeur visuel - il s'agit simplement de l'exemple de page par défaut construit avec l'éditeur de blocs.

Maintenant, regardons les données après avoir ajouté WP Rocket :

Vous pouvez voir qu'avec les optimisations de WP Rocket, les deux thèmes sont beaucoup plus rapides et il y a très peu de différence dans le temps de peinture du plus grand contenu entre Divi et Avada. Divi est toujours légèrement plus rapide, mais la différence est suffisamment petite pour qu'il puisse s'agir simplement d'une variabilité de test normale.

De plus, WP Rocket a pu réduire considérablement la taille des pages des deux thèmes grâce aux fonctionnalités permettant de supprimer les CSS inutilisés et de retarder l'exécution de JavaScript. Vous pouvez voir que la taille de la page de Divi a diminué de plus de moitié tandis que la taille de la page d'Avada a été réduite de plus de 200 Ko.

Ces améliorations, ainsi que la mise en cache et d'autres ajustements, sont à l'origine de l'amélioration des temps LCP.

Test n°2 : avec les constructeurs

Dans ce deuxième test, nous avons utilisé le constructeur visuel de chaque thème pour créer une page comparable en utilisant à peu près les mêmes modules. Le design est très simple - nous n'avons ajouté que trois éléments pour que les choses restent aussi égales que possible :

• Éditeur de texte avec un contenu lorem ipsum identique
• Bouton
• Contre-cercle

L'idée ici est principalement de voir quel "poids" supplémentaire est ajouté à la page lorsque vous activez le constructeur de chaque thème.

Voici les données uniquement pour les thèmes/constructeurs eux-mêmes :

Dans l'ensemble, vous pouvez voir que les résultats sont à peu près les mêmes que ci-dessus. Divi est sensiblement plus petit en termes de taille de page et, par conséquent, a un temps de peinture plus rapide.

De plus, aucun thème n'ajoute de poids supplémentaire à la page simplement parce que vous avez activé le constructeur visuel, ce qui signifie qu'il n'y a pas vraiment de pénalité pour l'utilisation du constructeur sur l'éditeur natif ( du moins pour les pages simples ).

Voici les données après l'ajout de WP Rocket :

Avec WP Rocket, vous pouvez voir le même résultat que le premier test. Désormais, les temps de peinture les plus importants de Divi et Avada sont beaucoup plus rapides et similaires en termes de performances, bien que Divi soit à nouveau un peu plus rapide. En plus de réduire considérablement le temps de peinture du plus grand contenu, WP Rocket a également été en mesure d'obtenir des réductions similaires de la taille du fichier comme lors du premier test.

Réflexions finales sur les performances Divi vs Avada

Divi et Avada sont similaires en ce sens que les deux vous donnent le pouvoir de créer un site Web personnalisé à l'aide de leurs constructeurs visuels par glisser-déposer.

Cependant, alors qu'ils vous donnent tous les deux ce contrôle, Divi est désormais nettement plus rapide en termes de performances prêtes à l'emploi.

La différence était minime lorsque nous avons effectué pour la première fois nos tests de performances Divi vs Avada. Cependant, après la mise à jour des performances de Divi 4.10 en août 2021, Divi est désormais beaucoup plus petit qu'Avada par défaut, ce qui fait que les temps de peinture de contenu les plus importants prêts à l'emploi de Divi représentent environ les deux tiers de ceux d'Avada.

Cependant, si vous utilisez WP Rocket avec sa mise en cache et les nouvelles fonctionnalités pour supprimer les CSS inutilisés et retarder l'exécution de JavaScript, vous pouvez apporter d'importantes améliorations aux deux thèmes.

Alors que Divi était encore légèrement plus rapide avec WP Rocket activé, la différence était beaucoup plus minime et Avada fonctionnait toujours bien.

Cela suggère que, bien que Divi soit un peu plus rapide, vous pouvez toujours créer un site à chargement rapide avec Avada tant que vous mettez en œuvre les meilleures pratiques de performance WordPress avec un outil comme WP Rocket.

Bien sûr, ces deux thèmes ne sont pas vos deux seules options. Si vous vous concentrez sur la vitesse et les performances, vous voudrez peut-être consulter nos collections de thèmes WordPress gratuits les plus rapides ou les thèmes WooCommerce les plus rapides si vous créez une boutique de commerce électronique.

Vous pouvez trouver des thèmes encore plus rapides que ces deux, y compris le thème Astra, qui a bien fonctionné dans notre comparaison de performances Divi vs Astra ( bien que la différence ne soit pas aussi grande grâce aux nouvelles améliorations de performances de Divi ).

Avez-vous encore des questions sur Divi vs Avada en matière de vitesse et de performances ? Demandez-nous dans les commentaires!