Измените языковые настройки Топвизор для работы с сервисом на родном языке. Вы также сможете выбрать и установить язык интерфейса позже в настройках Аккаунта. Измените языковые настройки Топвизор для работы с сервисом на родном языке. ru Русский Выбрать

В Chrome DevTools появилась панель Recorder

В Chrome DevTools появилась панель Recorder

В инструментах разработчика DevTools появилась новая панель – «Recorder». С её помощью можно записать, воспроизвести и измерить, как быстро реагирует сайт на действия пользователя. Например, в процессе оформления заказа.

Панель Recorder поможет измерить метрику «Отзывчивость». Это тестовая метрика Core Web Vitals, которую Google анонсировал недавно.

Метрика «Отзывчивость» отражает общую отзывчивость страницы, то есть скорость реакции на все события, а не только на первое взаимодействие. 

Панель доступна для версии Chrome Canary. Пока в рамках теста.

Как открыть Recorder panel

  • Откройте DevTools. Для этого нажмите комбинацию клавиш: для Mac OS – Command+Option+I, для Windows – Control+Shift+I.
  • Кликните на More Options > More tools > Recorder.
    Как открыть панель Recorder
    Как открыть панель Recorder

Зачем использовать

  • записать весь пользовательский путь, а не только первое взаимодействие. Можно записать как пользователь добавил товар в корзину, перешёл в корзину, начал оформлять заказ, заполнил платёжные реквизиты и т.д.;
  • воспроизвести пользовательский путь. При воспроизведении также можно имитировать медленное интернет-соединение. Для этого в настройках в раскрывающемся списке выберите «медленный 3G»;
  • измерить производительность. Если кликнуть на кнопку «Measure Performance», то сначала вы увидите воспроизведение пути пользователя, а потом разбивку на секунды на панели «Performance». На этой панели можно установить флажок Web Vitals и определять, как улучшить скорость ответа страницы:
Как выглядит разбивка на секунды на панели производительности
Как выглядит разбивка на секунды на панели производительности

Google предлагает протестировать панель с помощью демонстрационной страницы заказа кофе

Вот, как это выглядит:

    Подробнее о том, как пользоваться новой панелью – в статье Chrome Developers.

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

    Подписаться 

    36 0
    Оставьте свой комментарий
    Чтобы оставить комментарий, авторизуйтесь

    Советуем почитать

    Асессор

    Асессор

    Асессор — это человек, который вручную оценивает сайты по специальному чек-листу после того, как поисковые роботы провели свою оценку.
    Как закрыть сайт от индексации в robots.txt

    Как закрыть сайт от индексации в robots.txt

    Как закрыть сайт от индексации для Яндекса, Google и других поисковых систем в robots.txt: пошаговая инструкция с примерами. Как создать файл самостоятельно. Какие данные нужно скрывать. Как проверить, корректно ли работает запрет. Как избежать ошибок.
    Семантика сайта

    Семантика сайта

    Семантика в SEO — это список слов и фраз, по которым пользователи в интернете ищут услугу, товар или информацию. Сами слова и фразы принято называть поисковыми запросами, ключами или ключевыми фразами.