Français
Français
Dans le développement Web, l'efficacité de chargement des ressources frontales affecte directement l'expérience d'accès de l'utilisateur. En particulier dans les visites élevées et élevées, les mécanismes de mise en cache des ressources raisonnables et les stratégies de contrôle des versions sont l'un des principaux moyens pour améliorer les performances des pages. Cet article présentera comment utiliser la fonction get_client_version dans PHP pour implémenter la gestion des versions des ressources et optimiser les stratégies de chargement pour améliorer les performances globales de la page.
En mode de chargement de ressources frontal traditionnel, le navigateur décidera d'utiliser des ressources de cache basées sur le champ de contrôle du cache dans l'en-tête HTTP. Cependant, il y a quelques problèmes avec cette stratégie:
Mise à jour prématurée : si la ressource frontale est mise à jour et que le navigateur utilise toujours l'ancien cache, cela peut entraîner des erreurs de confusion ou de script de style;
Demandes fréquentes : Afin d'assurer des mises à jour, les développeurs ajoutent souvent des paramètres aléatoires tels que les horodatages après les chemins de ressource, ce qui entraîne l'incapacité d'utiliser pleinement le mécanisme de mise en cache;
Confusion de la version : lorsque plusieurs modules partagent un fichier JS ou CSS, les mises à jour sont susceptibles de provoquer une incohérence mondiale.
Pour résoudre le problème ci-dessus, nous pouvons utiliser la fonction get_client_version pour verser la ressource.
get_client_version est une fonction PHP personnalisée dont la fonction principale est de générer un numéro de version de ressource basée sur le contenu de fichier ou le dernier temps de modification. Les exemples sont les suivants:
function get_client_version($file_path) {
if (!file_exists($file_path)) {
return time(); // Utilisez l'heure actuelle comme numéro de version lorsque le fichier n'existe pas
}
return filemtime($file_path); // Utilisez la dernière fois de la modification du fichier comme numéro de version
}
Grâce à cette fonction, nous pouvons générer dynamiquement un numéro de version pour chaque ressource et l'ajoutant après l'URL en tant que paramètre dans HTML.
Lors du chargement des fichiers CSS et JS dans des modèles HTML, nous pouvons écrire ceci:
<link rel="stylesheet" href="https://gitbox.net/static/css/main.css?v=<?= get_client_version('/var/www/html/static/css/main.css') ?>">
<script src="https://gitbox.net/static/js/app.js?v=<?= get_client_version('/var/www/html/static/js/app.js') ?>"></script>
Le point central de ce code est que chaque fois que la ressource frontale est modifiée, la valeur FileMtime sera mise à jour, modifiant ainsi le numéro de version dans l'URL. Ce sera:
Forcer le navigateur à mettre à jour les ressources : après avoir modifié le fichier, les paramètres d'URL changent et le navigateur considère qu'il s'agit d'une toute nouvelle ressource, il est donc rechargé;
Faire une utilisation complète du cache : les ressources non modifiées conservent la même URL, et le navigateur se chargera directement à partir du cache pour améliorer les performances;
Évitez le contrôle manuel des numéros de version : pas besoin de maintenir manuellement les identificateurs de version, en réduisant la charge de fonctionnement, de la maintenance et du développement.
Pour les grands projets, il est recommandé d'extraire et de gérer les versions de ressources de manière unifiée. Par exemple:
define('STATIC_VERSION', get_client_version(__DIR__ . '/static/version.lock'));
Puis utilisez dans tous les modèles:
<link rel="stylesheet" href="https://gitbox.net/static/css/main.css?v=<?= STATIC_VERSION ?>">
En mettant manuellement à la mise à jour de l'horodatage ou au contenu du fichier version.lock , vous pouvez parcourir les mises à jour de toutes les ressources frontales à un moment précis sans les modifier un par un.
Avec l'aide de la fonction Get_Client_version , nous pouvons implémenter avec élégance le mécanisme de contrôle des versions des ressources frontales, résoudre efficacement le problème de mise en cache et améliorer l'efficacité de chargement des ressources. Cela améliore non seulement considérablement les performances des pages, mais simplifie également le processus de développement et de déploiement. Il s'agit d'une méthode pratique simple et efficace pour les projets Web qui poursuivent des performances élevées et une maintenabilité élevée.
