چگونه با استفاده از پایتون میزان عملکرد وب سایت را اندازه گیری کنیم؟

با استفاده از پایتون برای عملکرد وب سایت اسکریپت دلخواه خود را برای Python بسازید تا اندازه گیری سرعت کلیدی و معیارهای عملکرد برای وب سایت خود را انجام دهید. همانطور که می دانید، زبان برنامه نویسی پایتون یک زبان پیشرفته و محبوب در بین برنامه نویسان می باشد که از ویژگی های زیادی برخوردار هست.

طی یک ماه گذشته، گوگل پیشرفت های زیادی را در مورد چگونگی سنجش تجربه کاربر از طریق اندازه گیری های کلیدی سرعت و عملکرد ارائه داده است.

به طور هم زمان،من در تلاش برای جمع آوری اسکریپت پایتونی هستم که از API ابزار “Google PageSpeed Insights” یا PSI برای جمع آوری معیارهای هر صفحه بدون نیاز به اجرای تست برای هر “URL” اختصاصی ، استفاده می کند.

بهترین مورد برای ساختار برنامه این است که به محض اینکه زیرساخت ها را تنظیم کردید، می توانید تعدادی از معیارهای مختلف را پیدا کنید که می تواند در تست سرعت صفحه و همچنین آنالیز lighthouse قرار بگیرید.

مقدمه ای بر اندازه گیری های مهم وب

در آغاز ماه می، گوگل “Core Web Vitals” را معرفی کرد که زیر مجموعه ای از معیارهای کلیدی Web Vitals محسوب می شود. این معیارها برای ارائه راهنمایی در مورد کیفیت تجربه کاربری در وب سایت استفاده می شود.

گوگل آن ها را به عنوان روشی برای “كمك كردن به تجربه سایت شما و بهبود بخشیدن به فرصت ها” توصیف كرده است و همچنین بر تغییر آن ها برای تمرکز روی تجربه كاربری تأکید كرده است.

Core Web Vitals معیارهای کاربر در دنیای واقعی است که جنبه های اصلی تجربه کاربر را اندازه گیری می کند. زمان بارگذاری، تعامل و ثبات.

• Largest Contentful Paint
• First Input Delay
• Cumulative Layout Shift

علاوه بر این، گوگل هفته گذشته اعلام کرد که سیگنال جدید رتبه بندی جستجو را معرفی می کند. این معیارها را با سیگنال های موجود در صفحه، مانند موبایل فرندلی و امنیت HTTPS ، ترکیب می کند تا از ادامه خدمات وب سایت های با کیفیت اطمینان حاصل کند.

نظارت بر معیارهای عملکرد

انتظار می رود این بروزرسانی در سال 2021 به پایان برسد و گوگل تأیید کرده است که نیازی به اقدام فوری نیست.

با این حال، به منظور بهتر کردن در آماده سازی برای این تغییرات، ابزارهایی را که برای اندازه گیری سرعت صفحه از جمله PSI ، Google Lighthouse و گزارش سرعت کنسول جستجوی Google استفاده می شود، به روز کرده اند.

از کجا می توان API Pagespeed Insights را وارد این کار کرد؟

PageSpeed Insights گوگل ابزاری مفید برای مشاهده خلاصه عملکرد صفحه وب است و از داده های میدانی و آزمایشگاهی برای تولید نتایج استفاده می کند.

این یک راه عالی برای به دست آوردن یک دید کلی از تعداد URL های اینترنتی است، زیرا از آن به صورت پایه در هر صفحه استفاده می شود.

با این حال، اگر شما در یک سایت بزرگ مشغول به کار هستید و می خواهید مفهومی از مقیاس بدست آورید، API می تواند تعدادی از صفحات را به صورت همزمان مورد تجزیه وتحلیل قرار دهد، بدون آنکه نیازی به وصل کردن آدرس های اینترنتی بصورت جداگانه باشد.

اندازه گیری عملکرد سایت با اسکریپت پایتون

برای اندازه گیری معیارهای عملکرد کلیدی سایت با پایتون در مقیاس های مختلف، اسکریپت زیر را در پایتون ایجاد کرده ام تا بتوانم برای تست هر URL در زمان صرفه جویی کنم.

این اسکریپت از پایتون برای ارسال درخواست به “Google PSI API” به منظور جمع آوری و استخراج معیارهایی که در “PSI” و “Lighthouse” نمایش داده می شوند، استفاده می کند.

من تصمیم گرفتم این اسکریپت را در “Google Colab” بنویسم زیرا این یک راه عالی برای شروع نوشتن پایتون است و امکان اشتراک گذاری آسان را نیز فراهم می کند، بنابراین پست با استفاده از “Google Colab” از طریق تنظیمات اجرا می شود.

اما، با چند ترفند در بارگذاری و بارگیری داده ها، می توان آن را به صورت محلی نیز اجرا کرد.

توجه به این نکته مهم است که ممکن است هر مرحله، مدت زمانی برای انجام نیاز داشته باشد. این اتفاق به خصوص وقتی که هر “URL” از طریق” API” اجرا می شود، رخ می دهد تا از ایجاد اورلود درخواست ها، جلوگیری شود. بنابراین، می توانید کد ها را در پس زمینه اجرا کرده و پس از اتمام مراحل، دوباره به آن برگردید.

بیایید مراحل لازم را برای راه اندازی و اجرای این اسکریپت را با هم مرور کنیم.

---

مرحله 1: بسته های لازم را نصب کنید

قبل از شروع نوشتن هر کد، باید برخی از بسته های پایتون را که قبل از استفاده اسکریپت مورد نیاز است، نصب کنیم. این موارد به راحتی با استفاده از عملکرد “IMPORT” قابل نصب هستند.

بسته های مورد نیاز ما عبارتند از:

• urllib: برای کار با، باز کردن، خواندن و تجزیه URL ها.
• json: به شما امکان می دهد تا یک فایل JSON را به پایتون یا یک پرونده پایتون به JSON تبدیل کنید.
• requests: یک کتابخانه HTTP برای ارسال انواع درخواست HTTP.
• pandas:عمدتا برای اصلاح، تجزیه و تحلیل داده ها استفاده می شود، از آن برای ایجاد DataFrames استفاده می کنیم.
• time:ماژولی برای کار با اوقات فراغت، ما از آن استفاده می کنیم برای همزمان کردن درخواست ها.
• files: با کمک Google Colab، این امکان فراهم می شود تا فایل ها را بارگذاری و بارگیری کنید.
• io:رابط پیش فرض مورد استفاده برای دسترسی به پرونده ها.

Import required packages# 
import json
import requests
import pandas as pd
import urllib
import time
from google.colab import files
import io 

مرحله 2: درخواست API را تنظیم کنید

مرحله بعدی تنظیم درخواست API است. دستورالعمل های کامل را می توان در اینجا یافت، اما در اصل این دستور به این شکل است:

https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url={yourURL}/&strategy=mobile/&key={yourAPIKey}

به شما این امکان را می دهد تا URL، استراتژی (دسکتاپ یا موبایل) و کلید API خود را اضافه کنید.

برای استفاده از آن با پایتون، ما از کتابخانه درخواست urllib.lt.rlopen استفاده می کنیم و آن را به متغیری به نام “result” اضافه می کنیم تا بتوانیم نتایج را ذخیره کنیم و دوباره از آن ها در اسکریپت استفاده کنیم.

 Define URL  #
url = 'https://www.example.co.uk'

 API request url#
result = urllib.request.urlopen('https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url={}/&strategy=mobile'\
.format(url)).read().decode('UTF-8')

print(result)

مرحله 3: تست API

برای تست صحیح API و همچنین درک درستی از آنچه در طول آزمایش ایجاد می شود، یک URL را از طریق API با استفاده از روش ساده urllib.quest اجرا کردیم.

پس از اتمام این کار، ما نتیجه را به یک فایل json تبدیل کرده و آن را بارگیری کردیم تا نتیجه را مشاهده کنیم.

 Convert to json format#
result_json = json.loads(result)

print(result_json)

with open('result.json', 'w') as outfile:
  json.dump(result_json, outfile)

files.download('result.json')

(توجه داشته باشید که این روش برای تبدیل و بارگیری پرونده های JSON در Google Colab است.)

مرحله 4: پرونده JSON را بخوانید

هنگامی که در ویرایشگر، کد مورد نظر خود را باز می کنید، پرونده JSON به طور معمول شبیه به این مورد خواهد بود.

درک آن بسیار دشوار است، اما استفاده از online JSON viewer شما را قادر می سازد تا آن را به یک نمای درختی قابل خواندن تبدیل کنید.

پرونده JSON ارور field data را نمایش می دهد، که در زیر loadingExperience و آزمایشگاه داده ذخیره می شود که می توانید در زیر lighthouseResult آن را مشاهده کنید.

برای دریافت معیارهای مورد نظر، می توانیم از قالب پرونده JSON استفاده کنیم، زیرا می توانیم ببینیم کدام متریک در زیر هر بخش قرار دارد.

به عنوان مثال، First Input Delay تحت loadingExperience نمایش داده می شود.

در حالی که First Contentful Paint در زیر lighthouseResult نمایش داده می شود.

در اینجا معیارهای سنجش دیگری نیز حضور دارند که تحت گزینه lighthouseResult نمایش داده می شوند، مانند:

• Speed Index
• First Contentful Paint
• Cumulative Layout Shift

مرحله 5: CSV را دانلود کرده و به عنوان Pandas Dataframe ذخیره کنید

قدم بعدی آپلود فایل CSV از آدرس های اینترنتی است که می خواهیم از طریق API ابزار PSI آن را اجرا کنیم. می توانید لیستی از آدرس های اینترنتی سایت خود را از یک ابزار مانند DeepCrawl تهیه کنید.

از آنجا که ما از API استفاده می کنیم، توصیه می کنم از یک نمونه کوچک با تعداد کمی URL استفاده کنید، به خصوص اگر سایتی بزرگ دارید.

به عنوان مثال، می توانید از صفحاتی با بالاترین سطح ترافیک یا صفحاتی استفاده کنید که بیشترین درآمد را دارند. از طرف دیگر، اگر سایت شما دارای الگو یا Template باشد، برای آزمایش مجموعه های این موارد عالی خواهد بود.

همچنین می توانید یک متغیر column-header را در اینجا اضافه کنید، که در هنگام تکرار از طریق لیست از آن ها استفاده خواهیم کرد. اطمینان حاصل کنید که این با عنوان column-header در پرونده CSV که آپلود می کنید مطابقت داشته باشد:

uploaded = files.upload()
#if your column header is something other than 'url' please define it here 
column_header='url'

(لطفا توجه داشته باشید که این روش برای بارگذاری پرونده های CSV در Google Colab است.)

پس از بارگذاری ما از کتابخانه Pandas برای تبدیل CSV به DataFrame استفاده می کنیم، که می توان آن را در مراحل بعدی تکرار کرد.

 #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 مانند این خواهد بود که با zero-indexing شروع می شود.

مرحله 6: نتایج را در یک Response Object ذخیره کنید

مرحله بعدی شامل استفاده از یک حلقه for برای تکرار DataFrame URL هایی است که ما فقط از طریق API ی PSI ایجاد کرده ایم.

یک حلقه For به ما اجازه می دهد تا از طریق لیستی که بارگذاری کرده ایم دستور مربوط به هر مورد را تکرار کنیم. سپس می توانیم نتایج را در یک Response Object ذخیره کنیم و آن را به یک فایل JSON تبدیل کنیم.

response_object = {}

 #Iterate through the df
for x in range(0, len(df)):

         #Define request parameter
        url = df.iloc[x][column_header]

         #Make request
        pagespeed_results = urllib.request.urlopen('https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url={}&strategy=mobile'.format(url)).read().decode('UTF-8')

         #Convert to json format
        pagespeed_results_json = json.loads(pagespeed_results)

         #Insert returned json response into response_object
        response_object[url] = pagespeed_results_json
        time.sleep(30)
        
        print(response_object[url])

ما در اینجا از x در دامنه استفاده خواهیم کرد، URL هایی را که از طریق حلقه در حال اجرا هستند را نمایش می دهد، همچنین (0 ، len) که به حلقه اجازه می دهد تا تمام URL های موجود در DataFrame را اجرا کند، مهم نیست که تعداد آن ها چه مقدار باشد.

زمان اجرای حلقه، response object مانع از تداخل URL ها می شود و به ما اجازه می دهد تا داده ها را برای استفاده بعدی ذخیره کنیم. همچنین در اینجا ما قبل از تبدیل آن به پرونده JSON، از متغیر  column header  برای تعریف پارامتر درخواست URL استفاده خواهیم کرد.

همچنین زمان توقف را 30 ثانیه تعیین کرده ایم، تا تعداد تماس های API که به صورت متوالی انجام می شود را کاهش دهیم.

از طرف دیگر، اگر می خواهید سریعتر درخواست کنید، می توانید یک کلید API را در انتهای دستور URL اضافه کنید.

دراین بخش حلقه ها بسیار پر اهمیت هستند زیرا هر بخش درون حلقه ها قرار دارند که فرمانی را صادر می کنند.

مرحله 7: برای ذخیره پاسخ ها یک Dataframe ایجاد کنید

ما همچنین باید DataFrame بسازیم که معیارهایی را که می خواهیم از response object دریافت کنیم، ذخیره کند.

DataFrame یک ساختار داده شبیه به یک جدول است، با ستون ها و ردیف هایی که داده را ذخیره می کنند. ما به سادگی باید ستونی را برای هر متریک اضافه کنیم و آن را به طور مناسب نامگذاری کنیم، به قطعه کد زیر توجه کنید:

 #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)

در این اسکریپت، از معیارهای Core Web Vitals، به همراه معیارهای دانلود و تعامل استفاده شده در نسخه فعلی lighthouse استفاده کرده ایم.

• Largest Contentful Paint (LCP)
• First Input Delay (FID)
• Cumulative Layout Shift (CLS)
• First Contentful Paint (FCP)
• Time to Interactive (TTI)
• Total Blocking Time (TBT)

همچنین شاخص سرعت و دسته بندی کلی را نیز انتخاب کرده ایم که با امتیاز آهسته، متوسط یا سریع مشخص می شوند.

مرحله 8: اندازه گیری ها را از Response Object دریافت کنید

هنگامی که Response Object را ذخیره کردیم، اکنون می توانیم این مورد را نادیده گرفته و معیارهای مورد نظر خود را دریافت کنیم.

در اینجا ما یک بار دیگر از حلقه ها برای دریافت response object استفاده می کنیم و دنباله ای از فهرست ها را تنظیم می کنیم تا فقط معیارهای خاص را دریافت کنیم.

برای هر URL نام ستون را از DataFrame تعریف می کنیم و همچنین دسته ای خاص ازنتایج را که ما می خواهیم از هر متریک آن استفاده کنیم.

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']

این اسکریپت را تنظیم کرده ایم تا معیارهای کلیدی را که در بالا به آن ها اشاره کردیم دریافت کنیم، بنابراین می توانید از آن برای جمع آوری این داده ها استفاده کنید.

با این وجود، می توان تعدادی از معیارهای مفید دیگر را که در هر دو تست PSI و همچنین تحلیل lighthouse یافت می شود، بیرون کشید.

در اینجاست که فایل JSON برای بررسی مکان های موجود در لیست مفید است.

به عنوان مثال ، هنگام استخراج معیارها از ممیزی های Lighthouse، مانند مقدار نمایش Time to Interactive ، از قطعه کد زیر استفاده می کنید:

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

مهم است که مطمئن شوید که هر یک از این موارد در داخل حلقه قرار می گیرند، در غیر این صورت URL فقط یک بار تکرار می شود.

DataFrame به شکل زیر نمایش داده می شود:

مرحله 9: DataFrame را به یک پرونده CSV تبدیل کنید

مرحله آخر ایجاد یک فایل خلاصه برای جمع آوری تمام نتایج است. می توانیم این کد را به فرمی تبدیل کنیم که به راحتی مانند یک فایل CSV آن را مورد تحلیل قرار دهیم.

summary = df_pagespeed_results

df_pagespeed_results.head()

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

(توجه داشته باشید که این روش برای تبدیل و دانلود پرونده های CSV در Google Colab است.)

اطلاعات بیشتر را جست وجو کنید

تمام معیارهایی که ایجاد کرده ایم در حال حاضر به صورت رشته هایی ذخیره می شوند که از داده های پایتون برای متن و کاراکترها مورد استفاده قرار می گیرد.

از آنجا که برخی از معیارهایی که ما استخراج می کنیم در واقع مقادیر عددی هستند، ممکن است بخواهید رشته ها را به داده های عددی مانند عدد صحیح و اعداد شناور تبدیل کنید.

Integers، به عنوان int شناخته می شوند، داده های مربوط به اعداد کامل است، مانند عدد1 تا 10

Floating point numbers، که به عنوان float نیز شناخته می شوند، اعداد اعشاری هستند، مانند 1.0 و 10.1

برای تبدیل رشته ها به اعداد، دو مرحله وجود دارد که باید انجام دهیم: اولین کار این است که کاراکتر ((used to represent seconds) را با blank space جایگزین کنید. این کار را با استفاده از متد str.replace در هر ستون انجام می دهیم.

#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', '')

سپس از متد astype () برای تبدیل رشته ها به عدد صحیح یا عدد اعشاری استفاده خواهیم کرد:

#Turn strings into intergers or floats
df_pagespeed_results['Largest_Contentful_Paint'] = df_pagespeed_results.Largest_Contentful_Paint.astype(float)
df_pagespeed_results['Cumulative_Layout_Shift'] = df_pagespeed_results.Cumulative_Layout_Shift.astype(int)
df_pagespeed_results['First_Contentful_Paint'] = df_pagespeed_results.First_Contentful_Paint.astype(float)
df_pagespeed_results['Time_to_Interactive'] = df_pagespeed_results.Time_to_Interactive.astype(float)
df_pagespeed_results['Speed_Index'] = df_pagespeed_results.Speed_Index.astype(float)

پس از انجام این کار، می توانید از چندین روش مختلف برای ارزیابی بیشتر داده ها استفاده کنید.

به عنوان مثال، می توانید از data visualization libraries مانند matplotlib یا seaborn برای visualize the metrics استفاده کنید، همچنین می توانید نحوه تغییر آن ها به مرور زمان و نتایج گروه ها را با سطوح کند، متوسط و سریع برچسب گذاری کنید.

نتیجه

این اسکریپت در نهایت به ما کمک کرده است تا سرعت صفحه های کلیدی سایت و معیارهای عملکرد گروهی از URL ها را با استفاده از پایتون اندازه گیری کنیم و همچنین تجسم نتایج را به منظور شناسایی صفحات که در آنجا نیاز به پیشرفت دارند، بدست آوریم. همچنین به شما این امکان را می دهد تا نتایج را با گذشت زمان کنترل کنید و پیشرفت های انجام شده را اندازه گیری کنید.

امیدوارم که این امر برای هرکسی که به دنبال اتوماسیون تست عملکرد خود است و بررسی بیشتر PSI از API است، مفید باشد.

منبع How to Use Python to Monitor & Measure Website Performance