Hoe om Python te gebruik om webwerfprestasie te monitor en te meet

Hoe om Python te gebruik om webwerfprestasie te monitor en te meet

Die afgelope maand het Google ‘n aantal vooruitgang aangekondig oor hoe hulle gebruikerstevredenheid met behulp van sleutelsnelheid en prestasie-aanwysers sal meet.

Ek het per ongeluk daaraan gewerk om ‘n Python-skrif te skep wat die Google PageSpeed ​​Insights (PSI) API gebruik om data vir verskeie bladsye tegelyk in te samel, sonder om ‘n toets vir elke individuele URL uit te voer.

Na aankondigings van Google het ek gedink dit sal die perfekte tyd wees om dit te deel, sowel as om te verduidelik hoe om hierdie Python-skrif vir beginners te skep.

Die beste ding met die draaiboek is dat, sodra u die basiese beginsels bemeester het, u ‘n aantal verskillende aanwysers kan uittreksel wat in die bladsy-snelheidstoets sowel as in die vuurtoringanalise gevind kan word.

Inleiding tot relevante internetaanwysers

Begin Mei het Google Core Web Vitals bekendgestel, wat ‘n deel van die belangrikste aanwysers van Web Vitals is.

Hierdie aanwysers word gebruik om die kwaliteit van die gebruikerservaring op u webwerf te verseker.

Google het dit beskryf as ‘n manier om ‘die gemak van die gebruik van die webwerf te help kwantifiseer en geleenthede vir verbetering te identifiseer’, en dit beklemtoon hul verskuiwing om op gebruikerservaring te fokus.

Core Web Vitals is werklike gebruikersgerigte aanwysers wat die belangrikste aspekte van gebruikerservaring meet; laaityd, interaktiwiteit en stabiliteit.

Ek gaan nie gedetailleerde inligting bespreek wat dit in hierdie pos verduidelik nie; meer inligting kan hier gevind word, maar hierdie nuwe besonderhede is:

  • Die grootste inhoudskildery.
  • Uitstel van die eerste inskrywing.
  • Totale ontwerpverandering.

Daarbenewens het Google verlede week aangekondig dat dit ‘n nuwe token vir toekennings vir die soektog sal bekendstel wat hierdie data sal kombineer met bestaande ondervindingstoken op die webwerf, soos versoenbaarheid met mobiele toestelle en HTTPS-veiligheid, om te verseker dat hulle sal voortgaan om webwerwe van hoĂ« gehalte vir gebruikers te ondersteun.

Monitor prestasie statistieke

Hierdie opdatering sal na verwagting in 2021 bekendgestel word, en Google het bevestig dat geen onmiddellike aksie nodig is nie.

Maar om ons te help voorberei vir hierdie veranderinge, het hulle die gereedskap opgedateer wat gebruik is om die spoed van bladsye te meet, insluitend PSI, Google Lighthouse, en Search Console Speed ​​Report.

Waar gaan die Pagespeed Insights API?

PageSpeed ​​Insights van Google is ‘n nuttige instrument om die opsomming van die webwerfprestasie te blaai en veld- en laboratoriumdata te gebruik om resultate te genereer.

Dit is ‘n goeie manier om ‘n oorsig te kry van ‘n handjievol URL’s, omdat dit bladsy vir bladsy gebruik word.

As u egter op ‘n groot webwerf werk en op groot skaal inligting wil bekom, kan die API voordelig wees wanneer u verskeie bladsye tegelyk ontleed, sonder dat u URL’s afsonderlik hoef te kombineer.

Python-skrif om prestasie te meet

Ek het die volgende Python-skrif geskep om die belangrikste prestasie-aanwysers op groot skaal te meet om tyd spandeer te spandeer om elke URL handmatig te toets.

Hierdie skrif gebruik Python om versoeke na die Google PSI API te stuur om aanwysers wat in beide PSI en Lighthouse vertoon word, te versamel en te onttrek.

Ek het besluit om hierdie skrif in Google Colab te skryf, want dit is ‘n goeie manier om in Python te begin skryf en dit kan maklik gedeel word, waardeur hierdie plasing deur Google Colab deur die instellings gaan.

Dit kan ook plaaslik uitgevoer word, met ‘n paar instellings vir die oplaai en aflaai van data.

Let daarop dat sommige stappe ‘n geruime tyd kan neem om te voltooi, veral as elke URL via die API uitgevoer word om dit nie met versoeke te oorlaai nie.

Daarom kan u die skrif op die agtergrond laat loop en terugkeer na die voltooiing van die stappe.

Kom ons kyk na die stappe wat nodig is om hierdie skrif uit te voer.

Stap 1: Installeer die vereiste pakkette

Voordat ons kan begin met die skryf van kode, moet ons ‘n paar Python-pakkette installeer wat nodig is voordat ons die skrif kan gebruik. Dit kan maklik met die invoerfunksie geĂŻnstalleer word.

Die pakkette wat benodig word is:

  • urllib: Om URL’s mee te werk, oop te maak, te lees en te ontleed.
  • into: Skakel ‘n JSON-lĂȘer om na Python of ‘n Python-lĂȘer na JSON.
  • petisies: HTTP-biblioteek vir die versending van allerlei HTTP-versoeke.
  • pandas: Dit word hoofsaaklik gebruik om data-ontleding en manipulasie te gebruik, en gebruik dit om datarame te skep.
  • uur: Module om met tyd te werk, ons gebruik dit om ‘n tydsinterval tussen versoeke te gee.
  • dokumentasie: Met Google Colab kan u hierdie lĂȘers oplaai en aflaai.
  • en: Standaard koppelvlak gebruik om toegang tot lĂȘers.
# Import required packages 
import json
import requests
import pandas as pd
import urllib
import time
from google.colab import files
import io 

Stap 2: Stel die API-versoek op

Die volgende stap is om die API-versoek op te stel. Volledige instruksies kan hier gevind word, maar die opdrag lyk basies soos volg:

urllib.request.urlopen en voeg dit by die genoemde veranderlike (let wel: hierdie metode word gebruik om JSON-lĂȘers in Google Colab te omskep en aflaai).

Stap 4: Lees die JSON-lĂȘer

Die JSON-lĂȘer sal oor die algemeen so lyk as dit in die gekose kode-redigeerder oopgemaak word.

Lees die JSON-lĂȘer

Dit is moeilik om te verstaan, maar as u die JSON-aanlynblaaier gebruik, kan u dit omskep in ‘n leesbare boombeskouing.

leesbare boomuitsig

Die JSON-lĂȘer vertoon veldgegewens wat in die loadingExperience-module geberg is, en laboratoriumdata wat in lighthouseResult gevind kan word.

Om die gewenste statistieke te onttrek, kan ons die JSON-lĂȘerformaat gebruik, omdat ons kan sien watter statistieke in elke afdeling is.

Byvoorbeeld, die eerste intreevertraging is by loadingExperience.

Die eerste intreevertraging is om te laai ondervinding

Terwyl First Contentful Paint by vuurtoringuitslag is.

Die eerste gelukkige foto is onder die vuurtoring

Daar is baie ander aanwysers wat gestoor word as deel van die vuurtoringResultaat-oudits, soos:

  • Spoedindeks.
  • Die eerste gelukkige prentjie.
  • Totale ontwerpverandering.

Stap 5: laai CSV en stoor as Pandas-datarame

Die volgende stap is om die CSV-URL-lĂȘer wat u wil uitvoer, deur die PSI API te laai. U kan ‘n lys met URL’e van die webwerf genereer vanaf ‘n indekseringsinstrument, soos DeepCrawl.

Omdat ons die API gebruik, beveel ons aan dat u die kleiner voorbeeld-URL hier gebruik, veral as u ‘n groot webwerf het.

U kan byvoorbeeld bladsye met die meeste verkeer gebruik of bladsye wat die meeste inkomste verdien. Alternatiewelik, as u webwerf sjablone het, is dit ideaal om hul stelle te toets.

U kan ook byvoeg (Let wel: hierdie metode word gebruik om CSV-lĂȘers na Google Colab op te laai).

Na die laai gebruik ons ​​die Pandas-biblioteek om CSV na DataFrame te omskep, wat ons in die volgende stappe kan doen.

# Get the filename from the upload so we can read it into a CSV.
for key in uploaded.keys():
  filename = key
# Read the selected file into a Pandas Dataframe
df = pd.read_csv(io.BytesIO(uploaded[filename]))

df.head()

DataFrame lyk so, begin met die indeling van nul.

data raam

Stap 6: Stoor die resultate op die antwoordobjek

Die volgende stap behels die gebruik van byl tot so ‘n mate wat die URL’s sal verteenwoordig wat ons deur die lus loop, sowel as die reaksie-objek verhoed dat URL’s mekaar by die werk sal oorskryf en ons in staat stel om data te stoor vir toekomstige gebruik.

Ook hier sal ons ‘n kolomkopveranderlike gebruik om die URL-versoekparameter te definieer voordat ons na die JSON-lĂȘer omskakel.

Ek stel ook die slaaptyd hier op 30 sekondes om die aantal API-oproepe wat agtereenvolgens gemaak word, te verminder.

Alternatiewelik kan u die API-sleutel aan die einde van die URL-opdrag voeg as u vinniger versoeke wil stuur.

Inkeping is ook hier belangrik, want omdat elke stap deel uitmaak van ‘n for-lus, moet hulle ingebed wees in die opdrag.

Stap 7: Skep ‘n dataram vir die stoor van antwoorde

Ons moet ook ‘n dataram skep waarin die statistieke gestoor word wat ons uit die antwoordobjek wil onttrek.

DataFrame is ‘n tabelagtige datastruktuur, met kolomme en rye wat data stoor. Ons hoef net ‘n kolom by elke statistiek te voeg en dit soos volg te noem:

# Create dataframe to store responses
df_pagespeed_results = pd.DataFrame(columns=
          ['url',
          'Overall_Category',
          'Largest_Contentful_Paint',
          'First_Input_Delay',
          'Cumulative_Layout_Shift',
          'First_Contentful_Paint',
          'Time_to_Interactive',
          'Total_Blocking_Time',
          'Speed_Index'])  

print(df_pagespeed_results)

Vir die doeleindes van hierdie skrif het ek Core Web Vital-aanwysers gebruik met bykomende aanwysers vir laai en interaktiwiteit wat in die huidige weergawe van Lighthouse gebruik word.

Hierdie aanwysers het verskillende gewigte wat dan in die algehele prestasietelling gebruik word:

U kan meer leer oor elke meting en die interpretasie van die resultate op hul individuele landingbladsye, hierbo gekoppel.

Ek het ook besluit om ‘n snelheidsindeks en ‘n algemene kategorie in te sluit wat ‘n stadige, medium of vinnige resultaat lewer.

Stap 8: Onttrek die statistieke van die antwoordobjek

Nadat ons die antwoordvoorwerp gestoor het, kan ons dit nou filter en slegs die statistieke wat ons wil hĂȘ, onttrek.

Hier sal ons weer ‘n for-lus gebruik om deur die antwoordvoorwerplĂȘer te gaan en die volgorde van lysindekse in te stel om slegs spesifieke statistieke terug te gee.

Vir hierdie doel sal ons die naam van die kolom DataFrame definieer, asook ‘n spesifieke kategorie van die antwoordobjek, waaruit ons elke metriek vir elke URL onttrek.

for (url, x) in zip(
    response_object.keys(),
    range(0, len(response_object))
):

        # URLs
        df_pagespeed_results.loc[x, 'url'] =
            response_object[url]['lighthouseResult']['finalUrl']

        # Overall Category
        df_pagespeed_results.loc[x, 'Overall_Category'] =
            response_object[url]['loadingExperience']['overall_category']   

        # Core Web Vitals     

        # Largest Contentful Paint    
        df_pagespeed_results.loc[x, 'Largest_Contentful_Paint'] =
        response_object[url]['lighthouseResult']['audits']['largest-contentful-paint']['displayValue']

        # First Input Delay 
        fid = response_object[url]['loadingExperience']['metrics']['FIRST_INPUT_DELAY_MS']
        df_pagespeed_results.loc[x, 'First_Input_Delay'] = fid['percentile']

        # Cumulative Layout Shift    
        df_pagespeed_results.loc[x, 'Cumulative_Layout_Shift'] =
        response_object[url]['lighthouseResult']['audits']['cumulative-layout-shift']['displayValue']

        # Additional Loading Metrics 

        # First Contentful Paint 
        df_pagespeed_results.loc[x, 'First_Contentful_Paint'] =
        response_object[url]['lighthouseResult']['audits']['first-contentful-paint']['displayValue']

        # Additional Interactivity Metrics 

        # Time to Interactive  
        df_pagespeed_results.loc[x, 'Time_to_Interactive'] =
        response_object[url]['lighthouseResult']['audits']['interactive']['displayValue']

        # Total Blocking Time   
        df_pagespeed_results.loc[x, 'Total_Blocking_Time'] =
        response_object[url]['lighthouseResult']['audits']['total-blocking-time']['displayValue']

        # Speed Index
        df_pagespeed_results.loc[x, 'Speed_Index'] =
        response_object[url]['lighthouseResult']['audits']['speed-index']['displayValue']

Ek het hierdie script opgestel om die sleutelmaatstawwe wat ek hierbo genoem het, te onttrek, sodat u dit onmiddellik kan gebruik om hierdie data te versamel.

Dit is egter moontlik om ‘n aantal ander nuttige aanwysers te onttrek wat in beide PSI-toetse en vuurtoringanalise gevind kan word.

Hier is die JSON-lĂȘer nuttig om na te gaan waar elke metriek in die lys is.

Byvoorbeeld, wanneer u data onttrek uit vuurtoring-oudits, soos die tyd-vertoonwaarde vir interaktiewe, gebruik u die volgende:

df_pagespeed_results.loc[x, 'Time_to_Interactive'] =
response_object[url]['lighthouseResult']['audits']['interactive']['displayValue']

Weereens is dit belangrik om seker te maak dat elkeen van hulle in die lus pas, anders word hulle nie by die iterasie ingesluit nie en slegs een resultaat vir die URL word gegenereer.

Ons finale DataFrame sal so lyk;

finale gegewensraam

Stap 9: Skakel die datarame om in ‘n CSV-lĂȘer

Die laaste stap is om ‘n opsommingslĂȘer te skep om al die resultate te versamel, sodat ons dit kan omskakel in ‘n formaat wat ons maklik kan ontleed, byvoorbeeld ‘n CSV-lĂȘer.

summary = df_pagespeed_results

df_pagespeed_results.head()

#Download csv file 
summary.to_csv('pagespeed_results.csv')
files.download('pagespeed_results.csv')

.str.replace-metode in elke kolom.

#Replace the 's' with a blank space so we can turn into numbers
df_pagespeed_results['Largest_Contentful_Paint'] = df_pagespeed_results.Largest_Contentful_Paint.str.replace('s', '')
df_pagespeed_results['First_Contentful_Paint'] = df_pagespeed_results.First_Contentful_Paint.str.replace('s', '')
df_pagespeed_results['Time_to_Interactive'] = df_pagespeed_results.Time_to_Interactive.str.replace('s', '')
df_pagespeed_results['Total_Blocking_Time'] = df_pagespeed_results.Total_Blocking_Time.str.replace('ms', '')
df_pagespeed_results['Speed_Index'] = df_pagespeed_results.Speed_Index.str.replace('s', '')

Dan sal ons gebruik Grafiese lenings

Alle skermkiekies deur die skrywer, Junie 2020