Page speed api google: Get Started with the PageSpeed Insights API

Содержание

Анализируем Хабрахабр с помощью Google Page Speed / Хабр

Google Pagespeed — утилита для анализа производительности клиентской части Web-приложения. Довольно обширный анализ укажет на те вещи, которые следует оптимизировать на сайте, повысив скорость и удобство для аудитории. Инструмент полезный и постоянно дополняется новыми возможностями. Проведем анализ Хабра и посмотрим на оценку и рекомендации, которые покажет нам Pagespeed.

Запускаем анализ

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

Как видим, есть ряд моментов, на которые стоит обратить внимание и оптимизировать. Они указаны в блоке Consider Fixing. Пройдемся по ним:

Minify HTML

Нам рекомендуют минимизировать HTML. На практике — это удаление всех лишних символов (лишних пробелов, табов, переносов строк) из HTML. Как говорит Pagespeed, это может сэкономить 8% размера страницы для Хабра. Это обычно делается в самом приложении, например на PHP.

Enable compression

Compressing un1.adriver.ru/…6/0/script.js?vadriver_banner_1863387959 could save 2.9KiB (63% reduction)
Compressing un1.adriver.ru/…2/0/script.js?vadriver_banner_2100516578 could save 2.9KiB (63% reduction)
…

Видим набор ресурсов, которые используются на странице, но для них не включена компрессия. Все ресурсы — это скрипты adriver для загрузки рекламы. Мы могли сэкономить на них почти 10 Кб в общем запросе. Интересно было бы узнать, по какой причине adriver не сжимает свои скрипты.

Minify JavaScript

Minifying habrahabr.ru/javascripts/1400770549/all.js could save 8KiB (15% reduction) after compression
Minifying habrahabr.ru/…vascripts/1400770549/_parts/shortcuts.js could save 2KiB (62% reduction) after compression
Minifying habrahabr. ru/javascripts/1400770549/posts/all.js could save 1.2KiB (35% reduction) after compression
…

У Хабра не минимизировано несколько JS-скриптов. Для этого есть целый ряд инструментов, например YUI compressor либо Minify для PHP.

Prioritize visible content

Это пункт означает, что некоторые из видимых на первом экране элементов находятся под невидимыми (на первом экране). Что это значит? На примере Хабра — сайдбар, часть которого видна на первом экране находится в HTML’е под всей лентой постов:

В иделе, либо сайдбар нужно убрать либо поделить его на две части — above-the-fold и остальное. На практике это почти нереально. Поэтому, обычно обходятся только тем, чтобы размещать основной контент в HTML’e перед навигацией (как и сделано на Хабре).

Leverage browser caching

content.adriver.ru/plugins/autoUpdate.adriver.js (expiration not specified)
content. adriver.ru/plugins/checkFlash.adriver.js (expiration not specified)
mc.yandex.ru/metrika/watch.js (60 minutes)

Этот пункт говорит нам о том, что на некоторых внешних ресурсах не включено клиентское кеширование (HTTP заголовки Cache-control). Опять видим только adriver и метрику. Ресурсов самого Хабра нет.

Optimize images

Losslessly compressing habrahabr.ru/…s/sidebar/bs_logo_for_block_alone_2x.png could save 2.7KiB (38% reduction)
Losslessly compressing habrahabr.ru/images/footer.ourprojects.png?r=2 could save 2.6KiB (46% reduction)
Losslessly compressing habrahabr.ru/images/footer.share.png could save 2.1KiB (31% reduction)
…

В этом пункте мы видим картинки, которые можно сжать почти на 40%. Есть множество инструментов для сжатия, которые позволяют уменьшить размер картинок без потерь качества.

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

Eliminate render-blocking JavaScript and CSS in above-the-fold content

Все CSS/JS ресурсы, которые объявлены до начала контента блокируют отображение до того момента, пока не будут загружены. Загрузку Javascript’a обычно лучше переносить в самый низ либо использовать асинхронную версию:

В случае CSS это сложнее, Pagespeed рекомендует использовать небольшое количество стилей встроенных в . Туда следует включить только те стили, которые понадобятся для above-the-fold части:

Итог

Хабр оптимизирован на 77% по мнению Pagespeed, что неплохо. Интересно также отметить, самый быстрый ресурс в рунете по оценке Pagespeed — Яндекс, он набрал 96 баллов из 100 возможных.

Модули Pagespeed для Nginx и Apache

Для автоматизации многих задач по оптимизации существует модуль Pagespeed для Web серверов.

Среди прочего, модуль умеет сжимать статику и оптимизировать картинки.

Другие возможности Pagespeed

Для Pagespeed есть API — можно проверять страницы целыми партиями. Также анализ включает оценку производительности и оптимизации под мобильные устройства.

Интересно узнать опыт работы с Pagespeed у Хабра-сообщества. Видел ли кто-нибудь реальные сайты, которые набрали 100 из 100?

Проверка скорости сайта через API Google PageSpeed Insights

21.03.2022

Как массово проверить скорость загрузки страниц сайта с помощью бесплатного API Google PageSpeed Insights? Как вы знаете Google PageSpeed Insights позволяет проверять скорость загрузки тех или иных элементов страниц, а также показывает общий бал скорости загрузки интересующих URL для десктопной и мобильной версии браузера. Читаем, коллеги, пакетная проверка скорости загрузки страниц сайта через Google API.

Проверка скорости загрузки страниц

Инструмент от Google хорош, однако, имеет один существенный минус – он не позволяет создавать групповые проверки URL, что создает неудобства при проверке множества страниц вашего сайта. А вручную проверять скорость загрузки для 100 и более URL по одной странице не очень хорошая идея, так как может занять немало драгоценного времени.

PageSpeed Insights — это инструмент аудита скорости страницы сайта

Поэтому, была создана бесплатная программа BulkPageSpeed, позволяющая создавать групповые проверки скорости загрузки страниц сайта / блога через специальный API в инструменте Google PageSpeed Insights. Анализ URL происходит всего в пару кликов, после чего доступна выгрузка отчета, включающего основные характеристики проверок в удобном виде в Excel.

BulkPageSpeed – программа поможет массово проверить скорость загрузки страниц вашего сайта с помощью бесплатного API инструмента Google PageSpeed Insights.

Пакетная проверка скорости загрузки страниц сайта через Google API

Программа BulkPageSpeed предназначена для массовой проверки скорости загрузки страниц сайта по Google PageSpeed Insights.

Бесплатная программа BulkPageSpeed

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

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

Программа BulkPageSpeed бесплатна, занимает всего 4 Мб в архиве и не требует установки.

Все что необходимо для начала работы – скачать дистрибутив (https://site-analyzer.ru/soft/bulk-google-page-speed/) и сгенерировать ключ API для работы программы по инструкции, представленной ниже.

Настройки и ключ Google API

Список страниц для их последующего анализа можно добавить несколькими способами: вставить из буфера обмена, загрузить из текстового файла, либо импортировать из Sitemap.xml с диска вашего компьютера. Помимо этого, в программе имеется возможность повторного сканирования выбранных URL, а также получение подробной информации о возможных вариантах исправления наиболее очевидных ошибок на сайте.

Расширенные сведения об ошибках

Основные возможности программы:

Проверка групп URL без ограничений по количеству;
Отображение основных показателей скорости страниц: FCP, SI, LCP, TTI, TBT, CLS;
Отображение общей оценки скорости загрузки страниц для мобильной и десктопной версии;
Возможность проверки скорости загрузки URL произвольным списком либо через Sitemap.xml;
Отображение расширенных сведений об ошибках оптимизации сайта;
Экспорт отчетов в Excel (CSV-формат).

Основные анализируемые параметры:

FCP (First Contentful Paint) – время отображения первого контента.
SI (Speed Index) – показатель того, как быстро отображается контент на странице.
LCP (Largest Contentful Paint) – время отображения наибольшего по размеру элемента страницы.
TTI (Time to Interactive) – время, в течение которого страница становится полностью готова к взаимодействию с пользователем.
TBT (Total Blocking Time) – время от первой отрисовки контента до его готовности к взаимодействию с пользователем.
CLS (Cumulative Layout Shift) – накопительный сдвиг макета. Служит для измерения визуальной стабильности страницы.

Получение Google API Key для программы BulkPageSpeed

Для получения API ключа перейдите в раздел Учетные данные сервиса Google API.
Нажмите кнопку Создать учетные данные.
В выпадающем списке выберите Ключ API.
Вставьте его в поле Ключ API на вкладке Настройки.

Выберите Ключ API

Ключ создан

Ключ API создан

Вот и всё. Можете начинать массово проверять скорость загрузки страниц вашего сайта с помощью бесплатного API Google PageSpeed Insights и следовать рекомендациям.

Напомню вам, для WordPress есть плагин Site Kit by Google где есть функция PageSpeed Insights. Повысьте производительность сайта ВордПресс с помощью практических советов от Google PageSpeed.

Удачи, друзья и до новых встреч.

Google PageSpeed Insights REST API v5

Спецификации

Конечная точка API https://www. googleapis.com/pagespeedonline/v5/

Портал API/Домашняя страница https://developers.google.com/speed/docs/insights /v5/get-started

Производительность основной категории

Дополнительные категории SEO, тестирование, инструменты

Поставщик API Google

Поддержка SSL Да

URL Twitter https://twitter.com/googledevs

URL интерактивной консоли https: //developers.google.com/apis-explorer/#p/pagespeedonline/v5/

Модель аутентификации OAuth 2

Версия 5

Статус версии Рекомендуется (активна, поддерживается)

Является ли дизайн/описание API непатентованным? Да

Тип Интернет/Интернет

Область действия Одноцелевой API

Зависит от устройства Нет

URL домашней страницы Документов https://developers.google.com/speed/docs/insights/v5/get-started

Архитектурный стиль REST

Поддерживаемые форматы запросов JSON, URI Query String/CRUD

Поддерживаемые форматы ответов JSON

Это неофициальный API? Нет

Это Hypermedia API? №

Ограниченный доступ (требует разрешения поставщика) №

Последователи (66)

Просмотреть все 66 подписчиков

Разработчики (1)

Просмотреть все 1 Разработчики

API Mashups (2)

.
Инструмент тестирования Google Page Experience позволяет быстро проверить веб-страницу, чтобы проверить, будет ли она проходить этот набор поисковых сигналов: Core Web Vitals, Mobile-friendly, Safe Browsing, HTTPS и No…
Website-Grader.com
Website-Grader.com — это инструмент для оценки веб-сайтов и отчетов об эффективности. Сайт позволяет вам создать подробный отчет для любого веб-сайта, чтобы просмотреть уровень производительности, уровень удобства использования и общий уровень…

00000 Начало работы с Google Page Speed API

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

Чтобы понять, влияет ли время загрузки на удержание и конверсию вашей аудитории, воспользуйтесь инструментом Google Page Speed Insights. Google Page Speed API — это место, где вы можете подключиться к этим данным и включить идеи в свой стек данных. Мы использовали его для создания собственного трекера аналитики Page Speed для отслеживания ключевых показателей пользовательского опыта для наших клиентов.

Чем хорош Page Speed Insights API?

С помощью этого инструмента вы можете подключить URL-адрес и получить сводку о его производительности. Это отлично подходит для выборки нескольких URL-адресов, но что, если у вас большой веб-сайт и вы хотите увидеть всесторонний обзор производительности по нескольким разделам и типам страниц?

Здесь на помощь приходит API. Google Page Speed Insights API дает нам возможность анализировать производительность многих страниц и регистрировать результаты без необходимости явно запрашивать URL-адреса по одному и интерпретировать результаты вручную.

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

Это руководство предполагает некоторое знакомство со сценариями. Здесь мы используем Python для взаимодействия с API и анализа результатов.

Цели

В этом посте вы узнаете, как:

Создать запрос API Google Page Speed Insights
Сделать запросы API для таблицы URL-адресов
Извлечь основную информацию из ответа API
Запустите данный пример скрипта в Python

Приступая к настройке

Прежде чем запрашивать Page Speed Insights API с помощью Python, необходимо выполнить несколько шагов.

Настройка API: Для многих API Google требуются ключи API, пароли и другие меры аутентификации.
Однако для начала работы с Google Page Speeds API ничего из этого не требуется!
Установка Python 3 : Если вы никогда раньше не использовали Python, мы рекомендуем начать с дистрибутива Anaconda (версия Python 3.x), который устанавливает Python вместе с популярными библиотеками анализа данных, такими как Pandas.

Выполнение запросов

Основы запроса

API можно запрашивать в этой конечной точке с помощью запросов GET:

 GET https://www.googleapis.com/pagespeedonline/v5/runPagespeed

Затем мы добавляем дополнительные параметры, чтобы указать URL-адрес, для которого мы хотим найти скорость страницы, и тип используемого устройства, как показано ниже:

 https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url={url}&strategy={device_type}

При отправке запросов замените {url} URL-адресом страницы из ваш веб-сайт и {device_type} с мобильного или настольного компьютера, чтобы указать тип устройства.

Пакеты Python

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

urllib : Для выполнения HTTP-запросов.
json : для анализа и чтения объектов ответа.
pandas : для сохранения результатов в формате CSV.

Создание запроса

Чтобы сделать запрос API с помощью Python, мы можем использовать метод urllib.request.urlopen :

   import urllib.request
импортировать urllib.parse
URL = 'http://www.example.com'
escaped_url = urllib.parse.quote(url)
device_type = 'мобильный'
# Создать URL-адрес запроса
содержимое = urllib.request.urlopen(
    'https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url={}&strategy={}'
    .format(escaped_url, тип_устройства)
).read().decode('UTF-8')

Этот запрос должен возвращать (на удивление большой) ответ JSON. Вскоре мы обсудим это более подробно.

Выполнение нескольких запросов

Основным преимуществом этого API является то, что он позволяет нам получать данные о скорости страницы для пакетов URL-адресов. Давайте посмотрим, как это можно сделать с помощью Python.

Один из вариантов — сохранить параметры запроса ( url и device_type ) в CSV, который мы можем загрузить в Pandas DataFrame для повторения. Обратите внимание, что каждый запрос или уникальный url + device_type Пара имеет свою строку.

Хранить данные в формате CSV

 URL, device_type
0, https://www.example.com, рабочий стол
1, https://www.example.com, мобильный
2, https://www.example.com/blog, рабочий стол
3, https://www.example.com/blog, мобильный

Загрузите CSV

 импорт панд как pd
df = pd.read_csv(url_file)

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

Это показано ниже:

 время импорта
# Здесь будут храниться ответы
ответ_объект = {}
# Итерация по df
для i в диапазоне (0, len (df)):
    # Обработка ошибок
    пытаться:
        print('Запрашиваю строку #:', i)
        # Определяем параметры запроса
        url = df.iloc[i]['URL']
        device_type = df.iloc[i]['device_type']
        # Запрос решений
        содержимое = urllib.request.urlopen(
            'https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url={}&strategy={}'
            .format(url, тип_устройства)
        ).read().decode('UTF-8')
        # Конвертирует в формат json
        content_json = json.loads (содержимое)
        # Вставляем возвращенный json-ответ в response_object
        response_object[device_type][url] = content_json
        print('Сон 20 секунд между ответами.')
        время сна(20)
 кроме Исключения как e:
print('Ошибка:', e)
        print('Возвращает пустой ответ для url:', url)
response_object[device_type][url] = {}

Чтение ответа

Прежде чем применять какие-либо фильтры или форматирование к данным, мы можем сначала сохранить полные ответы для будущего использования следующим образом:

 import json
из даты и времени импортировать дату и время
f_name = 'data/{}-response. json'.format(datetime.now().strftime("%Y-%m-%d_%H:%M:%S"))
с open(f_name, 'w') в качестве выходного файла:
    json.dump(response_object, outfile, indent=4)

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

Для этого мы будем использовать библиотеку Pandas, которая позволяет легко извлекать нужные данные в формате таблицы и экспортировать в CSV.

Это общая структура ответа. Данные о времени загрузки были сведены к минимуму из-за его размера.

Общая структура ответа

Помимо другой информации, в ответ включены два основных источника данных о скорости страницы: лабораторные данные, хранящиеся в ‘lighthouseResult’, и полевые данные, хранящиеся в ‘loadingExperience’. В этом посте мы сосредоточимся только на данных Field, которые собираются на основе реальных пользователей браузера Chrome.

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

Первая отрисовка контента (мс)
- Это время между первым переходом пользователя на страницу и моментом, когда браузер впервые отображает фрагмент содержимого, сообщая пользователю о загрузке страницы.
- Этот показатель измеряется в миллисекундах.
First Contentful Paint (пропорции медленного, среднего, быстрого)
- Показывает процент страниц с медленным, средним и быстрым временем загрузки First Contentful Paint.
Время загрузки First Contentful Paint в миллисекундах, помеченное как «процентиль» и доля медленного, среднего и быстрого.

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

Если мы назовем наш фрейм данных Pandas df_field_responses, вот как мы извлечем эти свойства:

 import pandas as pd
# Указываем тип устройства (мобильное или настольное)
device_type = 'мобильный'
# Создаем фрейм данных для хранения ответов
df_field_responses = pd. DataFrame(
    столбцы = ['requested_url',
             'конечный_адрес',
             'FCM_мс',
             'FCP_категория',
             'FCP_fast',
             'FCP_среднее',
             'FCP_slow'
    ]
)
для (url, i) в zip(
    объект_ответа[тип_устройства].keys(),
    диапазон (0, длина (df_field_responses))
):
    пытаться:
        print('Попытка вставить ответ для url:', url)
        # Мы повторно используем это ниже при выборе данных из ответа
        fcp_loading = объект_ответа[тип_устройства][url]
            ['loadingExperience']['metrics']['FIRST_CONTENTFUL_PAINT_MS']
        # URL
        df_field_responses.loc[i, 'requested_url'] =
            response_object[device_type][url]['lighthouseResult']['requestedUrl']
        df_field_responses.loc[i, 'final_url'] =
            response_object[device_type][url]['lighthouseResult']['finalUrl']
        # Опыт загрузки: первая отрисовка содержимого (мс)
        df_field_responses.loc[i, 'FCP_ms'] = fcp_loading['процентиль']
        df_field_responses. loc[i, 'FCP_category'] = fcp_loading['category']
        # Пропорции: первая содержательная краска
        df_field_responses.loc[i, 'FCP_fast'] =
            fcp_loading['распределения'][0]['пропорция']
        df_field_responses.loc[i, 'FCP_avg'] =
            fcp_loading['распределения'][1]['пропорция']
        df_field_responses.loc[i, 'FCP_slow'] =
            fcp_loading['распределения'][2]['пропорция']
        print('Вставлено для строки {}: {}'.format(i, df_field_responses.loc[i]))
кроме Исключения как e:
        печать('Ошибка:', д)
        print('Заполнение строки с ошибкой для строки: {}; url: {}'.format(i, url))
        # Заполните «Ошибка» для строки, если поле не может быть найдено
df_field_responses.loc[i] = ['Ошибка' для i в диапазоне (0, len(df_field_responses.columns))]

Затем сохранить кадр данных df_field_responses в CSV:

 df_field_responses.to_csv('page_speeds_filtered_responses.csv', index=False)

Запуск скриптов на GitHub

Репозиторий содержит инструкции по запуску на GitHub файлы, но вот краткий обзор.

Перед запуском примеров сценариев на GitHub вам необходимо клонировать репозиторий, используя
- клон git https://github.com/Ayima/page-speed-blog-post.git
Затем создайте CSV-файл с URL-адресами для запроса.
Заполните файл конфигурации именем файла URL.
Команда запуска скриптов:

 python main.py --config-file config.json

Следует помнить:

API имеет ограничение на количество запросов, которые вы можете делать в день и в секунду.

Есть несколько способов подготовиться к этому, включая:

Обработка ошибок: Повторные запросы, возвращающие ошибку
Регулирование: в сценарии для ограничения количества запросов, отправляемых в секунду, и повторного запроса в случае сбоя URL-адреса.
При необходимости получите ключ API (обычно, если вы выполняете более одного запроса в секунду).

Анализируем Хабрахабр с помощью Google Page Speed / Хабр

Запускаем анализ

Minify HTML

Enable compression

Minify JavaScript

Prioritize visible content

Leverage browser caching

Optimize images

Eliminate render-blocking JavaScript and CSS in above-the-fold content

Итог

Модули Pagespeed для Nginx и Apache

Другие возможности Pagespeed

Проверка скорости сайта через API Google PageSpeed Insights

Пакетная проверка скорости загрузки страниц сайта через Google API

Получение Google API Key для программы BulkPageSpeed

Google PageSpeed Insights REST API v5

00000 Начало работы с Google Page Speed API

Чем хорош Page Speed Insights API?

Цели

Приступая к настройке

Выполнение запросов

Основы запроса

Пакеты Python

Создание запроса

Выполнение нескольких запросов

Хранить данные в формате CSV

Загрузите CSV

Чтение ответа

Запуск скриптов на GitHub

Следует помнить:

Добавить комментарий Отменить ответ

Рубрики

Page speed api google: Get Started with the PageSpeed Insights API

Анализируем Хабрахабр с помощью Google Page Speed / Хабр

Запускаем анализ

Minify HTML

Enable compression

Minify JavaScript

Prioritize visible content

Leverage browser caching

Optimize images

Eliminate render-blocking JavaScript and CSS in above-the-fold content

Итог

Модули Pagespeed для Nginx и Apache

Другие возможности Pagespeed

Проверка скорости сайта через API Google PageSpeed Insights

Пакетная проверка скорости загрузки страниц сайта через Google API

Получение Google API Key для программы BulkPageSpeed

Google PageSpeed ​​Insights REST API v5

00000 Начало работы с Google Page Speed ​​API

Чем хорош Page Speed ​​Insights API?

Цели

Приступая к настройке

Выполнение запросов

Основы запроса

Пакеты Python

Создание запроса

Выполнение нескольких запросов

Хранить данные в формате CSV

Загрузите CSV

Чтение ответа

Запуск скриптов на GitHub

Следует помнить:

Добавить комментарий Отменить ответ

Рубрики

Google PageSpeed Insights REST API v5

00000 Начало работы с Google Page Speed API

Чем хорош Page Speed Insights API?