कैसे 2020 में एक वेबसाइट या ब्लॉग बनाने के लिए - एक वेबसाइट बनाने के लिए नि: शुल्क और आसान गाइड

वेबसाइट के प्रदर्शन की निगरानी और मापने के लिए पायथन का उपयोग कैसे करें

पिछले एक महीने में, Google ने इस बारे में कई प्रगति की घोषणा की है कि वे मुख्य गति और प्रदर्शन मैट्रिक्स के माध्यम से उपयोगकर्ता के अनुभव को कैसे मापेंगे।

संयोगवश, मैं एक पायथन स्क्रिप्ट बनाने पर काम कर रहा हूं, जो प्रत्येक व्यक्ति URL के लिए परीक्षण चलाने की आवश्यकता के बिना, एक ही बार में कई पृष्ठों के लिए मैट्रिक्स एकत्र करने के लिए Google PageSpeed ​​Insights (PSI) API का उपयोग करता है।

Google की घोषणाओं के बाद, मैंने सोचा कि अब इसे साझा करने का सही समय होगा, साथ ही यह समझाने के लिए कि आप शुरुआती लोगों के लिए यह पायथन स्क्रिप्ट कैसे बना सकते हैं।

स्क्रिप्ट के बारे में सबसे अच्छी बात यह है कि एक बार आपके पास मूल बातें होने के बाद आप कई अलग-अलग मैट्रिक्स निकाल पाएंगे जो पेज स्पीड टेस्ट के साथ-साथ लाइटहाउस विश्लेषण में भी मिल सकते हैं।

वेब महत्वपूर्ण मैट्रिक्स के लिए एक परिचय

मई की शुरुआत में, Google ने Core Web Vitals पेश किए, जो इसके प्रमुख Web Vitals मेट्रिक्स का सबसेट हैं।

इन मैट्रिक्स का उपयोग किसी वेबसाइट पर उपयोगकर्ता अनुभव की गुणवत्ता पर मार्गदर्शन प्रदान करने के लिए किया जाता है।

Google ने उन्हें उपयोगकर्ता अनुभव पर ध्यान केंद्रित करने के लिए अपनी शिफ्ट को आगे बढ़ाते हुए “आपकी साइट के अनुभव को बेहतर बनाने और सुधार के अवसरों की पहचान करने में मदद करने का एक तरीका बताया है।”

कोर वेब विटल्स वास्तविक दुनिया उपयोगकर्ता-केंद्रित मीट्रिक हैं जो उपयोगकर्ता अनुभव के प्रमुख पहलुओं को मापते हैं; चार्जिंग समय, अन्तरक्रियाशीलता और स्थिरता।

मैं इस पोस्ट में यह समझाकर बहुत विस्तार में नहीं जा रहा हूँ, आप यहाँ और अधिक जानकारी प्राप्त कर सकते हैं, लेकिन ये नए मैट्रिक्स निम्न हैं:

  • सबसे बड़ी सामग्री पेंटिंग।
  • पहले प्रवेश में देरी।
  • संचयी डिजाइन परिवर्तन।

LCP - FID - CLS

इसके अलावा, Google ने पिछले हफ्ते घोषणा की कि वे एक नई खोज रैंकिंग टोकन पेश करेंगे जो इन मेट्रिक्स को मौजूदा पेज अनुभव टोकन के साथ जोड़ देगा, जैसे कि मोबाइल डिवाइस संगतता और HTTPS सुरक्षा, ताकि वे वेबसाइटों की सेवा जारी रख सकें। उपयोगकर्ताओं के लिए उच्च गुणवत्ता

प्रदर्शन मीट्रिक निगरानी

इस अद्यतन को 2021 में रोल आउट करने की उम्मीद है, और Google ने पुष्टि की है कि तत्काल कार्रवाई की आवश्यकता नहीं है।

हालाँकि, इन परिवर्तनों के लिए हमें तैयार करने में मदद करने के लिए, उन्होंने पृष्ठ गति को मापने के लिए उपयोग किए गए औजारों को अपडेट किया है, जिसमें पीएसआई, गूगल लाइटहाउस और Google सर्च कंसोल स्पीड रिपोर्ट शामिल हैं।

पेजस्पीड इनसाइट्स एपीआई कहाँ से आता है?

Google द्वारा पेजस्पीड इनसाइट्स एक वेब पेज के प्रदर्शन का सारांश देखने के लिए एक उपयोगी उपकरण है और परिणाम उत्पन्न करने के लिए क्षेत्र और प्रयोगशाला डेटा दोनों का उपयोग करता है।

यह एक मुट्ठी भर यूआरएल का अवलोकन प्राप्त करने का एक शानदार तरीका है, क्योंकि यह पेज द्वारा पेज का उपयोग किया जाता है।

हालांकि, यदि आप एक बड़ी साइट पर काम कर रहे हैं और बड़े पैमाने पर जानकारी प्राप्त करना चाहते हैं, तो एपीआई को एक साथ कई पृष्ठों को पार्स करने के लिए फायदेमंद हो सकता है, बिना यूआरएल को व्यक्तिगत रूप से कनेक्ट करने की आवश्यकता के बिना।

प्रदर्शन को मापने के लिए एक पायथन स्क्रिप्ट

मैंने प्रत्येक URL को मैन्युअल रूप से परीक्षण करने में लगने वाले समय को बचाने के लिए, मुख्य प्रदर्शन मीट्रिक को मापने के लिए निम्न पायथन स्क्रिप्ट बनाई है।

यह स्क्रिप्ट Google PSI API के लिए अनुरोध भेजने के लिए और पीएसआई और लाइटहाउस दोनों में प्रदर्शित होने वाले मैट्रिक्स को निकालने के लिए पायथन का उपयोग करती है।

मैंने इस स्क्रिप्ट को Google Colab में लिखने का फैसला किया क्योंकि यह पायथन लिखना शुरू करने का एक शानदार तरीका है और आसान साझाकरण की अनुमति देता है इसलिए यह पोस्ट Google Colab का उपयोग करके सेटिंग्स के माध्यम से चलेगा।

हालाँकि, इसे स्थानीय रूप से भी चलाया जा सकता है, जिसमें डेटा अपलोड करने और डाउनलोड करने की कुछ सेटिंग्स हैं।

यह नोट करना महत्वपूर्ण है कि कुछ चरणों को पूरा करने में कुछ समय लग सकता है, खासकर जब प्रत्येक URL एपीआई के माध्यम से चलाया जाता है, ताकि इसे अनुरोधों के साथ अधिभार न डालें।

इसलिए, आप स्क्रिप्ट को पृष्ठभूमि में चला सकते हैं और चरण पूरा होने पर उस पर वापस लौट सकते हैं।

आइए इस लिपि को चलाने और चलाने के लिए आवश्यक कदम देखें।

चरण 1: आवश्यक पैकेज स्थापित करें

इससे पहले कि हम कोई कोड लिखना शुरू करें, हमें कुछ पायथन पैकेजों को स्थापित करने की आवश्यकता है जो स्क्रिप्ट का उपयोग करने से पहले आवश्यक हैं। आयात फ़ंक्शन का उपयोग करके इंस्टॉल करना आसान है।

हमें जिन पैकेजों की आवश्यकता होगी वे हैं:

  • urllib: URL के साथ काम करने, खोलने, पढ़ने और विश्लेषण करने के लिए।
  • json: आपको JSON फ़ाइल को Python या Python फ़ाइल में JSON में बदलने की अनुमति देता है।
  • याचिकाओं: सभी प्रकार के HTTP अनुरोध भेजने के लिए एक HTTP लाइब्रेरी।
  • पांडा: मुख्य रूप से डेटा विश्लेषण और हेरफेर के लिए उपयोग किया जाता है, हम इसका उपयोग डेटा फ़्रेम बनाने के लिए कर रहे हैं।
  • घंटा: समय के साथ काम करने के लिए एक मॉड्यूल, हम अनुरोधों के बीच समय अंतराल प्रदान करने के लिए इसका उपयोग कर रहे हैं।
  • अभिलेख: Google Colab से, यह आपको फ़ाइलें अपलोड और डाउनलोड करने की अनुमति देगा।
  • कब: फ़ाइलों तक पहुँचने के लिए उपयोग किया जाने वाला डिफ़ॉल्ट इंटरफ़ेस।
# Import required packages 
import json
import requests
import pandas as pd
import urllib
import time
from google.colab import files
import io 

चरण 2: एक एपीआई अनुरोध को कॉन्फ़िगर करें

अगला चरण एपीआई अनुरोध को कॉन्फ़िगर करने के लिए है। पूर्ण निर्देश यहां मिल सकते हैं, लेकिन अनिवार्य रूप से कमांड इस तरह दिखाई देगी:

urllib.request.urlopen और इसे चर में जोड़ें (ध्यान दें कि यह विधि Google Colab में JSON फ़ाइलों को परिवर्तित करने और डाउनलोड करने के लिए है)।

चरण 4: JSON फ़ाइल पढ़ें

JSON फ़ाइल आम तौर पर इस तरह दिखेगी, जब आपकी पसंद के कोड संपादक में खोली जाती है।

JSON फ़ाइल पढ़ें

यह समझना काफी मुश्किल है, लेकिन एक ऑनलाइन JSON दर्शक का उपयोग करने से आप इसे पढ़ने योग्य पेड़ के दृश्य में बदल सकते हैं।

पढ़ने योग्य पेड़ का दृश्य

JSON फ़ाइल फ़ील्ड डेटा प्रदर्शित करती है, जिसे loadingExperience में संग्रहीत किया जाता है, और लैब डेटा जिसे आप lighthouseResult पर पा सकते हैं।

वांछित मीट्रिक निकालने के लिए, हम JSON फ़ाइल प्रारूप का उपयोग कर सकते हैं, क्योंकि हम देख सकते हैं कि प्रत्येक अनुभाग के तहत मीट्रिक क्या है।

उदाहरण के लिए, पहले प्रविष्टि देरी loadingExperience में पाया जाता है।

पहली प्रविष्टि देरी loadingExperience में पाया जाता है

जबकि पहले विवादास्पद पेंट प्रकाशस्तंभ पर है।

पहली खुश पेंटिंग प्रकाशस्तंभ के नीचे है

प्रकाशस्तंभ के तहत कई अन्य मैट्रिक्स संग्रहीत हैं, जैसे कि ऑडिट:

  • गति सूचकांक।
  • पहली खुश पेंटिंग।
  • संचयी डिजाइन परिवर्तन।

चरण 5: एक सीएसवी लोड करें और पंडों के डेटा फ्रेम के रूप में स्टोर करें

अगला कदम एक URL CSV फ़ाइल लोड करना है जिसे हम PSI API के माध्यम से चलाना चाहते हैं। आप क्रॉलिंग टूल से अपने साइट URL की एक सूची जनरेट कर सकते हैं, जैसे DeepCrawl।

चूंकि हम एपीआई का उपयोग कर रहे हैं, मैं यहां एक छोटे से नमूना URL का उपयोग करने की सलाह दूंगा, खासकर यदि आपके पास एक बड़ी साइट है।

उदाहरण के लिए, आप ट्रैफ़िक के उच्चतम स्तर वाले पृष्ठों का उपयोग कर सकते हैं, या वे पृष्ठ जो सबसे अधिक राजस्व उत्पन्न करते हैं। वैकल्पिक रूप से, यदि आपकी साइट पर टेम्प्लेट हैं, तो यह इन के परीक्षण सेट के लिए आदर्श होगा।

आप एक भी जोड़ सकते हैं (ध्यान दें कि यह विधि CSV फ़ाइलों को Google Colab पर अपलोड करने के लिए है)।

एक बार जब यह लोड हो जाता है, तो हम CSV को डेटाफ़्रेम में बदलने के लिए पंडों की लाइब्रेरी का उपयोग करेंगे, जिसे हम निम्नलिखित चरणों में देख सकते हैं।

# 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 इस तरह दिखेगा, जिसकी शुरुआत जीरो इंडेक्सिंग से होगी।

डेटा ढांचा

चरण 6: परिणाम को एक प्रतिक्रिया ऑब्जेक्ट पर सहेजें

अगले चरण में यहाँ रेंज में कुल्हाड़ी का उपयोग करना शामिल है, जो उन यूआरएल का प्रतिनिधित्व करेगा जिन्हें हम लूप के माध्यम से चला रहे हैं, साथ ही साथ प्रतिक्रिया ऑब्जेक्ट यूआरएल को एक-दूसरे को ओवरराइड करने से रोकता है जैसा कि आप साथ चलते हैं और हमें डेटा को बचाने के लिए अनुमति देते हैं इसका भविष्य में उपयोग।

यह वह जगह भी है जहां हम JSON फ़ाइल को कनवर्ट करने से पहले URL अनुरोध पैरामीटर को परिभाषित करने के लिए कॉलम हेडर चर का उपयोग करेंगे।

मैंने नींद के समय को भी 30 सेकंड के लिए निर्धारित किया है, ताकि लगातार एपीआई कॉल की संख्या कम हो सके।

वैकल्पिक रूप से, आप URL कमांड के अंत में एक एपीआई कुंजी जोड़ सकते हैं यदि आप अनुरोधों को तेज़ी से बनाना चाहते हैं।

यहां इंडेंटेशन भी महत्वपूर्ण है क्योंकि, जैसा कि प्रत्येक चरण लूप के लिए है, उन्हें कमांड के भीतर इंडेंट किया जाना चाहिए।

चरण 7: प्रतिक्रियाओं को संग्रहीत करने के लिए एक डेटा फ़्रेम बनाएं

हमें एक 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)

इस स्क्रिप्ट के उद्देश्य के लिए, मैंने कोर वेब वाइटल मेट्रिक्स का उपयोग किया है, साथ ही लाइटहाउस के वर्तमान संस्करण में उपयोग किए जाने वाले अतिरिक्त लोडिंग और अन्तरक्रियाशीलता मैट्रिक्स के साथ।

इन मेट्रिक्स में अलग-अलग वज़न होते हैं जो तब समग्र प्रदर्शन स्कोर में उपयोग किए जाते हैं:

आप प्रत्येक मीट्रिक के बारे में अधिक जान सकते हैं, साथ ही साथ उनके व्यक्तिगत लैंडिंग पृष्ठों पर स्कोर की व्याख्या कैसे करें, जो ऊपर दिए गए हैं।

मैंने गति सूचकांक और समग्र श्रेणी को शामिल करने के लिए भी चुना है जो धीमी, औसत या तेज़ स्कोर प्रदान करेगा।

चरण 8: प्रतिक्रिया वस्तु से मैट्रिक्स निकालें

एक बार जब हमारे पास प्रतिक्रिया ऑब्जेक्ट सहेजा जाता है, तो हम अब इसे फ़िल्टर कर सकते हैं और केवल इच्छित मैट्रिक्स निकाल सकते हैं।

यहां, एक बार फिर, हम प्रतिक्रिया ऑब्जेक्ट फ़ाइल के माध्यम से लूप के लिए लूप का उपयोग करेंगे और केवल विशिष्ट मैट्रिक्स को वापस करने के लिए सूची अनुक्रम का एक क्रम निर्धारित करेंगे।

इसके लिए, हम DataFrame के कॉलम के नाम को परिभाषित करेंगे, साथ ही साथ प्रतिक्रिया ऑब्जेक्ट की विशिष्ट श्रेणी जिसमें से हम प्रत्येक मीट्रिक के लिए, प्रत्येक URL को निकालेंगे।

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

मैंने इस स्क्रिप्ट को ऊपर वर्णित मुख्य मेट्रिक्स को निकालने के लिए कॉन्फ़िगर किया है ताकि आप तुरंत इस डेटा को इकट्ठा करने के लिए इसका उपयोग कर सकें।

हालांकि, कई अन्य उपयोगी मैट्रिक्स निकालना संभव है जो पीएसआई परीक्षणों और लाइटहाउस विश्लेषण दोनों में पाए जा सकते हैं।

यह वह जगह है जहाँ JSON फ़ाइल समीक्षा के लिए उपयोगी है जहाँ प्रत्येक मीट्रिक सूची में है।

उदाहरण के लिए, जब लाइटहाउस ऑडिट से मैट्रिक्स निकालते हैं, जैसे कि टाइम टू इंटरएक्टिव का प्रदर्शन मूल्य, आप निम्न का उपयोग करेंगे:

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

फिर, यह सुनिश्चित करना महत्वपूर्ण है कि इनमें से प्रत्येक लूप के भीतर आता है, अन्यथा वे पुनरावृत्ति में शामिल नहीं होंगे और एक URL के लिए केवल एक परिणाम उत्पन्न होगा।

हमारा अंतिम डेटाफ़्रेम इस तरह दिखेगा;

अंतिम डेटा फ़्रेम

चरण 9: डेटाफ़्रेम को सीएसवी फ़ाइल में बदलें

अंतिम चरण सभी परिणामों को इकट्ठा करने के लिए एक सारांश फ़ाइल बनाना है, ताकि हम इसे एक प्रारूप में परिवर्तित कर सकें जिसे हम आसानी से पार्स कर सकते हैं, उदाहरण के लिए एक सीएसवी फ़ाइल।

summary = df_pagespeed_results

df_pagespeed_results.head()

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

प्रत्येक स्तंभ पर .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', '')

तब हम उपयोग करेंगे छवि क्रेडिट

लेखक द्वारा सभी स्क्रीनशॉट, जून 2020