HTTP2 avec Apache, s'y mettre rapidement

Si vous souhaitez gagner beaucoup de performance et rapidement sur votre site internet, vous devriez pensez à activer le mode http2 de votre serveur apache2 et modifier votre html avec des balises <link> et <script> côté intégration.

Installation

sudo a2enmod ssl
sudo a2enmod http2
sudo systemctl restart apache2

Une fois l'installation faite et le serveur redémarré, vous devrez éditer votre fichier de configuration apache de votre site internet en rajoutant cette ligne dans votre virtualhost.

<VirtualHost *:443>
    #...
    Protocols h2 http/1.1
    #...
</VirtualHost>

Utilisation

Désormais vous pouvez utilisé les attributs rel & as dans vos balises html.

<head>
  <meta charset="utf-8">
  <title>Exemple de préchargement JS et CSS</title>
  <link rel="preload" href="style.css" as="style">
  <link rel="preload" href="main.js" as="script">
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <h1>Une page rapide...</h1>
  <script src="main.js" defer></script>
</body>

Voici les différentes valeurs à l'attribut as que vous pouvez ajouter:

  • audio : fichier audio, typiquement intégré avec l'élément <audio> ;
  • document : un document HTML destiné à être embarqué dans une <frame> ou dans une <iframe> ;
  • embed : une ressource à embarquer dans un élément <embed> ;
  • fetch : une ressource accessible via une requête fetch ou XHR, comme un ArrayBuffer ou un fichier JSON ;
  • font : un fichier de police ;
  • image : un fichier image ;
  • object : une ressource à embarquer à l'intérieur d'un élément <object> ;
  • script : un fichier JavaScript ;
  • style : une feuille de styles CSS ;
  • track : un fichier WebVTT ;
  • worker : un web worker JavaScript ou un worker partagé ;
  • video : un fichier vidéo, typiquement intégré avec l'élément <video>.

MarquandT

Ethical Hacker ~ Web Developper ~ File Hosting Provider ~ Crypto Enthusiast ~ Automation Expert Bitcoin donation: 32Uu4NKGnxSPC7UukYXVyRHwbppbQpKVki

2325