Веб-производительность

Производительность — ключевой аспект пользовательского опыта. То, как быстро загружаются страницы и как быстро они реагируют на действия пользователя, может оказать существенное влияние на то, как пользователи воспринимают ваш сайт, и может повлиять на то, останутся ли пользователи на вашем сайте или покинут его. На этой странице вы найдете массу информации по различным вопросам производительности в Интернете, которая поможет вам сделать ваш веб-сайт быстрым и поддерживать его быстродействие.
Новичок в производительности? Мы подготовили для вас комплексный курс, который поможет вам начать работу.
Начните повышать производительность, измеряя ее на своем веб-сайте с помощью PageSpeed ​​Insights.
Узнайте больше о трех показателях Core Web Vitals, о том, как они работают и почему они важны для хорошего пользовательского опыта.
После того как вы ознакомитесь с метриками Core Web Vitals, эти руководства помогут вам понять, как лучше всего их оптимизировать.
Углубитесь в основные веб-показатели с помощью коллекции руководств, в которых метрики рассматриваются более подробно.
Откройте для себя новые функции для повышения производительности, которые теперь доступны в версии Baseline Newly.
Прочтите о том, как компании улучшили свои основные веб-показатели и в результате увидели рост своих бизнес-показателей.
Узнайте, как использовать Chrome DevTools для устранения проблем с производительностью вашего веб-сайта.
КУРС

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

Изучите производительность!
Вы не сможете улучшить производительность своего сайта, не измерив ее предварительно. PageSpeed ​​Insights — это инструмент, который измеряет производительность вашего веб-сайта с использованием важных показателей, ориентированных на пользователя, и может помочь вам определить области, в которых вы можете улучшить производительность вашего веб-сайта.
Начать

Метри��и Core Web Vitals представляют собой набор из трех метрик, ориентированных на взаимодействие с пользователем. Они измеряют производительность и удобство использования страниц, включая воспринимаемое время загрузки, визуальную стабильность и скорость реагирования на действия пользователя. Если вы новичок в Core Web Vitals, эти руководства познакомят вас с тем, как они работают, и дадут отправную точку для их оптимизации.
LCP — это показатель, измеряющий время, необходимое для появления на странице наибольшего фрагмента контента. Страницы с низким LCP сигнализируют пользователям о том, что ваша страница загружается быстро.
Подробнее
CLS — это метрика, которая измеряет стабильность макета, наблюдая за страницей на предмет неожиданных изменений макета. Страницы с низким CLS сигнализируют пользователям о том, что макет страницы стабилен и не изменится неожиданно при попытке взаимодействия с ней.
Подробнее
INP — это показатель, который измеряет, насколько страница реагирует на ввод пользователя. Страницы с низким INP сигнализируют пользователям о том, что страница быстро реагирует на взаимодействие с ними, что делает ваш веб-сайт более надежным и приятным в использовании.
Подробнее

Оптимизация основных веб-показателей

Каждый из показателей Core Web Vitals можно оптимизировать для улучшения пользовательского опыта. В каждом из этих руководств подробно показано, как можно применить проверенные методы для повышения производительности и надежности вашего веб-сайта, чтобы пользователи оставались более вовлеченными и с меньшей вероятностью уходили.
Узнайте, как оптимизировать LCP для ваших пользователей, чтобы они могли видеть наиболее важный контент на вашей странице как можно быстрее.
Подробнее
Узнайте, как оптимизировать CLS для ваших пользователей, чтобы они могли рассчитывать на то, что ваш веб-сайт останется стабильным и более удобным в использовании.
Подробнее
Узнайте, как оптимизировать INP для ваших пользователей, чтобы они могли ожидать, что ваш веб-сайт будет быстро реагировать на взаимодействия.
Подробнее

��огрузитесь глубже в основные веб-показатели

Три показателя Core Web Vitals и способы их оптимизации — отличное начало, но вокруг них есть еще больше тем, которые стоит усвоить. Эта коллекция контента поможет вам понять, как их измерять, отлаживать, а также некоторые дополнительные рекомендации по уведомлениям о файлах cookie, каруселям и другим распространенным проблемам пользовательского интерфейса.
Подробнее
Повышение производительности не только улучшает пользовательский опыт, но и может помочь вашему бизнесу расти. Узнайте, как эти компании улучшили свои основные веб-показатели и заметили рост своих бизнес-показателей.
Узнайте, как Disney+ Hotstar увеличила количество просмотров карточек в нед��лю на 100 % на устройствах в гостиной, снизив INP на 61 %.
Подробнее
Узнайте, как платформа управления согласием PubTech снизила INP на веб-сайтах своих клиентов до 64 %, а также улучшила видимость рекламы до 1,5 %.
Подробнее
Узнайте, как компания Taboola использовала API длинных анимационных кадров (LoAF) для повышения INP до 36 % на веб-сайтах своих партнеров-издателей.
Подробнее

Базовый уровень сигнализирует веб-разработчикам, когда функции веб-платформы можно безопасно использовать во всех основных браузерных движках. Вот некоторые функции, связанные с производительностью в Интернете, которые теперь доступны в базовой версии.
Свойство CSS content-visibility стало Baseline Newly, доступным в сентябре 2024 года.
Формат изображения AVIF стал Baseline Newly, доступным в январе 2024 года.
Предварительная загрузка модуля стала базовой версией, доступной в сентябре 2023 года.
Заголовок ответа HTTP Server-Timing стал базовым, доступным в марте 2023 года.

Chrome DevTools — это набор инструментов для разработчиков для отладки веб-приложений, в том числе инструменты, которые помогут вам понять и улучшить производительность ваших веб-приложений.
Панель «Сеть» в DevTools показывает все ресурсы, загружаемые страниц��й, и время, потраченное на их загрузку. Узнайте, как использовать эту панель для выявления проблем с производительностью, связанных с загрузкой ресурсов.
Подробнее
Панель «Производительность» в DevTools показывает невероятно подробную информацию о производительности страницы во время сеанса записи, включая активность в основном потоке, сетевую активность и дополнительные инструменты, которые могут помочь вам выявить и устранить проблемы с производительностью.
Подробнее
Панель «Память» показывает, сколько памяти используется JavaScript страницы. Научившись использовать эту панель, вы сможете обнаруживать и устранять проблемы, связанные с памятью, вызванные JavaScript страницы.
Подробнее