Au fur et à mesure que votre agence compte de nouveaux clients, le maintien de performances élevées sur tous les sites que vous gérez peut rapidement devenir un défi. Des extensions mal codées, des images non optimisées et des scripts tiers peuvent ralentir les sites de vos clients et réduire progressivement les scores PageSpeed Insights (PSI).

Au lieu de vérifier manuellement chaque site WordPress, vous pouvez automatiser la surveillance des performances sur l’ensemble de vos sites et vous concentrer sur l’investigation des anomalies uniquement lorsqu’elles surviennent, ce qui permet à votre équipe d’économiser des heures de travail chaque mois grâce à des vérifications automatisées simples et efficaces.

Dans cet article, vous apprendrez comment automatiser votre flux de travail pour surveiller les performances de tous les sites WordPress hébergés par Kinsta de votre agence en utilisant conjointement l’API Kinsta et l’API Google PageSpeed Insights. Pour finir, vous apprendrez à partager ces données avec votre équipe en temps réel en utilisant les webhooks de Slack et à automatiser le processus avec une tâche cron.

Passionnant, n’est-ce pas ? Commençons par le commencement.

Aperçu du flux de travail : Kinsta vers PageSpeed Insights vers Slack

Le script relie trois API. Kinsta, Google PageSpeed Insights et Slack, afin d’automatiser la surveillance des performances du site.

Commencez par interroger l’API Kinsta pour récupérer les domaines et les environnements de votre site web. Cela permet de s’assurer que votre liste de domaines reste à jour au fur et à mesure que vous ajoutez des sites clients.

Ensuite, pour chaque site renvoyé par l’API Kinsta, votre script utilise l’API Google PSI pour extraire des mesures clés : Score de performance (0-100), First Contentful Paint (FCP) et Largest Contentful Paint (LCP).

Enfin, le script publie ces mesures, le nom du site, les trois scores et un lien PageSpeed Insights sur un canal Slack désigné.

Configuration des outils

Avant de coder, générez deux clés API et effectuez des configurations rapides.

Utilisation de l’API Kinsta : vérifiez les autorisations et générez votre clé API

L’API Kinsta nécessite une clé API générée à partir d’un compte disposant d’autorisations spécifiques. Dans notre exemple, il s’agit du propriétaire ou de l’administrateur de l’entreprise.

Pour créer une clé API Kinsta, connectez-vous à MyKinsta et suivez les étapes suivantes :

  • Naviguez jusqu’à la page des clés API (Votre nom > Réglages de l’entreprise > Clés API).
  • Cliquez sur Créer une clé API.
  • Définissez l’expiration et donnez un nom unique à votre clé.
  • Cliquez sur Générer.
Créer une clé API dans MyKinsta.
Créer une clé API dans MyKinsta.

Notez que c’est la seule fois où vous pouvez voir votre clé API. Copiez-la et conservez-la en lieu sûr.

La deuxième chose dont vous avez besoin est votre identifiant d’entreprise MyKinsta. Vous pouvez facilement le trouver dans la chaîne de requête de l’URL de votre tableau de bord MyKinsta (recherchez le paramètre idCompany ).

Avec ces données, vous pouvez accéder à l’API Kinsta et utiliser cURL pour demander une liste des sites de votre entreprise. Ouvrez votre outil de ligne de commande préféré et entrez la commande suivante, en remplaçant <YOUR_COMPANY_ID> et <YOUR_API_KEY> par vos informations d’identification.

curl -X GET "https://api.kinsta.com/v2/sites?company=<YOUR_COMPANY_ID>" 
	 -H "Authorization: Bearer <YOUR_API_KEY>"

Si l’identifiant de votre entreprise et la clé API sont corrects, vous devriez recevoir une réponse JSON structurée comme ceci :

{
	"company": {
		"sites": [
			{
				"id": "YOUR_SITE_ID",
				"name": "my-wordpress-website",
				"display_name": "My WordPress website",
				"status": "live",
				"site_labels": []
			}
		]
	}
}

Comme vous pouvez le constater, il manque à cette réponse un élément d’information essentiel : l’URL du site web. Pour récupérer le domaine principal de chaque environnement, vous devez ajouter le paramètre include_environments=true à la chaîne de requête. Avec ce paramètre, l’API renvoie également des données détaillées pour chaque environnement (live et staging), y compris le domaine primaire. Voici une réponse générique :

{
	"company": {
		"sites": [
			{
				"id": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
				"name": "firstsite",
				"display_name": "First site",
				"status": "live",
				"siteLabels": [
					{
						"id": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
						"name": "Do not remove"
					}
				],
				"environments": [
					{
						"id": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
						"name": "live",
						"display_name": "Live",
						"is_blocked": false,
						"id_edge_cache": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
						"cdn_cache_id": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
						"is_opt_out_from_automatic_php_update": false,
						"web_root": "/release_v1",
						"image_optimization_type": "lossy",
						"is_additional_sftp_accounts_enabled": false,
						"is_premium": false,
						"wordpress_version": "6.3.1",
						"domains": [ ... ],
						"primaryDomain": {
							"id": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
							"name": "example.com",
							"site_id": "54fb80af-576c-4fdc-ba4f-b596c83f15a1",
							"is_active": true,
							"type": "live"
						},
						"ssh_connection": { ... }
						},
						"container_info": { ... }
					}
				]
			}
		]
	}
}

Ensuite, vous devez générer une application Google PageSpeed Insights et une clé API.

Générer une clé API pour Google PageSpeed Insights

L’étape suivante consiste à créer une clé API pour accéder au service Google PageSpeed Insights. Connectez-vous à la Google Cloud Console et suivez les étapes suivantes :

Étape 1 : créez un nouveau projet ou ouvrez un projet existant. Pour cet article, nous avons créé un nouveau projet de Performance monitoring.

Page du projet Performance Monitoring dans la console Google Cloud
Page du projet Performance Monitoring dans la console Google Cloud

Étape 2 : Naviguez vers APIs & Services > Library, puis recherchez PageSpeed Insights API en bas de la page et cliquez sur le bouton.

Sélectionner l'API PageSpeed Insights dans la bibliothèque d'API de Google Cloud
Sélectionner l’API PageSpeed Insights dans la bibliothèque d’API de Google Cloud

Étape 3 : sur la page suivante, cliquez sur Activer.

Activer l'API PageSpeed Insights
Activer l’API PageSpeed Insights

Étape 4 : Cliquez sur Créer des informations d’identification dans l’onglet Informations d’identification.

Créer les informations d'identification de l'API PSI
Créer les informations d’identification de l’API PSI

Étape 5 : Pour plus de sécurité, nous vous recommandons de définir des restrictions pour la clé nouvellement créée en sélectionnant uniquement l’API PageSpeed Insights.

Définir des restrictions pour l'API PageSpeed Insights
Définir des restrictions pour l’API PageSpeed Insights

Votre clé API PageSpeed Insights est maintenant prête à être utilisée. Un dernier service doit être configuré. Vous devez créer une nouvelle application Slack.

Créer une application Slack et configurer le Webhook entrant

Pour envoyer des messages à un canal Slack spécifique, vous devez créer une application Slack. Procédez comme ceci :

Étape 1 : si vous utilisez activement Slack pour collaborer avec votre équipe, vous disposez d’un espace de travail actif. Si ce n’est pas le cas, consultez la documentation de Slack pour en créer un. Pour cet exemple, nous supposerons que vous disposez d’un espace de travail My Company.

Étape 2 : accéder au tableau de bord de l’API Slack et cliquez sur Créer une application (ou sur Créer une nouvelle application s’il ne s’agit pas de votre première application).

Créer votre première application Slack.
Créer votre première application Slack.

Étape 3 : Vous serez invité à configurer les champs d’application et les réglages de votre application. Sélectionnez From Scratch.

Créer une application Slack à partir de zéro.
Créer une application Slack à partir de zéro.

Étape 4 : Ensuite, donnez un nom à votre application (par exemple, Performance Bot) et sélectionnez votre espace de travail.

Choisissez le nom de l'application et sélectionnez un espace de travail
Choisissez le nom de l’application et sélectionnez un espace de travail

Étape 5 : Sélectionnez Incoming Webhooks dans la barre latérale gauche, puis cliquez sur On. Cliquez ensuite sur Ajouter un nouveau Webhook en bas de la page.

Activez les Webhooks entrants
Activez les Webhooks entrants

Étape 6 : Copiez l’URL du webhook et enregistrez-la pour référence ultérieure.

URL du Webhook pour votre espace de travail
URL du Webhook pour votre espace de travail

Vous avez maintenant tout ce qu’il vous faut pour créer un script qui vous permet de partager automatiquement les mesures de performance de votre site web avec votre équipe sur Slack. Il est temps de plonger dans le code.

Un script PHP pour automatiser le suivi des performances

L’étape suivante consiste à créer un script qui communique avec les trois services susmentionnés afin de surveiller automatiquement les performances de tous les sites des clients de l’agence hébergés sur Kinsta.

Étape 1 : configuration du script

Dans votre éditeur de code préféré, créez un nouveau fichier .php et ajoutez le code suivant :

<?php

$kinsta_api_key	 = 'YOUR_KINSTA_API_KEY';
$kinsta_company_id  = 'YOUR_COMPANY_UUID';
$google_api_key	 = 'YOUR_GOOGLE_API_KEY';
$slack_webhook_url  = 'YOUR_SLACK_WEBHOOK_URL';

echo "--- STARTING PERFORMANCE MONITORING ---n";

Remplacez les espaces réservés par les données réelles que vous avez récupérées plus tôt.

Étape 2 : utiliser l’API Kinsta pour récupérer la liste des sites de l’entreprise

Pour obtenir la liste des sites de votre compte Kinsta, vous devez utiliser l’API Kinsta v2 et le point de terminaison /sites.

Voici comment accéder à l’API via cURL :

// 1. Fetch the list of sites from Kinsta
$url_kinsta = "https://api.kinsta.com/v2/sites?company=" . $kinsta_company_id . "&include_environments=true";
$ch = curl_init($url_kinsta);
curl_setopt($ch, CURLOPT_HTTPHEADER, ['Authorization: Bearer ' . $kinsta_api_key]);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$res_kinsta = curl_exec($ch);
$data_kinsta = json_decode($res_kinsta, true);
curl_close($ch);

$sites = $data_kinsta['company']['sites'] ?? [];
echo "Found " . count($sites) . " sites to analyze.n";

Notez que nous avons utilisé le paramètre de requête includes_environments=true pour récupérer les détails de l’environnement (live et staging).

Ensuite, interrogez l’API Google PSI et envoyez les données à l’application Slack.

Mesures PageSpeed Insights et notifications Slack

Vous devez maintenant envoyer l’URL de chaque site récupéré à l’API PageSpeed Insights. Lorsque vous appelez le service, PageSpeed Insights effectue une vérification des performances et renvoie un objet contenant des mesures de performances. Votre script enverra ces données à l’API Slack, qui générera les messages correspondants.

Voici le code à ajouter à votre script :

foreach ($sites as $site) {
	$site_label = $site['display_name'];
	$primary_domain = "";

	// 2. Search the downloaded data directly for the live environment
	$environments = $site['environments'] ?? [];

	foreach ($environments as $env) {
		if ($env['name'] === 'live') {
			$raw_domain = $env['primaryDomain'] ?? $env['primary_domain'] ?? null;
			$primary_domain = is_array($raw_domain) ? ($raw_domain['name'] ?? "") : $raw_domain;
			break;
		}
	}

	if (empty($primary_domain)) {
		echo "Skipping $site_label (No Live domain found).n";
		continue;
	}

	echo "Analyzing $primary_domain... ";

	// 3. PageSpeed analysis
	$psi_url = "https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=https://" . urlencode($primary_domain) . "&key=$google_api_key&category=performance&strategy=mobile";
	
	$res_psi = @file_get_contents($psi_url);
	if ($res_psi === false) {
		echo "PSI Error.n";
		continue;
	}

	$data_psi = json_decode($res_psi, true);

	$score = ($data_psi['lighthouseResult']['categories']['performance']['score'] ?? 0) * 100;
	$fcp   = $data_psi['lighthouseResult']['audits']['first-contentful-paint']['displayValue'] ?? 'N/A';
	$lcp   = $data_psi['lighthouseResult']['audits']['largest-contentful-paint']['displayValue'] ?? 'N/A';

	// 4. Send rich notification to Slack
	$report_link = "https://pagespeed.web.dev/analysis?url=https://" . $primary_domain . "&strategy=mobile";
	
	$slack_msg = [
		"text" => "🚀 *Performance Report: $site_label*nURL: `https://$primary_domain` nn" .
			"• *Score:* `$score` n" .
			"• *FCP:* $fcp n" .
			"• *LCP:* $lcpnn" .
			"[ <$report_link|View Full Report> ]"
	];

	$ch = curl_init($slack_webhook_url);
	curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($slack_msg));
	curl_setopt($ch, CURLOPT_HTTPHEADER, ['Content-Type: application/json']);
	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
	curl_exec($ch);
	curl_close($ch);

	echo "Done.n";
}

echo "--- MONITORING COMPLETED ---n";

En bref, ce code itère sur les éléments du tableau $sites. Pour chaque élément du tableau, il récupère les Core Web Vitals et envoie un message à Slack.

Test du script

Vous pouvez vous connecter à votre conteneur en utilisant SSH et exécuter votre script PHP directement depuis le terminal. Cela vous permet de dépanner rapidement votre script et de recevoir des résultats de performance en temps réel dans Slack.

Dans MyKinsta, naviguez vers Sites > Nom du site. Descendez jusqu’à la section Utilisateur principal SFTP/SSH et trouvez le champ Commande de terminal SSH. Cela devrait ressembler à ceci :

ssh wordpress@host-name -p port-number

Copiez la commande SSH et collez-la dans le terminal. Vous serez invité à saisir le mot de passe fourni dans la même section. Appuyez sur Entrée, et vous serez connecté à votre environnement de conteneur.

Connexion SSH à Kinsta
Connexion SSH à Kinsta

Vous pouvez maintenant tester votre code. À partir de la ligne de commande, naviguez jusqu’au dossier dans lequel vous avez téléchargé le script. Dans cet exemple, nous avons utilisé le dossier public :

cd public

Ensuite, utilisez la commande suivante pour exécuter le script :

php performance-monitor.php

Le script émet un message pour chaque action qu’il effectue. Une fois qu’il a terminé son exécution, vous devriez voir une liste de messages similaire à la suivante :

--- STARTING FULL PERFORMANCE MONITORING ---
Found 5 sites to analyze.
Analyzing site1.kinsta.cloud... Done.
Analyzing site2.kinsta.cloud... Done.
Analyzing site3.kinsta.cloud... Done.
Analyzing example.com... Done.
Analyzing site5.kinsta.cloud... Done.
--- MONITORING COMPLETED ---

Si le PSI ne répond pas dans les délais, le script passe au site suivant. Dans ce cas, vous verrez un message qui ressemble à celui-ci :

--- STARTING FULL PERFORMANCE MONITORING ---
Found 5 sites to analyze.
Analyzing site1.kinsta.cloud... Done.
Analyzing site2.kinsta.cloud... Done.
Analyzing site3.kinsta.cloud... Done.
Analyzing example.com... PSI Error.
Analyzing site5.kinsta.cloud... Done.
--- MONITORING COMPLETED ---

Lorsque le script traite les réponses de Google PSI, il envoie un message à votre canal Slack. Pour chaque site analysé avec succès par PSI, vous devriez recevoir un message Slack similaire à celui-ci :

Rapport de performance automatisé sur Slack
Rapport de performance automatisé sur Slack

Génial. Vous venez de créer votre système de surveillance automatisé.

Maintenant, vous voudrez peut-être l’adapter à vos besoins spécifiques. Par exemple, si vous gérez des centaines de sites clients, il pourrait être inefficace d’envoyer un message Slack pour chaque site.

Vous pouvez toutefois définir une condition qui teste le score global du site et envoie un message au canal Slack uniquement si la valeur renvoyée par l’API PSI est inférieure à un seuil spécifié (par exemple, 90). Le code suivant ferait l’affaire :

$threshold = 90;

// 4. Send rich notification to Slack
// The alert is triggered only if the current score is strictly lower than our limit.
if ($score < $threshold) {
	echo "Score below threshold. Sending Slack alert... ";

	$report_link = "https://pagespeed.web.dev/analysis?url=https://" . $primary_domain . "&strategy=mobile";

	// Prepare the Slack message
	$slack_msg = [
		"text" => "⚠️ *Performance Alert: $site_label*nThe site score has dropped below the threshold of *$threshold*!nn" .
			"• *Score:* `$score` n" .
			"• *FCP:* $fcp n" .
			"• *LCP:* $lcpnn" .
			"[ <$report_link|View Full Audit Report> ]"
	];

	// Execute the CURL request to the Slack Webhook
	$ch = curl_init($slack_webhook_url);
	curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($slack_msg));
	curl_setopt($ch, CURLOPT_HTTPHEADER, ['Content-Type: application/json']);
	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
	curl_exec($ch);
	curl_close($ch);

	echo "Done.n";
} else {
	echo "Score is optimal ($score). No alert sent.n";
}

Mettez à jour votre script, enregistrez le fichier et téléversez-le à nouveau. Ensuite, connectez-vous au serveur via SSH, accédez au dossier approprié et exécutez à nouveau la commande suivante :

php performance-monitor.php

Si vous avez choisi un nom différent pour votre script, modifiez la commande en conséquence.

Le terminal doit maintenant afficher une séquence de messages similaires à ceux qui suivent :

--- STARTING FULL PERFORMANCE MONITORING ---
Found 5 sites to analyze.
Analyzing site1.kinsta.cloud... Score is optimal (100). No alert sent.
Analyzing site2.kinsta.cloud... Score is optimal (95). No alert sent.
Analyzing site3.kinsta.cloud... Score is optimal (100). No alert sent.
Analyzing example.com... Score below threshold. Sending Slack alert... Done.
Analyzing site5.kinsta.cloud... Score below threshold. Sending Slack alert... Done.
--- MONITORING COMPLETED ---

Dans Slack, vous recevrez un message pour chaque site dont le score global est inférieur au seuil de 90.

Une alerte de performance automatisée dans Slack
Une alerte de performance automatisée dans Slack

C’est très bien, non ? Mais vous pouvez encore optimiser le processus. N’aimeriez-vous pas gagner encore plus de temps en exécutant le script automatiquement à des intervalles déterminés sans avoir besoin d’accéder à votre outil de ligne de commande ?

Oui, vous l’avez deviné. Vous avez besoin d’une tâche cron.

Automatiser le processus à l’aide d’une tâche cron

Il existe plusieurs façons de mettre en place une tâche cron sur Kinsta. Bien que vous puissiez le faire via WordPress, les utilisateurs de Kinsta peuvent ajouter des tâches cron de serveur à chaque conteneur de site.

Pour mettre en place un travail cron sur Kinsta, créez une commande cron et ajoutez-la au fichier crontab de votre conteneur via SSH.

Par exemple, vous pouvez utiliser une commande comme la suivante :

0 10 * * * /usr/bin/php /www/yoursite_123/public/your-script.php >> /www/yoursite_123/performance_monitor.log 2>&1

Voici ce que fait cette commande :

  • 0 10 * * * définit le script à exécuter tous les jours à 10 heures.
  • /usr/bin/php est le chemin absolu de l’interpréteur PHP sur le serveur.
  • /www/yoursite_123/public/your-script.php est le chemin absolu du script. Veillez à vérifier le chemin et le nom réel de votre script sur le serveur.
  • L’opérateur >> (redirection append) ajoute de nouvelles données à la fin du fichier spécifié.
  • /www/yoursite_123/performance_monitor.log indique le fichier dans lequel tout le texte imprimé par le script sera sauvegardé.
  • La commande 2>&1 demande au serveur de rediriger les erreurs vers le même fichier.

Nous n’aborderons pas ici les commandes cron de manière plus détaillée. Vous pouvez vous référer à la documentation de The Open Group ou utiliser un outil de crontab, tel que Crontab Generator ou Cronitor.

Après avoir créé votre commande cron, vous devez l’ajouter au conteneur de votre site. Vous pouvez soit demander à notre équipe d’assistance de le faire pour vous, soit le faire vous-même via SSH. Si vous choisissez cette dernière option, commencez par saisir la commande suivante :

crontab -e

Il vous sera demandé de sélectionner un éditeur. Choisissez « nano » si vous n’êtes pas sûr.

Dans l’éditeur, collez votre commande à la fin du fichier. Enregistrez le fichier et revenez à la ligne de commande. Vous devriez alors voir un message confirmant que vos modifications ont été effectuées avec succès.

crontab installing new crontab

Le tour est joué. Le script va maintenant s’exécuter à intervalles réguliers et envoyer un message au canal Slack de votre choix avec les indicateurs demandés pour les sites de vos clients dont les performances sont médiocres.

Augmentation d’échelle : Que pouvez-vous automatiser d’autre avec l’API Kinsta ?

Le script présenté dans cet article peut être personnalisé et étendu. Par exemple, vous pouvez intégrer d’autres services, tels que Trello ou Asana, exporter des données ou envoyer des e-mails périodiques aux clients.

L’automatisation de vos contrôles de performance sur les sites de vos clients n’est qu’un début. L’intégration de l’API Kinsta aux outils quotidiens de votre équipe peut transformer les opérations de votre agence en éliminant les tâches manuelles de gestion et de maintenance des sites, en améliorant l’efficacité et en réduisant les coûts d’exploitation. Vous améliorerez également la qualité du service, réduirez les délais de livraison et garantirez la meilleure expérience possible à vos clients.

L’API de Kinsta vous permet d’automatiser diverses tâches, notamment la création d’environnements de staging, le transfert sélectif des modifications du staging à la production, l’accès aux journaux d’erreurs, l’effacement du cache du site, la gestion des sauvegardes, et bien plus encore. Ces fonctionnalités rendent la gestion des sites WordPress rapide et facile, ce qui vous permet d’évoluer en toute confiance.

Prêt à faire passer votre agence au niveau supérieur ? Découvrez nos offres ou contactez notre équipe commerciale pour discuter de vos besoins spécifiques.

Bonne évolution !

Carlo Daniele Kinsta

Carlo est un passionné de webdesign et de développement frontend. Il joue avec WordPress depuis plus de 10 ans, notamment en collaboration avec des universités et des établissements d'enseignement italiens et européens. Il a écrit des dizaines d'articles et de guides sur WordPress, publiés à la fois sur des sites web italiens et internationaux, ainsi que dans des magazines imprimés. Vous pouvez trouver Carlo sur X et LinkedIn.