Измерение, оптимизация сайта и мониторинг

Измерение, оптимизация сайта и мониторинг

От автора: производительность — это постоянный процесс, а не единовременный контрольный список. Он требует постоянного мониторинга и работы. Эффективный рабочий процесс при повышении производительности — это Измерение, Оптимизация сайта и Мониторинг.

Несколько советов:

Соотносите производительность со своими бизнес-целями. Помогите заинтересованным сторонам оценить, как производительность влияет на основные показатели бизнеса, которые для них важны. (Например, конверсии, показатели отказов, восприятие бренда.)

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

При оптимизации загружайте только то, что вам нужно, когда вам это нужно. Активно управляйте полезной нагрузкой и сокращайте время запуска.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее

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

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

По результатам измерений (например, A / B тестирования) оптимизация дала предполагаемый эффект. «Исправление» может быть неверным, если оно улучшает один показатель за счет другого.

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

На Chrome Dev Summit 2018 мы недавно представили ряд инструментов, помогающих веб-разработчикам на их пути к улучшению пользовательского опыта.

В новом Insights PageSpeed, основанном на Lighthouse и Chrome User Experience Report, обеспечивается удобный способ измерения лабораторных и полевых показателей для популярных URL-адресов.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее

web.dev — бесплатная новая платформа на базе Lighthouse для обучения разработчиков. Она позволяет контролировать ваш прогресс, оптимизируя сайт в течении временного интервала.

web.dev включает в себя руководства на основе codelab для оптимизации JavaScript , изображений или установки бюджета производительности.

lighthouse-ci теперь поддерживает настройку бюджета для оценки производительности Lighthouse (например, 80/100). Команды могут отслеживать причины регрессий. web.dev содержит удобное руководство.

Разумеется, есть множество других полезных инструментов, которые помогут вам реализовать модель измерение, оптимизация и мониторинг, в том числе SpeedCurve и Caliber.

Если опыт сопровождается медленной загрузкой, броской анимацией, замираниями или высоким потреблением памяти это ухудшает производительность. Чтобы избежать этих проблем, используйте инструменты, доступные вам для измерения, оптимизации и мониторинга производительности. Это хороший способ ускорить все.

Автор: Addy Osmani

Источник: https://medium.com/

Редакция: Команда webformyself.

Современные тенденции и подходы в веб-разработке

Узнайте алгоритм быстрого профессионального роста с нуля в сайтостроении

Узнать подробнее

Практика монетизации блога: от раскрутки до реальных денег

Пошаговая система по созданию, раскрутки и монетизации блога.

Научиться

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree