Merge pull request #7 from o2switchfr/performance-optimization

Performance optimization + fix errors

Author: o2alexis

.github/workflows/deploy.yml

@@ -24,6 +24,15 @@ jobs:
         with:
           name: build
           path: build
+      
+      - name: Add resource hints in the .htaccess
+        run: |
+          cd build
+          for i in assets/css/*.css ; do echo "Header add Link '</$i>; rel=preload; as=style; fetchpriority=high'" >> .htaccess ; done
+          for i in assets/js/*main*.js ; do echo "Header add Link '</$i>; rel=preload; as=script; fetchpriority=high'" >> .htaccess ; done
+          for i in assets/fonts/*-{Regular,Bold,SemiBold}*.woff2 ; do echo "Header add Link '</$i>; rel=preload; as=font; type=font/woff2;  fetchpriority=high; crossorigin'" >> .htaccess ; done
+          for i in assets/images/footer-dark-bg* ; do echo "Header add Link '<$i>; rel=preload; as=image; type=image/svg+xml'" ; done  
+          cd -
           
       - name: Get runner's public IP
         id: ip

docs/cpanel/logiciels/hebergement-php-multi-version.mdx

@@ -81,27 +81,27 @@ qui sont indispensables au bon fonctionnement de la plupart des scripts.
 
 L'outil de changement de version de PHP contient plusieurs zones intéressantes.
 
-<span className="">A</span>  L'onglet **Extension** permet de charger/décharger des modules PHP.
+<Badge text="A" type="danger" /> L'onglet **Extension** permet de charger/décharger des modules PHP.
 
-<span className="">B</span>  L'onglet **Options** permet d'accéder à l'outil permettant de modifier certains réglages
-PHP. La partie **Options** permet de modifier le `php.ini`
+<Badge text="B" type="danger" />  L'onglet **Options** permet d'accéder à l'outil permettant de modifier certains
+réglages PHP. La partie **Options** permet de modifier le `php.ini`
 
-<span className="">C</span>  Le bouton **Reset to default** permet de rétablir les réglages par défaut. En cas d'erreurs,
-ça permet de revenir sur la configuration de base de l'hébergement.
+<Badge text="C" type="danger" />  Le bouton **Reset to default** permet de rétablir les réglages par défaut. En cas
+d'erreurs, ça permet de revenir sur la configuration de base de l'hébergement.
 
-<span className="">D</span>  Dans le menu déroulant s'affiche la version de PHP courante / ou la version de PHP
+<Badge text="D" type="danger" /> Dans le menu déroulant s'affiche la version de PHP courante / ou la version de PHP
 sélectionné dans le cadre d'un changement de version.
 
 À cet instant les versions suivantes de PHP sont proposées : PHP 4.4, PHP 5.1, PHP 5.2, PHP 5.3, PHP 5.4, PHP 5.5,
 PHP 5.6, PHP 7, PHP 7.1, PHP 7.2, PHP 7.3, PHP 7.4, PHP 8.0, PHP 8.1, PHP 8.2 et PHP 8.3 (mis à jour le 03/10/2024)
 
-<span className="">E</span>  Le bouton **Apply** permet de valider les changements dans la version de PHP ou dans la
-liste des modules PHP chargés. Lorsque le bouton s'affiche, cela signifie qu'il y a un réglage en attente qui n'a pas
+<Badge text="E" type="danger" />  Le bouton **Apply** permet de valider les changements dans la version de PHP ou dans
+la liste des modules PHP chargés. Lorsque le bouton s'affiche, cela signifie qu'il y a un réglage en attente qui n'a pas
 été enregistré. Lorsque tout est enregistré, le bouton disparait.
 
-<span className="">F</span>  Vous pouvez cocher/décocher des module PHP librement. Attention, cela peut avoir un impact
-sur vos sites internet, ne désactivez pas des modules sans savoir à quoi ils correspondent. Certains modules comme MySQL
-ou PDO sont nécessaires au fonctionnement de la majorité des sites internet.
+<Badge text="F" type="danger" />  Vous pouvez cocher/décocher des module PHP librement. Attention, cela peut avoir un
+impact sur vos sites internet, ne désactivez pas des modules sans savoir à quoi ils correspondent. Certains modules
+comme MySQL ou PDO sont nécessaires au fonctionnement de la majorité des sites internet.
 
 ### Changer la configuration PHP php.ini
 
@@ -119,18 +119,20 @@ pouvez changer les options les plus courantes, par exemple (non exhaustif) :
   * **display_errors** : permet l'affichage ou non des erreurs PHP (off par défaut)
   * **max_execution_time** : temps d'exécution max d'un script PHP
   * **memory_limit** : mémoire max allouée pour chaque processus PHP
-  * **post_max_size** et **upload_max_filesize** : permettent d'augmenter la taille des fichiers envoyés via PHP (upload http)
+  * **post_max_size** et **upload_max_filesize** : permettent d'augmenter la taille des fichiers envoyés via PHP (upload
+    http)
 
 Ces modifications sont très rapides à être effectives, la prise en compte est quasi-immédiate. Vous pouvez vérifier très
-simplement si vos modifications sont prises en compte en plaçant à la racine de votre site un fichier `info.php` avec ce code :
+simplement si vos modifications sont prises en compte en plaçant à la racine de votre site un fichier `info.php` avec ce
+code :
 
 ```php title="info.php"
 <?php
 phpinfo();
 ```
 
-En vous rendant sur la page `info.php` avec un navigateur web, la configuration PHP s'affichera. Pensez à bien supprimer ce
-fichier info.php une fois vos tests terminés.
+En vous rendant sur la page `info.php` avec un navigateur web, la configuration PHP s'affichera. Pensez à bien supprimer
+ce fichier info.php une fois vos tests terminés.
 
 ## Usages avancés
 
@@ -163,13 +165,17 @@ $PATH](/guides/langages-supportes-php-node-ruby-python)
 
 ## Erreurs courantes
 
-
 Si vos modifications ne sont pas prises en comptes, ça vient généralement de l'une de ces trois raisons :
-  * vous avez mal validé votre version de PHP avec le bouton **Apply**. C'est très fréquent comme erreur, pensez à le vérifier même si cela paraît simple.
-  * vous avez des règles dans votre fichier `.htaccess` qui tente de redéfinir la version de PHP.
-Cela arrive souvent lorsqu'il y a une migration d'un hébergeur à l'autre. Chaque hébergeur à sa méthode pour traiter les versions et la configuration de PHP.
-Ce que vous avez dans votre fichier .htaccess (addHandler, addType etc...) peut causer des conflits avec votre hébergement. Dans ce cas, il faut supprimer les lignes concernées ou mettre un # devant pour les neutraliser.
-  * vous avez un fichier `php.ini` à la racine de votre site. Cela entre en conflit avec le fonctionnement du sélecteur de versions de PHP, il faut désactiver ce php.ini en supprimant le fichier ou en le renommant.
-  * pour des versions de PHP inférieures à PHP 7, pensez à cocher le module **mysql** dans la liste des extensions, ce dernier ne sera pas coché par défaut (car supprimé depuis PHP 7)
+  * vous avez mal validé votre version de PHP avec le bouton **Apply**. C'est très fréquent comme erreur, pensez à le
+    vérifier même si cela paraît simple.
+  * vous avez des règles dans votre fichier `.htaccess` qui tente de redéfinir la version de PHP. Cela arrive souvent
+lorsqu'il y a une migration d'un hébergeur à l'autre. Chaque hébergeur à sa méthode pour traiter les versions et la
+configuration de PHP. Ce que vous avez dans votre fichier .htaccess (addHandler, addType etc...) peut causer des
+conflits avec votre hébergement. Dans ce cas, il faut supprimer les lignes concernées ou mettre un # devant pour les
+neutraliser.
+  * vous avez un fichier `php.ini` à la racine de votre site. Cela entre en conflit avec le fonctionnement du sélecteur
+    de versions de PHP, il faut désactiver ce php.ini en supprimant le fichier ou en le renommant.
+  * pour des versions de PHP inférieures à PHP 7, pensez à cocher le module **mysql** dans la liste des extensions, ce
+    dernier ne sera pas coché par défaut (car supprimé depuis PHP 7)
 
 

docs/nom-de-domaine/code-transfert/ovh.mdx

@@ -36,7 +36,7 @@ chez OVH.
 <Badge text="3" /> Puis cliquer sur le nom de domaine 3  que vous souhaitez transférer.
 
 <Image
-    src="/img/docs/nom-de-domaine/code-transfert/code-de-transfert-online-1.png"
+    src="/img/docs/nom-de-domaine/code-transfert/recuperer-code-transfert-ovh-1.png"
     title="Première étape pour débloquer le domaine chez OVH"
     caption="Première étape de la procédure pour récupérer le code de transfert chez OVH"
     alt="Capture d'écran de l'interface de gestion OVH pour récupérer le code de transfert"
@@ -46,7 +46,7 @@ chez OVH.
 demande la confirmation, il faut valider pour continuer.
 
 <Image
-    src="/img/docs/nom-de-domaine/code-transfert/code-de-transfert-online-1.png"
+    src="/img/docs/nom-de-domaine/code-transfert/recuperer-authcode-ovh-2.png"
     title="Désactiver la protection des transferts de domaine chez OVH"
     caption="Débloquer le nom de domaine chez OVH"
     alt="Capture d'écran de l'interface de gestion OVH pour débloquer le nom de domaine"

src/components/Image/index.tsx

@@ -20,7 +20,7 @@ export default function Image ({src, alt, caption, additionalClass, size, title}
     return (
 
         <figure className={clsx('tutorial-img', additionalClass)}>
-            <Zoom><img data-zoomable src={src} alt={alt} title={_title}/></Zoom>
+            <Zoom><img loading="lazy" data-zoomable src={src} alt={alt} title={_title}/></Zoom>
             <figcaption>{caption}</figcaption>
         </figure>
     );

src/components/_data/tools.ts

@@ -65,7 +65,7 @@ const cpanelTool = {
         icon:"imunify-antivirus",
         cat: cpanelCategories.security,
         to: '/cpanel/securite/antivirus-imunify',
-        offers: all_shared_hosting,
+        offers: [offers.cloud, offers.pro],
     },
     'o2switch-ipxtender': {
         name:"ipXtender",

src/css/o2switch.scss

@@ -344,8 +344,10 @@
   }
 }
 
-
 @media (max-width: 800px) {
+  .navbar__title {
+    display: none;
+  }
   .flex-grid {
     display: block;
     .col {

src/pages/index.mdx

@@ -20,10 +20,10 @@ questions fréquentes.
     <div className="col">
         <div className="card shadow--lw">
             <div className="card__header">
-                <h3><FAIcon icon="fa-solid fa-screwdriver-wrench" size="sm" /> Hébergement web mutualisé</h3>
+                <h3><FAIcon icon="fa-solid fa-screwdriver-wrench" size="sm" /> Hébergement web</h3>
             </div>
             <div className="card__body">
-                <p>Découvrez tous les outils des hébergements web mutualisés. Chaque outil cPanel est documenté.</p>
+                <p>Découvrez tous les outils des hébergements web o2switch. Chaque outil cPanel est documenté.</p>
             </div>
             <div className="card__footer">
                 <a href="/cpanel" title="Documentation des outils cPanel">Découvrir les outils cPanel <FAIcon icon="fa-solid fa-arrow-right-long" size="sm" /></a>
@@ -40,7 +40,7 @@ questions fréquentes.
                 <p>Découvrez l'aide pour l'espace client, qui permet de gérer les commandes et l'administratif</p>
             </div>
             <div className="card__footer">
-                <a href="/espace-client" title="Pages d'aide pour l'espace client o2switch">Découvrir l'aide pour l'espace client <FAIcon icon="fa-solid fa-arrow-right-long" size="sm" /></a>
+                <a href="/espace-client" title="Pages d'aide pour l'espace client o2switch">Découvrir l'espace client <FAIcon icon="fa-solid fa-arrow-right-long" size="sm" /></a>
             </div>
         </div>
     </div>    
@@ -87,7 +87,7 @@ questions fréquentes.
                 <p>Parcourez la liste des questions fréquences et obtenez une réponse rapidement</p>
             </div>
             <div className="card__footer">
-                <a href="/questions" title="Naviguez dans les questions fréquentes">Parcourir les questions fréquentes <FAIcon icon="fa-solid fa-arrow-right-long" size="sm" /></a>
+                <a href="/questions" title="Naviguez dans les questions fréquentes">Voir les questions fréquentes <FAIcon icon="fa-solid fa-arrow-right-long" size="sm" /></a>
             </div>
         </div>
     </div>

static/.htaccess

@@ -200,12 +200,16 @@ Header set Cache-Control "max-age=15768000, public"
 </FilesMatch>
 
 <FilesMatch ".(jpg|jpeg|png|gif|ico|svg|swf|gz|css|js)$">
-Header set Cache-Control "max-age=43200, public"
+Header set Cache-Control "max-age=604800, public"
 </FilesMatch>
 
 <FilesMatch ".(htm|html)$">
 Header set Cache-Control "max-age=3600, public"
 </FilesMatch>
 
 Header unset ETag
-FileETag none
+FileETag none
+
+# Resources Hints 
+Header add Link '<https://search.o2swit.ch>; rel=dns-prefetch'
+Header add Link '</img/misc/o2switch-logo-dark-bg.svg>; rel=preload; as=image; type=image/svg+xml'

typesense.config.json

@@ -8,7 +8,18 @@
     ],
     "sitemap_alternate_links": true,
     "stop_urls": [
-      "/tests"
+      "/cpanel/", 
+      "/cpanel/o2switch/",
+      "/cpanel/domaines/",
+      "/cpanel/emails/", 
+      "/cpanel/bases-de-donnees/",
+      "/cpanel/logiciels/", 
+      "/cpanel/securite/", 
+      "/cpanel/fichiers/", 
+      "/cpanel/outils/", 
+      "/cpanel/outils-avances/", 
+      "/cpanel/mesures/", 
+      "/cpanel/preferences/"
     ],
     "selectors": {
       "lvl0": {