Google bietet die PageSpeed Insights API an, um SEO-Profis und Entwicklern zu helfen, indem sie Daten aus der realen Welt mit Simulationsdaten mischen und Zeitdaten zur Ladeleistung in Bezug auf Webseiten bereitstellen.
Der Unterschied zwischen Google PageSpeed Insights (PSI) und Lighthouse besteht darin, dass PSI sowohl reale als auch Labordaten umfasst, während Lighthouse eine Seitenladesimulation durchführt, indem es die Verbindung und den Benutzeragenten des Geräts modifiziert.
Ein weiterer Unterschied besteht darin, dass PSI keine Informationen in Bezug auf Webzugänglichkeit, SEO oder progressive Web-Apps (PWAs) liefert, während Lighthouse alle oben genannten Informationen bereitstellt.
Wenn wir also die PageSpeed Insights-API für den Leistungstest zum Massenladen von URLs verwenden, haben wir keine Daten zur Zugänglichkeit.
PSI bietet jedoch weitere Informationen zur Seitengeschwindigkeitsleistung, z. B. „DOM-Größe“, „tiefstes untergeordnetes DOM-Element“, „Gesamtanzahl der Aufgaben“ und „DOM-Inhalt geladen“-Timing.
Ein weiterer Vorteil der PageSpeed Insights API ist, dass sie den „beobachteten Metriken“ und „tatsächlichen Metriken“ unterschiedliche Namen gibt.
In diesem Leitfaden erfahren Sie:
- So erstellen Sie ein Python-Skript auf Produktionsebene.
- So verwenden Sie APIs mit Python.
- So erstellen Sie Datenrahmen aus API-Antworten.
- So analysieren Sie die API-Antworten.
- So analysieren Sie URLs und verarbeiten die Antworten von URL-Anforderungen.
- So speichern Sie die API-Antworten mit der richtigen Struktur.
Eine Beispielausgabe des API-Aufrufs von Page Speed Insights mit Python finden Sie unten.
Bibliotheken zur Verwendung der PageSpeed Insights-API mit Python
Die erforderlichen Bibliotheken zur Verwendung der PSI-API mit Python sind unten aufgeführt.
- Advertools ruft Test-URLs aus der Sitemap einer Website ab.
- Pandas soll den Datenrahmen erstellen und die JSON-Ausgabe der API glätten.
- Anfragen müssen eine Anfrage an den spezifischen API-Endpunkt stellen.
- JSON soll die API-Antwort nehmen und sie in den speziell verwandten Wörterbuchpunkt einfügen.
- Datetime dient dazu, den Namen der spezifischen Ausgabedatei mit dem aktuellen Datum zu ändern.
- URLlib soll die URL der Testsubjekt-Website parsen.
Wie verwende ich die PSI-API mit Python?
Führen Sie die folgenden Schritte aus, um die PSI-API mit Python zu verwenden.
- Holen Sie sich einen PageSpeed Insights-API-Schlüssel.
- Importieren Sie die erforderlichen Bibliotheken.
- Analysieren Sie die URL für die Website des Testsubjekts.
- Nehmen Sie das Datum des Moments als Dateinamen.
- Nehmen Sie URLs aus einer Sitemap in eine Liste auf.
- Wählen Sie die gewünschten Metriken aus der PSI-API aus.
- Erstellen Sie eine For-Schleife, um die API-Antwort für alle URLs zu übernehmen.
- Erstellen Sie den Datenrahmen mit ausgewählten PSI-API-Metriken.
- Ausgabe der Ergebnisse in Form von XLSX.
1. Holen Sie sich den API-Schlüssel für PageSpeed Insights
Verwenden Sie die API-Dokumentation von PageSpeed Insights, um den API-Schlüssel zu erhalten.
Klicken Sie unten auf die Schaltfläche „Get a Key“.
Bild von developer.google.com, Juni 2022Wählen Sie ein Projekt aus, das Sie in der Google Developer Console erstellt haben.
Bild von developer.google.com, Juni 2022Aktivieren Sie die PageSpeed Insights-API für dieses spezifische Projekt.
Bild von developer.google.com, Juni 2022Sie müssen den spezifischen API-Schlüssel in Ihren API-Anfragen verwenden.
2. Importieren Sie die erforderlichen Bibliotheken
Verwenden Sie die Zeilen unten, um die grundlegenden Bibliotheken zu importieren.
import advertools as adv
import pandas as pd
import requests
import json
from datetime import datetime
from urllib.parse import urlparse
3. Analysieren Sie die URL für die Website des Testsubjekts
Verwenden Sie die folgende Codestruktur, um die URL der betreffenden Website zu parsen.
domain = urlparse(sitemap_url)
domain = domain.netloc.split(".")[1]
Die „Domain“-Variable ist die geparste Version der Sitemap-URL.
„netloc“ steht für den Domänenabschnitt der spezifischen URL. Wenn wir es mit dem “.” es nimmt den „mittleren Abschnitt“, der den Domänennamen darstellt.
Hier steht “0” für “www”, “1” für “Domainname” und “2” für “Domainerweiterung”, wenn wir es mit “” teilen.
4. Nehmen Sie das Datum des Moments als Dateinamen
Um das Datum des bestimmten Moments des Funktionsaufrufs zu übernehmen, verwenden Sie die Methode „datetime.now“.
Datetime.now liefert die spezifische Zeit des spezifischen Moments. Verwenden Sie „strftime“ mit den Werten „%Y“, „%m“ und „%d“. „%Y“ steht für das Jahr. „%m“ und „%d“ sind numerische Werte für den jeweiligen Monat und Tag.
date = datetime.now().strftime("%Y_%m_%d")
5. Nehmen Sie URLs in eine Liste von einer Sitemap
Um die URLs aus einer Sitemap-Datei in ein Listenformular zu übernehmen, verwenden Sie den folgenden Codeblock.
sitemap = adv.sitemap_to_df(sitemap_url) sitemap_urls = sitemap["loc"].to_list()
Wenn Sie den Python Sitemap Health Audit lesen, können Sie weitere Informationen zu den Sitemaps erhalten.
6. Wählen Sie die gewünschten Metriken von der PSI-API aus
Um die JSON-Eigenschaften der PSI-API-Antwort auszuwählen, sollten Sie die JSON-Datei selbst sehen.
Es ist sehr relevant für das Lesen, Analysieren und Reduzieren von JSON-Objekten.
Dank des Konzepts des „gerichteten Graphen“ und der strukturierten Daten „JSON-LD“ ist es sogar mit semantischer SEO verwandt.
In diesem Artikel konzentrieren wir uns nicht auf die Untersuchung der spezifischen JSON-Hierarchien der PSI-API-Antwort.
Sie können die Metriken sehen, die ich ausgewählt habe, um sie von der PSI-API zu sammeln. Es ist reichhaltiger als die grundlegende Standardausgabe der PSI-API, die nur die Core Web Vitals-Metriken oder den Geschwindigkeitsindex-Interaktion bis zum nächsten Malen, die Zeit bis zum ersten Byte und das erste zufriedene Malen liefert.
Natürlich gibt es auch „Vorschläge“, indem es sagt „Verkettung kritischer Anfragen vermeiden“, aber es ist nicht nötig, einen Satz in einen Datenrahmen zu packen.
In Zukunft können diese Vorschläge oder sogar jedes einzelne Kettenereignis, ihre KB- und MS-Werte in einer einzigen Spalte mit dem Namen „psi_suggestions“ zusammengefasst werden.
Zunächst können Sie die von mir ausgewählten Metriken überprüfen, und eine wichtige Menge davon wird für Sie zuerst angezeigt.
PSI API-Metriken, der erste Abschnitt ist unten.
fid = []
lcp = []
cls_ = []
url = []
fcp = []
performance_score = []
total_tasks = []
total_tasks_time = []
long_tasks = []
dom_size = []
maximum_dom_depth = []
maximum_child_element = []
observed_fcp = []
observed_fid = []
observed_lcp = []
observed_cls = []
observed_fp = []
observed_fmp = []
observed_dom_content_loaded = []
observed_speed_index = []
observed_total_blocking_time = []
observed_first_visual_change = []
observed_last_visual_change = []
observed_tti = []
observed_max_potential_fid = []
Dieser Abschnitt enthält alle beobachteten und simulierten grundlegenden Messwerte zur Seitengeschwindigkeit sowie einige nicht grundlegende Messwerte wie „DOM-Inhalt geladen“ oder „erster aussagekräftiger Farbauftrag“.
Der zweite Abschnitt von PSI Metrics konzentriert sich auf mögliche Byte- und Zeiteinsparungen durch die ungenutzte Codemenge.
render_blocking_resources_ms_save = []
unused_javascript_ms_save = []
unused_javascript_byte_save = []
unused_css_rules_ms_save = []
unused_css_rules_bytes_save = []
Ein dritter Abschnitt der PSI-Metriken konzentriert sich auf die Antwortzeit des Servers, die Vorteile der reaktionsschnellen Bildnutzung oder nicht, unter Verwendung von Schäden.
possible_server_response_time_saving = []
possible_responsive_image_ms_save = []
Hinweis: Die Gesamtleistungspunktzahl ergibt sich aus „performance_score“.
7. Erstellen Sie eine For-Schleife, um die API-Antwort für alle URLs zu übernehmen
Die for-Schleife soll alle URLs aus der Sitemap-Datei nehmen und die PSI-API nacheinander für alle verwenden. Die for-Schleife für die PSI-API-Automatisierung besteht aus mehreren Abschnitten.
Der erste Abschnitt der PSI-API for-Schleife beginnt mit der Vermeidung doppelter URLs.
In den Sitemaps sehen Sie eine mehrfach vorkommende URL. Dieser Abschnitt verhindert dies.
for i in sitemap_urls[:9]:
# Prevent the duplicate "/" trailing slash URL requests to override the information.
if i.endswith("/"):
r = requests.get(f"https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=i&strategy=mobile&locale=en&key=api_key")
else:
r = requests.get(f"https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=i/&strategy=mobile&locale=en&key=api_key")
Denken Sie daran, den „api_key“ am Ende des Endpunkts für die PageSpeed Insights-API zu überprüfen.
Überprüfen Sie den Statuscode. In den Sitemaps gibt es möglicherweise URLs mit anderen Statuscodes als 200; diese sollten gereinigt werden.
if r.status_code == 200:
#print(r.json())
data_ = json.loads(r.text)
url.append(i)
Im nächsten Abschnitt werden die spezifischen Metriken an das spezifische Wörterbuch angehängt, das wir vor „_data“ erstellt haben.
fcp.append(data_["loadingExperience"]["metrics"]["FIRST_CONTENTFUL_PAINT_MS"]["percentile"])
fid.append(data_["loadingExperience"]["metrics"]["FIRST_INPUT_DELAY_MS"]["percentile"])
lcp.append(data_["loadingExperience"]["metrics"]["LARGEST_CONTENTFUL_PAINT_MS"]["percentile"])
cls_.append(data_["loadingExperience"]["metrics"]["CUMULATIVE_LAYOUT_SHIFT_SCORE"]["percentile"])
performance_score.append(data_["lighthouseResult"]["categories"]["performance"]["score"] * 100)
Der nächste Abschnitt konzentriert sich auf die Anzahl der „Gesamtaufgaben“ und die DOM-Größe.
total_tasks.append(data_["lighthouseResult"]["audits"]["diagnostics"]["details"]["items"][0]["numTasks"])
total_tasks_time.append(data_["lighthouseResult"]["audits"]["diagnostics"]["details"]["items"][0]["totalTaskTime"])
long_tasks.append(data_["lighthouseResult"]["audits"]["diagnostics"]["details"]["items"][0]["numTasksOver50ms"])
dom_size.append(data_["lighthouseResult"]["audits"]["dom-size"]["details"]["items"][0]["value"])
Der nächste Abschnitt behandelt die „DOM-Tiefe“ und das „tiefste DOM-Element“.
maximum_dom_depth.append(data_["lighthouseResult"]["audits"]["dom-size"]["details"]["items"][1]["value"])
maximum_child_element.append(data_["lighthouseResult"]["audits"]["dom-size"]["details"]["items"][2]["value"])
Der nächste Abschnitt enthält die spezifischen beobachteten Testergebnisse während unserer Page Speed Insights API.
observed_dom_content_loaded.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["observedDomContentLoaded"])
observed_fid.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["observedDomContentLoaded"])
observed_lcp.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["largestContentfulPaint"])
observed_fcp.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["firstContentfulPaint"])
observed_cls.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["totalCumulativeLayoutShift"])
observed_speed_index.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["observedSpeedIndex"])
observed_total_blocking_time.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["totalBlockingTime"])
observed_fp.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["observedFirstPaint"])
observed_fmp.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["firstMeaningfulPaint"])
observed_first_visual_change.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["observedFirstVisualChange"])
observed_last_visual_change.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["observedLastVisualChange"])
observed_tti.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["interactive"])
observed_max_potential_fid.append(data_["lighthouseResult"]["audits"]["metrics"]["details"]["items"][0]["maxPotentialFID"])
Der nächste Abschnitt enthält die Menge des nicht verwendeten Codes und die verschwendeten Bytes in Millisekunden zusammen mit den Render-Blocking-Ressourcen.
render_blocking_resources_ms_save.append(data_["lighthouseResult"]["audits"]["render-blocking-resources"]["details"]["overallSavingsMs"])
unused_javascript_ms_save.append(data_["lighthouseResult"]["audits"]["unused-javascript"]["details"]["overallSavingsMs"])
unused_javascript_byte_save.append(data_["lighthouseResult"]["audits"]["unused-javascript"]["details"]["overallSavingsBytes"])
unused_css_rules_ms_save.append(data_["lighthouseResult"]["audits"]["unused-css-rules"]["details"]["overallSavingsMs"])
unused_css_rules_bytes_save.append(data_["lighthouseResult"]["audits"]["unused-css-rules"]["details"]["overallSavingsBytes"])
Im nächsten Abschnitt werden die Vorteile von responsiven Bildern und das Timing von Serverantworten bereitgestellt.
possible_server_response_time_saving.append(data_["lighthouseResult"]["audits"]["server-response-time"]["details"]["overallSavingsMs"])
possible_responsive_image_ms_save.append(data_["lighthouseResult"]["audits"]["uses-responsive-images"]["details"]["overallSavingsMs"])
Der nächste Abschnitt besteht darin, die Funktion im Falle eines Fehlers weiter arbeiten zu lassen.
else:
continue
Beispiel für die Verwendung der Page Speed Insights-API mit Python für Massentests
Um die spezifischen Codeblöcke zu verwenden, fügen Sie sie in eine Python-Funktion ein.
Führen Sie das Skript aus, und Sie erhalten 29 auf die Seitengeschwindigkeit bezogene Metriken in den Spalten unten.
Screenshot vom Autor, Juni 2022Fazit
Die PageSpeed Insights-API bietet verschiedene Arten von Leistungskennzahlen für das Laden von Seiten.
Es zeigt, wie Google-Ingenieure das Konzept der Seitenladeleistung wahrnehmen und diese Metriken möglicherweise als Ranking-, UX- und Qualitätsverständnis verwenden.
Die Verwendung von Python für Bulk-Page-Speed-Tests gibt Ihnen einen Schnappschuss der gesamten Website, um die mögliche Benutzererfahrung, Crawl-Effizienz, Conversion-Rate und Ranking-Verbesserungen zu analysieren.
Mehr Ressourcen:
Beitragsbild: Dundanim/Shutterstock