Массовая загрузка тестов производительности с API PageSpeed ​​Insights и Python

Google предлагает PageSpeed ​​Insights API, чтобы помочь SEO-специалистам и разработчикам, смешивая реальные данные с данными моделирования, предоставляя данные о времени загрузки, связанные с веб-страницами.

Разница между Google PageSpeed ​​Insights (PSI) и Lighthouse заключается в том, что PSI использует как реальные, так и лабораторные данные, в то время как Lighthouse выполняет симуляцию загрузки страницы, изменяя соединение и пользовательский агент устройства.

Еще одно отличие заключается в том, что PSI не предоставляет никакой информации, связанной с доступностью в Интернете, SEO или прогрессивными веб-приложениями (PWA), в то время как Lighthouse предоставляет все вышеперечисленное.

Таким образом, когда мы используем PageSpeed ​​Insights API для теста производительности массовой загрузки URL, у нас не будет никаких данных о доступности.

Однако PSI предоставляет больше информации, связанной со скоростью страницы, например, «Размер DOM», «Самый глубокий дочерний элемент DOM», «Общее количество задач» и время «Загружено содержимое DOM».

Еще одно преимущество API PageSpeed ​​Insights заключается в том, что он дает разные имена «наблюдаемым метрикам» и «фактическим метрикам».

В этом руководстве вы узнаете:

• Как создать сценарий Python производственного уровня.
• Как использовать API с Python.
• Как создавать фреймы данных из ответов API.
• Как анализировать ответы API.
• Как анализировать URL-адреса и обрабатывать ответы на URL-запросы.
• Как хранить ответы API с правильной структурой.

Ниже приведен пример вывода вызова Page Speed ​​Insights API с Python.

Библиотеки для использования PageSpeed ​​Insights API с Python

Ниже перечислены необходимые библиотеки для использования PSI API с Python.

• Advertools извлекает тестовые URL-адреса из карты сайта веб-сайта.
• Pandas должен построить фрейм данных и сгладить выходные данные API в формате JSON.
• Запросы предназначены для отправки запроса к определенной конечной точке API.
• JSON должен принять ответ API и поместить его в специально связанную точку словаря.
• Datetime должен изменить имя конкретного выходного файла с датой момента.
• URLlib предназначен для анализа URL-адреса веб-сайта испытуемого.

Как использовать PSI API с Python?

Чтобы использовать PSI API с Python, выполните следующие действия.

• Получите ключ API PageSpeed ​​Insights.
• Импортируйте необходимые библиотеки.
• Разберите URL-адрес веб-сайта испытуемого.
• Возьмите дату момента для имени файла.
• Возьмите URL-адреса в список из карты сайта.
• Выберите нужные метрики из PSI API.
• Создайте цикл For для получения ответа API для всех URL-адресов.
• Создайте фрейм данных с выбранными метриками PSI API.
• Выведите результаты в виде XLSX.

1. Получите ключ API PageSpeed ​​Insights

Используйте документацию API PageSpeed ​​Insights для получения ключа API.

Нажмите кнопку «Получить ключ» ниже.

Выберите проект, который вы создали в Google Developer Console.

Включите API PageSpeed ​​Insights для этого конкретного проекта.

Вам нужно будет использовать конкретный ключ API в ваших запросах API.

2. Импортируйте необходимые библиотеки

Используйте строки ниже, чтобы импортировать основные библиотеки.

    import advertools as adv
    import pandas as pd
    import requests
    import json
    from datetime import datetime
    from urllib.parse import urlparse

3. Разберите URL-адрес веб-сайта испытуемого

Чтобы разобрать URL-адрес тематического веб-сайта, используйте приведенную ниже структуру кода.

  domain = urlparse(sitemap_url)
  domain = domain.netloc.split(".")[1]

Переменная «домен» — это проанализированная версия URL-адреса карты сайта.

«netloc» представляет раздел домена конкретного URL-адреса. Когда мы разделяем его с помощью «.» он занимает «средний раздел», который представляет доменное имя.

Здесь «0» — это «www», «1» — «имя домена», а «2» — «расширение домена», если мы разделим его с помощью «.»

4. Возьмите дату момента для имени файла

Чтобы получить дату конкретного момента вызова функции, используйте метод «datetime.now».

Datetime.now предоставляет конкретное время определенного момента. Используйте «strftime» со значениями «%Y», «%m» и «%d». «%Y» — год. «%m» и «%d» — это числовые значения для определенного месяца и дня.

 date = datetime.now().strftime("%Y_%m_%d")

5. Возьмите URL-адреса в список из карты сайта

Чтобы преобразовать URL-адреса в форму списка из файла карты сайта, используйте приведенный ниже блок кода.

   sitemap = adv.sitemap_to_df(sitemap_url)
   sitemap_urls = sitemap["loc"].to_list()

Если вы читали Аудит работоспособности карты сайта Python, вы можете узнать дополнительную информацию о картах сайта.

6. Выберите необходимые метрики из PSI API

Чтобы выбрать свойства JSON ответа PSI API, вы должны увидеть сам файл JSON.

Это очень важно для чтения, синтаксического анализа и сведения объектов JSON.

Это даже связано с семантическим SEO благодаря концепции «направленного графа» и структурированных данных «JSON-LD».

В этой статье мы не будем сосредотачиваться на изучении конкретных иерархий JSON PSI API Response.

Вы можете увидеть метрики, которые я выбрал для сбора из PSI API. Он богаче, чем базовый вывод PSI API по умолчанию, который дает только основные метрики Web Vitals или индекс скорости взаимодействия до следующей отрисовки, время до первого байта и первую отрисовку с содержанием.

Конечно, он также дает «предложения», говоря: «Избегайте объединения критических запросов в цепочку», но нет необходимости помещать предложение во фрейм данных.

В будущем эти предложения или даже каждое отдельное событие цепочки, их значения KB и MS можно будет собрать в один столбец с именем «psi_suggestions».

Для начала вы можете проверить метрики, которые я выбрал, и важная часть из них будет для вас первой.

Метрики PSI API, первый раздел ниже.

    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 = []

Этот раздел включает в себя все наблюдаемые и смоделированные основные показатели скорости страницы, а также некоторые неосновные показатели, такие как «Загружено содержимое DOM» или «Первая значимая отрисовка».

Второй раздел PSI Metrics фокусируется на возможной экономии байтов и времени за счет неиспользуемого объема кода.

    render_blocking_resources_ms_save = []
    unused_javascript_ms_save = []
    unused_javascript_byte_save = []
    unused_css_rules_ms_save = []
    unused_css_rules_bytes_save = []

Третий раздел показателей PSI фокусируется на времени отклика сервера, преимуществах использования адаптивных изображений или их отсутствии, а также на вреде.

    possible_server_response_time_saving = []
    possible_responsive_image_ms_save = []

Примечание. Общая оценка производительности берется из «performance_score».

7. Создайте цикл for для получения ответа API для всех URL-адресов

Цикл for берет все URL-адреса из файла карты сайта и использует API PSI для каждого из них один за другим. Цикл for для автоматизации PSI API состоит из нескольких разделов.

Первый раздел цикла PSI API for начинается с предотвращения дублирования URL-адресов.

В картах сайта вы можете увидеть URL-адрес, который появляется несколько раз. Этот раздел предотвращает это.

for i in sitemap_urls[:9]:
         # Prevent the duplicate "/" trailing slash URL requests to override the information.
         if i.endswith("/"):
               r = requests.get(f"
         else:
               r = requests.get(f"

Не забудьте проверить «api_key» в конце конечной точки API PageSpeed ​​Insights.

Проверьте код состояния. В картах сайта могут быть URL-адреса кода состояния, отличные от 200; они должны быть очищены.

         if r.status_code == 200:
               #print(r.json())
               data_ = json.loads(r.text)
               url.append(i)

В следующем разделе конкретные метрики добавляются к конкретному словарю, который мы создали перед «_data».

               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)

Следующий раздел посвящен подсчету «общей задачи» и размеру DOM.

               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"])

В следующем разделе рассматриваются «Глубина DOM» и «Самый глубокий элемент DOM».

               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"])

В следующем разделе рассматриваются конкретные наблюдаемые результаты тестирования во время нашего API Page Speed ​​Insights.

               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"])

В следующем разделе указывается количество неиспользуемого кода и потраченные впустую байты в миллисекундах вместе с ресурсами, блокирующими рендеринг.

               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"])

Следующий раздел посвящен преимуществам адаптивного изображения и времени ответа сервера.

               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"])

Следующий раздел предназначен для того, чтобы функция продолжала работать в случае возникновения ошибки.

         else:
           continue

Пример использования Page Speed ​​Insights API с Python для массового тестирования

Чтобы использовать определенные блоки кода, поместите их в функцию Python.

Запустите скрипт, и вы получите 29 метрик, связанных со скоростью страницы, в столбцах ниже.

Вывод

PageSpeed ​​Insights API предоставляет различные типы показателей производительности загрузки страниц.

Он демонстрирует, как инженеры Google воспринимают концепцию производительности загрузки страниц и, возможно, используют эти показатели с точки зрения ранжирования, UX и понимания качества.

Использование Python для массовых тестов скорости страницы дает вам снимок всего веб-сайта, чтобы помочь проанализировать возможный пользовательский опыт, эффективность сканирования, коэффициент конверсии и улучшения рейтинга.

Дополнительные ресурсы:

---

Рекомендуемое изображение: Dundanim/Shutterstock