How to improve the performance of your Divi site

Updated on 07/09/2018 | Published on 31/03/2018 | 20 comments

Improving the performance of a WordPress site is essential. In a world where everyone is in a hurry - me first - no one has time to waste with the loading time of a website. Even if a blog article looks interesting, we become demanding and we want to read it right away, if not never!

Do you recognize yourself there? It's the "mobile effect": I'm at a bus stop, I have two minutes to waste so I document myself... the bus arrives and the page is still loading. Too bad, it will be for another time or never because when I get on the bus, I receive a tweet or another notification and I have already forgotten this great article on this super slow blog...

This is what happens when your website is too slow. In this article, we will look at how to improve the performance of a WordPress site....

This is a question that was asked to me by email by Sophie. In fact, the real question was: "how can DIVI files be made lighter? Because in terms of speed, it's not great. Can we get rid of unnecessary JS files, for example? »

Before answering this question, let's return to some essential points....

 

What are the advantages of having a high-performance website?

This is a question that may seem a little silly, but many site creators prefer functionality and aesthetics to performance. It is often the last wheel of the carriage (with accessibility and that's a shame). Yet you have so much to gain by improving the performance of your site:

First, search engines such as Google prioritize search results for high-performance and fast websites. To improve the user experience, Google more easily suggests sites that load quickly in its first few pages of results. As well as slow loading websites will not be ranked as highly as others. That is why it is so important to Google created the AMP project.

Second, a high-performance and fast website significantly improves the user experience. This famous picture story I told you at the beginning of the article is not a legend. It's very real: the Internet user doesn't like to wait even a fraction of a second too long and won't hesitate to leave your site and look for another one to meet his needs.

Finally, as a website designer, you must offer high-performance websites because they are a testimony to your skills and know-how. Imagine if you want to promote your portfolio but it only offers examples of slow sites, do you think the prospect will want to entrust you with his project?

 

Why improve the performance of a WordPress site?

Some say that "WordPress is slow", but before blaming this CMS, it is important to understand how it works and why it can affect the speed of page loading.

To work, a WordPress site needs a MySQL database in which it stores the content of pages, articles and various settings while the files are stored on a server (Divi theme, plugins and images).

Each time a user requests a URL (an article or a page), a database query is made to display the related content.

This is why it is said that WordPress (like other CMS) loads more slowly than a static website and requires a little more attention in terms of performance.

 

How to test the speed of a web page?

Have you already tested the performance of your site? Did you know that there are free online tools that will give you an estimate of the weight / performance / speed of your site? Here they are:

You don't have to copy and paste the URL of your site (or the neighbour's) to check its performance.

A word of advice: take a screenshot during your first test. Thus, after having carried out the corrective actions aimed at improving the performance of your website, you will be able to redo a test and see your progress.

 

How to improve the performance of a WordPress site?

In her email, Sophie asked me if it was possible to delete Divi files that would be useless to us and to my knowledge, we can't do this action in a "clean" way.

In fact, in a way, we could do it, but it would have consequences: as soon as you change a theme, the changes that have been made will disappear as soon as we make the next update of the theme.

That's why WordPress allows us to create a child theme, just like I do explains it to you in this article. However, this child theme allows us to add FEATURES but does not allow us to delete FILES. A child theme is therefore used to "overload" and not to "unload".

To improve the performance of a Divi site, you will then have to perform a series of actions and choices:

NB: these improvements can be applied to all WordPress sites, even those not using the Divi theme.

 

1 - Choose a good host

I think this step is essential. Although some users swear by the "free" and "low-cost", if you care about your site or blog, it is not on this point that you should save money.

A poor hosting solution is one of the first points where performance is lacking. For my part, I only advise my customers 3 hosting providers:

  • OVH: even if this host sometimes encounters some temporary failures on some of its servers, it remains a reliable value and I greatly appreciate the quality of the telephone support that always provides a solution to the problem. Be careful, I recommend never to subscribe to the "first price" offer.
  • WP SERVER: a top-notch hosting that only handles WordPress sites, has advanced security, ultra-intuitive use and high performance. I particularly appreciate the quality of the very responsive support: the little "live chat" button never kept me waiting more than a minute (discover WP Server).
  • O2SWITCH: it is an alternative to the other two hosts.

These three suppliers are French, which is really a "plus" when you have to exchange with them... In general, I advise my customers to run away from the other hosts.

 

2 - Configure your hosting correctly

Even if these configurations are closely linked to the options offered by the host, make sure you have chosen the latest version of PHP: PHP 7. This is not new but version 7 considerably improves the performance of a website.

 

3 - Optimize your images for the Web

Photos and images are WordPress' Achilles heel. Users want to display a lot of them, in sliders, in carousels, they want them in high definition etc... and this is the DRAM!

Images are one of the first causes of slowness in loading a site. I therefore advise you to pay particular attention to this.

Améliorer la performance de Divi avec Imagify

Example of gain on a single image using the Imagify plugin to improve the performance of a WordPress site

 

You will first have to process the images upstream, before uploading them to your site - I tell you everything in this full article dedicated to image optimization for WordPress - but you will also need to act after the download by using a compression plugin like Imagify. This plugin is magical and further reduces the weight of each of your images by half.

 

4 - Use a cache plugin

I think there is no secret, if you really want to increase the performance of your site with Divi (or any other WordPress theme), you will have to consider installing and configuring a cache plugin.

A cache plugin allows you to create a static copy of the page or article of your site and store it in the user's browser, thus eliminating the step of going to the database to retrieve the requested content.

As a result, this page stored in the user's browser cache will be offered again - during a future visit to your site - in a fraction of a second instead of going back and forth in the database. Exception made if the user clears his navigation history....

Cache plugins are sometimes difficult to configure and can "break" your site. Don't worry, just uncheck some options to get everything back to normal. For my part, I use the extension WP Rocket (premium plugin in French) but it is not there are freemiums.

 

5 - Use a CDN if necessary

The principle of a CDN (Content Delivery Network) is to provide data to your users from a closer server source. When a user enters a URL to display your site, the data must travel from their location to your server, then return to their location to display the requested page. The physical distance between these two points can have an effect on the page loading time. This way, Internet users close to your server will be able to see your site more quickly.

NB 1: not all sites need a CDN but you should consider this option if you have many resources on your pages such as images, style sheets, videos etc. and if the traffic is high and your hosting does not follow.

NB 2: setting up a CDN will only work if you have already set up a cache plugin.

 

6 - Beware of plugins

When you discover WordPress, you can get excited at first and install anything and everything as a plugin. It's super addictive and it's free, in most cases. So we tend to add some unintentionally.

Plugins can be a source of slowing down your site. It is not really the number of extensions installed that makes the difference but rather the quality of the code of each plugin, the requests it makes and the files it embed.

If you do a performance test of your site with one of the tools I was talking about at the beginning of the article, you will be able to check which requests are the longest.

Depending on the results, you may/will have to make a decision about some plugins... Do you really need this plugin that makes a great effect on your images but adds lots of files that plague the user experience? Do you really need to display your latest Instagram photos or your Facebook news feed?

 

7 - Les Embeds: not always friends

Embeds are files embedded in your WordPress pages or articles. There are all kinds of them such as YouTube / Vimeo videos, tweets, Pinterest maps, Google maps.

If you look at the code and loading time of your pages, you can check which resources take the most time and slow down the loading of your site.

Améliorer la performande de Divi en évitant les embeds

Here is an example of latency due to a Google Map

 

In this case too you will have to make choices: do you really need a Google Map on your homepage? Shouldn't you rather insert it in the contact page for example, which is a less visited page than the home page? Or even better, why not replace the Google Map with a Call-to-Action that leads to the online Map link?

 

8 - The fonts also play!

Did you know that the fonts you choose have an impact on the loading time of your WordPress site?

A font is a collection of glyphs that contain a lot of information, some of which have additional metadata.

Les polices peuvent ralentir le chargement d'un site

Example of a blog using special fonts: fonts can slow down the loading of pages on a site

 

Imagine the impact of using several fonts on the same page, especially if these fonts are complex.

 

Conclusion on the performance of its Divi site

To conclude, I wanted to come back to the theme of Divi and its performance. It is obvious that the choice of theme will have an impact on the loading of your site.

Moreover, many premium themes sold on ThemeForest focus on functionality and design rather than performance: generally, performance does not sell, while the pretty carousel on the homepage does!

 

There was a time when the Divi theme had some problems of slowness, indeed, but a major update in August 2017 has fixed many problems as explained in this article. This is one of the advantages of choose a theme which is maintained and improved on a regular basis.

So if your site using the Divi theme is very slow, it is recommended to check the 8 points listed above and see if some parameters could be improved. But above all, here are the 4 most important criteria on which you must absolutely make an effort (without concessions):

  • the choice of a good host
  • the optimization of your images
  • caching your site
  • the elimination of plugins that lead the loading of the site
Améliorer la performance d'un site WordPress Divi

2,262 words

9

You should like it too:

Vidéo mise en avant dans les articles Divi avec ACF

Video highlighted in Divi articles with ACF

This step-by-step tutorial shows you how to create a new custom field in your Divi Articles to add highlighted YouTube videos. You can do this easily with the Theme Builder and ACF.

20 Commentaires

  1. sophie

    Merci beaucoup pour cet article et d’avoir répondu à mes questions. A moi de jouer maintenant !
    Bon week-end

    Sophie

  2. Tilto

    Je me pose la question a propos du plug in de cache. Sachant que divi peur compter les java et css, est-ce redessine en plus ? si oui que faut il configurer ou pas pour ne pas faire un calcul double ?

  3. Lycia

    Salut Tilto.
    Je ne sais pas si tu parle de la minification ? Pour ma part, je ne fais pas les choses en double te j’utilise simplement les options proposées par WP Rocket. Est-ce que cela répond à ta question ?

  4. David

    Bonjour,
    Merci pour cet article qui apporte quelques billes supplémentaires pour gérer la performance d’un site DIVI.

    A ce sujet, je me demandais si 1 article remplis de DIV n’était pas complexe à lire pour un robot et si toutes ces DIV à répétitions n’alourdissaient pas la page avec, pour conséquence, un ralentissement du chargement ? D’après votre expérience, est-ce que cela pourrait être le cas ?

  5. Lycia

    Bonjour David, je ne pense pas que du HTML puisse alourdir le temps de chargement. Par contre ça peut être néfaste pour le SEO car il existe des balises plus pertinentes. Ce qui fait le plus de mal c’est le poids des images. IMAGIFY est très bien pour les alléger. J’avais écrit un article sur WPFORMATION qui explique comment s’en servir, si ça vous intéresse. Faites un test de poids d’une de vos pages et regardez dans l’audit ce qu’ils préconisent. Ça peut venir d’autres choses.

  6. Vincent

    Je confirme pour la version PHP. Je suis passé de PHP5.quelquechose à PHP7, le gain est énorme.
    PS: étonnement dans cet article, les liens externes que tu fais, ne sont pas en nofollow.

  7. Lycia

    Hello Vincent. Je met en nofollow uniquement les liens d’affiliation puisque c’est ce que Google recommande. Pour les autres liens, ils sont toujours en follow.

  8. Frank Gav

    Merci beaucoup!

  9. Lycia Diaz

    Merci Frank !

  10. sandrine

    Bonjour Lycia ! Merci beaucoup ! Pour la mise en cache j’ai testé W3 Total cache mais il semble qu’il soit incompatible avec DIVI avez vous un puglin à me conseiller parmi les freemiums ?

  11. Lycia Diaz

    Salut Sandrine,
    Es-tu sûre que Divi n’est pas compatible avec W3 Total Cache ? Ça me parait bizarre (mais pourquoi pas après tout…). Y’a peut-être un conflit ailleurs ?
    Par contre, je ne peux pas te conseiller de plugin de cache gratuit ou freemium car je n’ai toujours utilisé que WP Rocket (premium).

  12. sandrine

    Merci de ta réponse Lycia, oui je te confirme qu’il était responsable d’un problème d’affichage au niveau de l’entête du site. j’ai personnalisé le css pour le menu et ça ne passait pas du tout. Je l’ai probablement mal configuré mais il est assez complexe. Aux regard des forums je n’ai pas été la seule a rencontrer des difficultés en voulant associer Divi à WP3TC. J’apprécie WP Rocket et le trouve super efficace mais les personnes que j’assiste n’ont pas de buget : du free du free du free… j’ai testé WP super cache. Pas de problème si ce n’est que sur GTmetrix le site apparait toujours comme si je n’avais pas activé la mise en cache. Idem si j’autorise la mise en cache via htacces. étrange. je vais bien finir par trouver. merci en tout cas

  13. Lycia Diaz

    OK Sandrine, je comprends…
    Mais il faut aussi que les gens comprennent que quand c’est gratuit, tu en as parfois pour ton argent.
    Il y a un proverbe qui dit « je n’ai pas les moyens de m’acheter du pas cher »… Et oui, quand tu construis une maison avec des matériaux à bas coût, il est fortement probable que dans 2 ans, tu doives tout rénover. Au final, ça t’aura coûté le double. Alors que si tu avais mis les moyens au départ, tu serais tranquille pour les 15 ou 20 prochaines années. C’est pareil dans le web… Et c’est ça qu’il faut faire comprendre aux clients. Sachant qu’un freelance ou un dev facturera plus cher pour « réparer » que pour « créer ». Bref, j’espère que tu arriveras à régler ce problème de cache. Mais il me semble que WP Super Cache a bonne presse ? À voir…

  14. sandrine

    Merci Lycia; Tu prêches une convaincue ! Problème résolu je suis passé à comet., Gtmetrix a apprécié, encore faible à mon goût sur pingdom mais on avance.
    A bientôt

  15. Lycia Diaz

    Merci Sandrine !

  16. Cedlannoy

    Super ! Par conte j’ai toujours un doute sur la taille du style.css plus de 600k c’est beaucoup quand même !

  17. Grégoire

    Hello,

    L’un des grands axes d’amélioration du temps de téléchargement d’un site, c’est les images. Cela représente souvent plus de 60% du poids de la page.
    On peut conseiller alors de faire du lazyloading et d’essayer de mettre en place le webP sur son site.

  18. didouche

    Bonjour, j’ai de gros probléme avec mon site, il bug, il est lent, j’aimerais bien que quelqu’un puisse m’aider, voici un de mes liens: https://transponyx.com/ . Merci!

  19. Lycia Diaz

    Salut Didouche !
    Met une extension de cache (WP Rocket par exemple) et vérifie chez ton hébergeur quelle est la version PHP qui est utilisée. Tu devrais avoir au moins la version 7.3 de PHP. Cela peut vraiment faire la différence !

  20. Clic Monkey

    Bonjour, votre article est très complet et très pertinent.

    Souvent le problème sur WordPress provient des modules. Il y a une forte communauté donc il y a un module pour tout. Cependant l’ajout de module est à modérer pour optimiser le temps de chargement mais aussi pour des contraintes de sécurité.

    Par contre s’il y a un module que nous recommandons c’est bien WP Rocket.

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Pin It on Pinterest

Shares
Share This