Étiquette : best practices

UPDATE: As of April 1, 2020, this site is no more running on Twenty Twenty theme. But I (almost once in a week) continue to seek for ways to make it more performant.

---

Cette note est aussi disponible en Français.

---

I am writing this note, previously in French, for the needs of my services page, which I recently created.

---

I wrote in an earlier note: The obsession of optimization [FR]. Today, I’m updating it.

So I’m obsessed with the performance of my site segbedji.com. Obsessed by its speed, its ranking in the main SERP, its security, etc…

This is a personal matter for me. Very personal. I present myself as a talented WordPress developer. It goes without saying that my site, built with this CMS should be a credible example of what I claim to offer!

I’m going to talk today (in issue 89 of my #DailyNotes ??) about the different things I’ve had to do, and continue to do on the site.

As I said before, my site has to be fast. Very fast. Excessively fast (well, within the limits of what is possible). So I had to opt for a WordPress lite theme that I could boost with a few tricks of my own.

The opportunity was too perfect with 2020, the new official default WordPress theme, coming with 5.3 (version for which I was part of the release team, coordinating the technical documentation).

2020 was designed by the excellent Anders Norén, and its development was coordinated by Ian Belanger. I myself made some fixes to the theme during the early stages of its development.

So I started with a child theme of 2020 whose source code is currently hosted on my GitHub account.

Pictures are usually one of the biggest resources on a website. So I’m careful to upload only images that have been optimized beforehand (size, weight). So I was more than happy when the automatic sizing feature for large images came with WordPress 5.3 (kudos to our dear Andrew for the work done on this).

Images are also converted to WebP format for further optimization. Also, I now only use it when strictly necessary.

Next to it, I have the excellent, must-have WP Rocket ? for site optimization. Basically, caching, preloading the cache, minimizing and compressing script and style files are provided.

I tested for a few weeks the image preloading feature, which I then left. This because WP Rocket adds a script on the site to manage it. One less script to load, which was going to deprive ?. Not me, that’s for sure. Also, Chrome natively supports preloading since a few weeks. So as soon as I have some time, I’ll contribute to the ticket opened by Morten on Core Trac to integrate it to WordPress.

Another aspect, the plugins. The popular belief is that the more active plugins you have on a WordPress site, the slower it is. That’s not exactly true. A site with 30 active plugins can be faster and more performant than one with 3.

I’ve limited the active plugins on the site to the bare minimum. The list can be found on my legal notice page.

I have also disabled comments on the site. So no more comment scripts to load (although this is not the main reason for this action).

PS: I noticed that some emojis are loaded in SVG since

w.org‘s servers, and that a script is added on all pages, even those that do not contain emojis. To be explored for later.

This note is also available in English.

---

J’écrivais dans une note précédente : L’obsession de l’optimisation. Aujourd’hui, j’en fais un update.

Alors je suis obsédé par les performances de mon site segbedji.com. Obsédé par sa vitesse, son ranking dans les principaux SERP, sa sécurité, etc…

C’est pour moi une affaire personnelle. Très personnelle. Je me présente comme un talentueux développeur WordPress. Il va de soi que mon site, construit avec ce CMS soit un exemple crédible de ce que je prétends offrir!

Je vais aborder aujourd’hui (dans le numéro 50 de mes #DailyNotes ??) les différentes choses que j’ai eu à faire, et que je continue de faire sur le site.

N°51 maintenant. Puisqu’hier j’ai eu la flemme de pousser cet article en ligne. Voir En attendant demain pour plus de détails.

Vitesse

Comme j’ai dit plus haut, mon site doit être rapide. Très rapide. Excessivement rapide (enfin dans les limites du possible). Il me fallait donc opter pour un thème WordPress lite que je pourrai booster à coups de petites astuces à ma sauce.

L’occasion était trop parfaite avec 2020, le nouveau thème par défaut officiel de WordPress, venu avec 5.3 (version pour laquelle j’ai fait partie de l’équipe de la mise à jour, en coordonnant la documentation technique).

2020 a été désigné par l’excellent Anders Norén, et son développement a été coordonné par Ian Belanger. J’ai moi même apporté quelques correctifs au thème lors des premières phases de son développement.

Donc je suis parti sur un thème enfant de 2020 dont le code source est actuellement hébergé sur mon compte GitHub.

Les images, c’est en général l’une des ressources les plus gourmandes sur un site. Je fais donc attention à n’uploader que des images au préalable optimisées (taille, poids). J’étais donc plus que ravi quand la fonctionnalité du dimensionnement automatique des grandes images est venue avec WordPress 5.3 (kudos à notre très cher Andrew pour le travail fait à ce niveau).

Les images sont aussi converties au format WebP pour plus d’optimisation. Aussi, je n’en utilise maintenant que quand c’est strictement nécessaire.

À côté, j’ai l’excellent, l’incontournable WP Rocket ? pour l’optimisation du site. En gros, cache, pré-chargement du cache, minification et compression des fichiers de script et style sont assurés.

J’ai testé pendant quelques semaines la fonctionnalité de preloading des images, que j’ai ensuite laissé. Cela parce que WP Rocket ajoute un script sur le site pour la gérer. Un script de moins à charger, qui allait s’en priver ?. Pas moi, c’est sûr. Aussi, Chrome supporte nativement le preloading depuis quelques semaines. Donc dès que j’aurai un bout de temps, je vais contribuer au ticket ouvert par Morten sur le Core Trac pour l’intégrer à WordPress.

Autre aspect, les extensions. La croyance populaire veut que plus on a d’extensions actives sur un site WordPress, plus celui ci est lent. Ce n’est pas exactement ça. Un site avec 30 extensions actives peut être plus rapide et performant qu’un autre avec 3.

J’ai limité au strict minimum les extensions actives sur le site. La liste se trouve sur ma page de mentions légales.

J’ai aussi désactivé les commentaires sur le site. Donc plus de scripts de commentaire à charger (bien que ce ne soit pas la raison première de cette action).

PS : J’ai remarqué que certains émojis sont chargés en SVG depuis les serveurs de w.org, et qu’un script est ajouté sur toutes pages, même celles qui ne contiennent pas d’émojis. À explorer pour plus tard.

Ah, il commence par devenir trop long ce post. Eh bien, on va s’arrêter là pour aujourd’hui. Demain je parlerai de comment je gère le référencement sur mon site.