Cross menu icon

Производительность при загрузке файлов является жизненно важным параметром, который в современных условиях, пожалуй, становится одним из основных моментов, связанных с качеством конечного программного продукта или разрабатываемого сайта. Есть большое количество кейсов, рассказывающих о том, как даже минимальные доработки с учётом требований по производительности и быстрой загрузке десктопной или мобильной версии сайта и приложения приводили к повышению показателей бизнеса различных компаний. Ведущие российские и международные компании выделяют значительные ресурсы на важность показателей производительности сайтов и приложений при загрузке, проводят исследования этого вопроса, а также регулярно разрабатывают инновационные подходы в этом направлении разработки. Контекстный поиск Google в самое ближайшее время начнёт оценку этих показателей при ранжировании результатов поисковой выдачи в своём браузере.

Основные метрики, которые важно учитывать при сборе оценки производительности с использованием программного продукта Google Pagespeed

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

First Contentful Paint (FCP) — это характеристика, которая в своей работе полностью завязана на пользовательский опыт использования приложения. Она замеряет скорость загрузки страницы в браузере пользователя. Этот показатель служит для измерения скорости загрузки сайта именно со стороны пользователя, а не используемых для профессиональной аналитики инструментов веб-мастера.

Этот показатель отличается от First Paint, которая, в свою очередь на вымышленной прямой, отображающей загрузку страницы, будет являться точкой старта загрузки первого визуального объекта. First Contentful Paint также на этой прямой будет выглядеть в виде условной точки, которая показывает первый загружаемый информационный блок — текст, блок с логотипом, объекты типа canvas. Если говорить совсем простым языком, то метрика FCP представляет собой количество времени, нужное пользователю, чтобы увидеть при загрузке сайта на экране своего устройства первые символы или визуальный блок информации.

Time to Interactive (TtI). Это показатель, который определяет время загрузки основного контента интернет-страницы с момента старта взаимодействия со страницей до момента, когда пользователь сможет начать производить на сайте собственные действия. Формально он разделяется на 2 основных момента:

— Time To First Interactive — это показатель, определяющий момент первых действий пользователя на странице даже при условии, что основные блоки контента ещё не загружены;

— Time To Consistently Interactive — это точка, определяющая момент, когда несмотря на загрузку контента, страница уже формально готова к нормальной работе.

Разница между указанными выше метриками состоит в том, что Consistently Interactive обязательно учитывает все моменты, связанные с замедлением загрузки до конца процесса. First Interactive не снижает рейтинг скорости загрузки сайта за задержки. Хотя, именно такие задержки при загрузке чаще всего являются причиной негативного пользовательского опыта.

Speed Index (SI) — метрика, которая отвечает за отображение отдельных блоков информации на сайте непосредственно во время его загрузки. В основе работы параметра лежит характеристика, называемая Visually Complete. Если говорить простым языком, то это характеристика, отвечающая за поэтапную загрузку информационных блоков на странице — к примеру, при загрузке любого поисковика вы сначала увидите строку поиска, затем блок кнопки поиска и названия сайта, затем всё остальное. Чем удачнее продумано расположение отдельно загружаемых при плановой работе сайта элементов, тем эта метрика выше и тем она больше условных баллов даст в оценку скорости загрузки по метрикам Google Pagespeed.

Total Blocking Time (TBT) — замеряет общее время, когда страница во время загрузки недоступна для любых действий пользователя. Алгоритм работы этого параметра по сути является отрезком времени между стартом First Contentful Paint и началом работы Time to Interactive. В процессе действия TBT действует алгоритм недоступности пользовательских действий. Нормальное использование страницы, которая будет адекватно работать в любом современном браузере, должно начинаться примерно после 50 мс, поскольку именно по прошествии этого времени начнётся подтормаживание страницы. Поэтому алгоритм недоступности действий пользователя начинает автоматически действовать после этого времени.

В Google Pagespeed есть следующие параметры оценки этого важного показателя:

— зелёная зона — до 300 мс;

— оранжевая зона — от 301 до 600 мс;

— красная зона — от 601 мс и выше.

Largest Contentful Paint (LCP) — это время, в течение которого браузер, в котором загружается основная страница сайта, отобразит на экране устройства пользователя самый крупный из подгружаемых графических элементов. В качестве такого элемента может выступать картинка или фотография, видеоблок, текстовая информация, скриншот. Учитываются при рендеринге только видимые части изображения в пределах отображения экрана без прокруток.

Как это работает? Всё просто: как только браузер начинает подгрузку объекта, занимающего доминантное положение на экране, с его стороны производится запрос Performance Entry c заданным типом largest-contentful-paint. Как только со стороны пользователя начинаются любые действия на сайте, отсчёт метрики прекращается. В Google Pagespeed есть следующие параметры оценки этого показателя:

— зелёная зона — до 2,5 сек;

— оранжевая зона — от 2,51 до 4 сек;

— красная зона — любое время выше 4,01 сек.

Cumulative Layout Shift (CLS) — перевести это можно, как совокупный сдвиг общего макета. Достаточно новый для оценки показатель, который позволяет получить оценку удовлетворённости пользователя и его первое впечатление от использования сайта. К примеру, вспомните, как может раздражать момент, когда вы читаете важный для вас текст на смартфоне и он внезапно начинает пропадать или выглядеть невыровненным. Этот показатель рассчитывается в процентах от общей площади экрана. Замеры этого параметра обязательны, чтобы понимать, насколько сайт юзабелен и адекватен для широкого слоя пользователей.

Все указанные выше параметры важны для нормального отображения вашего сайта для любого пользователя в различных мобильных и десктопных браузерах, чтобы сайт быстро и полностью загружался, все его блоки были видны на экране и не «плавали» при просмотре в устаревших браузерах или на экранах нестандартного разрешения. Наша команда поможет с тем, чтобы все параметры после обновления структуры и кода страницы находились в оранжевой или зелёной зоне оценки Google Pagespeed (зависит от выбранного вами тарифа). Выбирайте профессионалов, которые помогут сделать ваш сайт быстрее, эргономичнее и проще для любого пользователя.