Comment utiliser PHP et Lighthouse pour tester les performances d'un site Web

En tant que développeur Web, vous devez connaître l'importance des performances du site Web pour l'expérience utilisateur et le classement des moteurs de recherche. Pour maintenir un site Web performant, des tests de performances réguliers sont nécessaires pour détecter et optimiser les performances du site Web. Eh bien, dans cet article, nous présenterons comment utiliser PHP et Lighthouse pour tester les performances des sites Web.

Lighthouse est un outil open source développé par Google pour tester la qualité et les performances des applications Web. Il teste non seulement la vitesse d'une page Web, mais évalue également son accessibilité, ses meilleures pratiques et son optimisation pour les moteurs de recherche. De manière générale, nous pouvons utiliser Lighthouse dans le navigateur Chrome, mais si vous devez intégrer les tests Lighthouse dans votre pipeline ou script CI/CD, PHP est un bon choix.

Tout d’abord, vous devez vous assurer que PHP est installé et avoir des connaissances de base en PHP. Ensuite, nous devons installer le package PHP Lighthouse. Vous pouvez le faire en utilisant la commande suivante dans le terminal :

composer require nunomaduro/laravel-mix-phplighthouse --dev

Ici, nous utilisons le package nunomaduro/laravel-mix-phplighthouse car il fournit des commandes simples et faciles pour exécuter les tests Lighthouse et peut être facilement intégré à Laravel Mix . Si vous n'utilisez pas Laravel Mix, envisagez d'utiliser d'autres packages PHP Lighthouse.

Une fois l'installation terminée, nous devons définir certaines options de configuration de Lighthouse. Créez un fichier lighthouse.php dans le répertoire racine du projet et ajoutez le contenu suivant :

<?php
return [
    'temp_dir' => 'storage/app/lighthouse',
    'chrome_path' => '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
    'chrome_flags' => [
        '--show-paint-rects',
        '--headless',
    ],
    'audits' => [
        'first-contentful-paint',
        'largest-contentful-paint',
        'first-meaningful-paint',
        'speed-index',
        'total-blocking-time',
        'cumulative-layout-shift',
        'interactive',
        'uses-long-cache-ttl',
        'user-timings',
        'critical-request-chains',
        'redirects',
        'content-width',
        'font-display',
        'optimal-images',
    ],
];

Dans ce fichier de configuration, nous définissons plusieurs options :

• temp_dir : Spécifiez le répertoire où les données de test Lighthouse sont enregistrées.
• chrome_path : Spécifiez l'emplacement du navigateur Chrome.
• chrome_flags : spécifiez certains paramètres du navigateur Chrome, tels que --headless signifie fonctionner en mode sans tête.
• audits : spécifiez les éléments d'audit utilisés dans les tests Lighthouse. Nous avons sélectionné ici quelques éléments d'audit couramment utilisés, vous pouvez les ajouter ou les supprimer selon vos besoins.

Ensuite, créez un fichier nommé test.php dans le répertoire racine du projet et ajoutez le contenu suivant :

<?php

require_once __DIR__.'/vendor/autoload.php';

use NunoMaduroPHPUnitLaravelTestCasesBrowserTestCase;

class LighthouseTest extends BrowserTestCase
{
    public function testPerformance()
    {
        $this->artisan('lighthouse https://www.example.com --json --no-interaction');
        $output = json_decode(file_get_contents(base_path('storage/app/lighthouse/report.json')), true);
        $this->assertArrayHasKey('audits', $output['categories']);
    }
}

Dans ce fichier nous créons une classe de test nommée LighthouseTest. Dans cette classe, nous définissons une méthode de test appelée testPerformance. est créé. Dans cette méthode, nous utilisons les commandes Artisan pour exécuter les tests Lighthouse et enregistrer les résultats au format JSON dans le répertoire spécifié. Nous utilisons ensuite la méthode assertArrayHasKey pour vérifier si la section Audits est incluse dans les résultats des tests.

Vous pouvez maintenant exécuter le test. Utilisez la commande suivante dans le terminal pour exécuter le test :

./vendor/bin/phpunit --filter=LighthouseTest

Cela exécutera la méthode de test testPerformance dans la classe de test LighthouseTest que nous venons de créer. Si tout se passe bien, vous verrez que le test a réussi et qu'un fichier report.json a été généré dans le répertoire storage/app/lighthouse, contenant des informations détaillées sur les résultats du test.

En plus d'utiliser la ligne de commande, nous pouvons également intégrer les tests Lighthouse dans nos applications PHP. Supposons que nous ayons un script nommé performancelog.php pour enregistrer les performances de chaque page, nous pouvons alors ajouter le code suivant dans ce script pour exécuter le test Lighthouse :

require_once __DIR__.'/vendor/autoload.php';

use NunoMaduroPHPUnitLaravelTestCasesBrowserTestCase;

class LighthouseTest extends BrowserTestCase
{
    public function run()
    {
        $url = 'https://www.example.com';
        $this->artisan("lighthouse {$url} --json --no-interaction");
        $output = json_decode(file_get_contents(base_path('storage/app/lighthouse/report.json')), true);
        $categories = array_intersect_key($output['categories'], array_flip(['performance']));
        $score = array_sum(array_column($categories['performance']['auditRefs'], 'score')) / count($categories['performance']['auditRefs']);
        file_put_contents('performance.log', "{$url}: {$score}
", FILE_APPEND);
    }
}

$LighthouseTest = new LighthouseTest;
$LighthouseTest->run();

Dans cet exemple, nous utilisons Lighthouse pour tester l'URL spécifiée, et enregistrez le score dans le fichier performance.log. Vous pouvez exécuter ce script périodiquement pour surveiller les performances de votre application Web.

Dans cet article, nous expliquons comment utiliser PHP et Lighthouse pour tester les performances des sites Web. Que vous soyez développeur web ou administrateur système, vous pouvez utiliser ce tutoriel pour instrumenter et optimiser les performances de vos applications web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!