вебинар: 5 лучших дизайн-концепций Разбор арт-дира

Разрыв в мобильной производительности, 2021 год

Многое изменилось с 2017 года, когда мы в последний раз оценивали глобальный базовый бюджет ресурсов, приходящихся на страницу, в 130-170 КБ.

Благодаря прогрессу в развитии сетей и браузеров (но не устройств), для сайтов, спроектированных “современным” образом появился более щедрый глобальный бюджетный предел. Теперь мы можем позволить себе примерно 100 КБ HTML / CSS / шрифтов и около 300-350 КБ JS (в сжатом виде, в формате gzip). Это общее правило относительно ограничений должно сохранятся как минимум год или два. Как всегда, дьявол в деталях, но главная идея осталась неизменной: когда мы строим цифровой мир, ориентируясь лишь на лучшие устройства, мы делаем его менее доступным для более, чем 80% пользователей.

Обновленная информация о телефонах, сетях, браузерах и новом базовом уровне веб-производительности.

Еще в 2016 году я пытался предать огласке причины и последствия ужасной производительности для большинства пользователей сайтов, созданных с помощью популярных фронтенд-инструментов (инструменты для создания внешней оболочки интерфейса). Негативные последствия были особенно заметны в самом быстро растущем сегменте устройств — телефоны на платформе Android от бюджетного до среднего уровня.

Плохой личный опыт может определить ожидания от экосистемы в целом. О низкой производительности сайта вашей компании свидетельствуют следующие показатели:

  • низкая вовлеченность пользователей;
  • повышение показателя отказов;
  • снижение конверсий. 

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

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

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

Если пользователь перейдет по ссылке с вашего сайта на сайт, загрузка которого происходит очень медленно — ваша страница будет отображаться столько времени, сколько потребуется серверу для загрузки минимального HTML-содержимого. Так же и в обратном случае, вне зависимости от того, насколько быстро отвечает ваш сайт, если при переходе пользователя со стороннего сайт на ваш, onunload-обработчикам предыдущего сайта требуется слишком много времени для выполнения загрузки страницы (низкая производительность исходной страницы — распространенная проблема), он будет загружаться медленно.

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

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

Низкая производительность сайтов, которые ссылаются на ваш сайт или наоборот, на которые ссылаетесь вы, отрицательно влияет на взаимодействие пользователей с вашим сайтом, даже если он всегда работает быстро. Данную ситуацию очень хорошо описывает следующая цитата: “Выживи из-за ссылки или умри из-за нее”.

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

Разница в производительности также создает дополнительное беспокойство. Высокая изменчивость реакции может создавать эффекты, которые с точки зрения восприятия доминируют над средними значениями или даже медианами. Если 9 нажатий из 10 получают ответ за 100 мс, но каждое 10-е занимает целую секунду, что произойдет с уверенностью и вовлеченностью пользователей? Эти эффекты, связанные с человеческим фактором, и их многообразные последствия означают, что успех вашего сайта частично зависит от общего качества веба.

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

Основная мысль:

Глобальная базовая линия по умолчанию — это устройство Android стоимостью примерно 200 долларов с линией связи 400 Кбит/с и временем приема-передачи (RTT) 400 мс. Это соответствует бюджету ~ 130-170 КБ ресурсов критического пути, в зависимости от их состава: чем больше JS вы включаете, тем меньше должен быть их объем.

В то время устройство за 200 долларов имело 4-8 ядер (медленные, исправные, с низким кэшем), ~ 2 ГБ оперативной памяти и флеш-память MLC NAND. Например, телефон Moto G4.

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

Примечание. Слепота технологического мира к самым востребованным среди людей устройствам — вечная проблема. Количество внимания, прикованного в технической прессе к телефонам высокого уровня, которые отправляются блогерам на обзор (не говоря уже о маркетинговом сумасшествии от Apple) не соответствует реальным объемам поставок этих устройств.

Производители смартфонов (которые часто выступают в роли рекламодателей) требуют внимания к сегменту устройств высокого класса, потому что именно там находится прибыль, а техническая пресса им не перечит. Объем материалов, посвященных устройствам высокого класса, остается непропорциональным объему продаж устройств согласно их ценам. В более сбалансированном мире большинство статей было бы посвящено сообщениям об устройствах среднего класса от LG и Samsung.

Если проанализировать распространение технологий в мире, можно увидеть, что, хотя Apple наконец преодолела 50%-ную долю в США впервые за десятилетие в конце 2020 года, поставки смартфонов iOS стабильно превышают ~ 20% по всему миру, а в большинстве кварталов составляют около 15%.

Можно бесконечно говорить об этих предубеждениях и том, как они проявляются. Но всегда раздражает, что Qualcomm, Samsung Semiconductor, MediaTek и другим поставщикам устройств на Android SoC прощается (даже в случае с устройствами высокого класса) их ужасная цена / производительность.

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

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

С тех пор обсуждение метрик сильно продвинулось вперед, достигнув высшей точки в момент запуска Core Web Vitals (факторы оценки качества ресурсов), которые согласно отчету Chrome о пользовательском опыте были введены, чтобы отразить реальный опыт пользователей. 

Устройства и сети тоже эволюционировали:

Текст: Обновление информации о мобильных процессорах и разрыве в производительности: устройства Android среднего уровня (~ 300 долларов) теперь обладают одноядерной производительностью iPhone 2014 года и многоядерной производительностью iPhone 2015 года.Самые дешевые (большое количество) Android работают как iPhone 2012/2013 годов соответственно.

Между тем, поведение разработчиков не оставляет надежды:

Медианная полезная нагрузка JavaScript на мобильных устройствах только выросла с 2016 года и сейчас составляет более 400 КБ переданного скрипта или почти 2,5 МБ несжатого JS.

Единственным положительным моментом в сложившейся ситуации является то, что рост полезной нагрузки мобильного JavaScript был приостановлен в 2020 году. Однако ответ на вопрос “как скоро смартфоны низкого и среднего класса смогут справляться с таким высоким объемом полезной нагрузки?” — так и не найден.

Если среднего уровня сайты по-прежнему продолжат отправлять в 3 раза больше рекомендованного объема скрипта, совершенно непонятно, сможет ли Интернет когда-то стать удобным в использовании на большинстве устройств в мире. А если и сможет, то нет никакой ясности по поводу того, когда это случится.

Пожалуй, отсюда и начнем наше приключение в 2021 год.

1. Полная перезагрузка

Чтобы пересчитать глобальный базовый уровень 2017 года, мы хотим обновить базовые значения по нескольким параметрам:

  • Как изменились устройства;
  • Современная производительность и доступность сети;
  • Достижения в обработке контента браузерами.
Контент мертв, да здравствует контент

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

Это постепенное изменение, наряду с улучшениями потоковой компиляции, помогло гарантировать, что пользователи с меньшей вероятностью заметят необоснованно большую полезную нагрузку JS, которую “современные” инструменты компиляции кода чаще генерируют, чем нет. Более эффективное использование большего количества ядер (перемещение компиляции вне потока) дало сайтам, предоставляющим HTML и CSS-контент, шанс остаться отзывчивыми, даже когда они обременены огромным объемом JS.

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

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

  • остаточные задачи компиляции и распределения ресурсов;
  • управляемые скриптом задачи DOM/Layout в основном потоке.

Примечание. В худшем случае компиляция вне потока не оказывает положительного влияния на одностраничные приложения (SPA) с рендерингом на стороне клиента. Если опыт взаимодействия заблокирован скриптом, который делает невозможным начало запроса данных или генерацию разметки для них, дополнительные ядра не помогут. Некоторые страницы можно починить, добавив директивы <link rel=preload>.

Чаще всего ориентированные на приложения архитектуры, распространяемые популярными стартовыми наборами фреймворков, оставляют командам огромный объем JS, который надо сократить. Это дорогая и изнурительная работа c Webpack, на которую подписались бы не все “опытные разработчики”.

Сообщество React, в частности, плохо обслуживается по причине недостатка руководства, инструментов и поддержки со стороны Facebook. Учитывая масштабы развернувшейся там катастрофы, шокирует тот факт, что в 2021 году (и после недавней повторной разработки сайта документации) в документации по производительности React до сих пор нет никаких указаний относительно допустимого объема ресурсов или бюджетов производительности.

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

Короче, FB знает лучше.

Ниже мы увидим, что скорость, с которой развиваются процессоры, недостаточно быстрая, чтобы иметь хоть малейший шанс справиться с многообразием предлагаемых фронтенд-инженерами ресурсов. Если и есть однозначно хорошие новости об инструментах, то это данные о том, что несколько популярных альтернатив теперь включают возможность предотвращения первоочередной отправки сторонних JS (Next.js, Gatsby), хотя JS-сообщество и остается в упорном отрицании затрат на выполнение скриптов на стороне клиента. 

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

4G — это чудо, 5G — это мираж

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

Базовый показатель этой модели (~ 1,6 с) был получен в результате настройки подключения DNS, TCP / IP и TLS по приемлемым в то время базовым параметрам сети 3G, что оставило только 3400 мс для работы и параллельной борьбы с алгоритмом Нейгла и слабыми процессорами. Добавление всего одного дополнительного подключения к CDN для ресурса критического пути могло привести к провалу всей затеи. Это разговор о сложной цели.

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

Основная причина этого — Reliance Jio (самая быстрорастущая мобильная сеть в мире).

В последние годы в Индии произошел огромный скачок роста числа смартфонов благодаря двум причинам:

Благодаря не сдающим свои позиции прогнозам о росте рынка смартфонов в два раза, не говоря уже об удвоении поставок за последние 5 лет, вырисовывается яркая картинка. 

Основной фактор такого резкого роста — выход Reliance Jio на рынок операторов связи. До прорывного ценообразования и агрессивной популяризации индийская компания Jio предоставляла одни из самых дорогих (относительно доходов населения) услуг передачи данных в мире. За пределами наиболее богатых городов они сильно зависели от 3G. Более того, услуги 3G зачастую работали так же, как и 2G на других рынках, по причине избыточного их предоставления и регулирования скорости передачи данных традиционными операторами связи.

В 2016 году Jio прокатился по субконтиненту, как сезон дождей, обрушив на людей вместо воды инфраструктуру 4G и поток бесплатной информации.

Конкурирующие операторы связи отреагировали мгновенно, агрессивно снизив цены, что привело к общему снижению цен на пакеты услуг почти на 95%.

Блицкриг Jio по развертыванию сети 4G шокировал существующих операторов связи, поскольку людям был предоставлен превосходный продукт по неслыханной цене. Такая ситуация вынудила весь рынок улучшить скорость передачи данных и покрытие. Примерно в 2018 году Индия стала рынком, ориентированным на 4G.

Если в разработке базовых показателей производительности на 2021 год есть хоть малейшая надежда на светлое будущее, то это именно она — наконец-то мы можем обновить наши гипотезы о сети, чтобы выдвинуть предположение о том, что 4G работает медленно почти везде (PDF).

Похоже, что 5G получит еще большее распространение в течение следующих пяти лет. Операторы связи выбирают разные полосы частот в различных географических регионах, при этом производительность 5G сильно зависит от плотности расположения вышек, что сильно добавит путаницы на долгие годы вперед. Стоит сказать, что 5G еще не функционирует в полную силу: даже если богатые пользователи в нескольких географических регионах начинают думать о нем как о “норме”, до его распространения по всему миру далеко.

Примечание. Как всегда, примите в расчет деньги и заявления венчурных капиталистов, но интерпретируйте их размышления о том, что “все знают” и “как обстоят дела” так же, как вы это сделали бы в отношении геополитического совета Генри Киссинджера — как токсичные, настораживающие и, прежде всего, неизменно корыстные.

Старые технические устройства как стартовая точка для определения производительности

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

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

На данный момент, средний срок замены устройства в мире составляет 33 месяца. На рынках, близких к насыщению смартфонами, это означает, что ожидаемый средний возраст устройства составляет почти 18 месяцев. Новые устройства продолжают работать быстрее при тех же затратах пользователей. Если мы предположим, что средние цены (ASPs) остаются в узком диапазоне из года в год в большинстве географических точек, наилучшим будет представлять “средний телефон” как устройство среднего класса, проданное 18 месяцев назад.

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

Мировой ASP страдает от тех же стандартных проблем, что и все средние показатели. Незначительное увеличение или уменьшение мирового ASP может скрыть:

Мы можем наблюдать это несоответствие в реальной жизни: пресса сообщает о сильном увеличении ASP и доли iOS даже в тех случаях, когда продажи устройств на платформе Android падают совершенное незначительно. Вместо того, чтобы вникнуть в данные о структуре распределения и показателях временных рядов, пресса регулярно преподносит такую ситуацию как внезапный успех какой-то новой функции Apple. Это правда возможно, но слегка стилизованная версия этих фактов легче проходит тест Оккама: состоятельные пользователи менее чувствительны в вопросе времени принятия решений об обновлении технологий.

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

Вуаля! Небольшое сокращение подавляющего объема покупок устройств на платформе Android свидетельствует об увеличении APS и доли устройств iOS, поскольку они почти всегда дороже. APS может быть прекрасным диагностическим показателем лишь в ограниченном числе случаев, поэтому необходимо всегда отталкиваться от понимания структуры ваших данных.

Однако средние цены начали расти, поэтому мои прогнозы 2017 года верны только технически:

В 2016 году устройство среднего уровня, пригодное для использования с сим-картой любого оператора, стоило около 200 долларов. В этом году среднее устройство стоит еще дешевле, учитывая тот факт, что производительность остается примерно такой же. Предполагается, что следующие несколько лет ситуация не изменится и производительность подобных устройств будет оставаться неизменной — на среднем уровне. Это одна из причин, по которой в прошлом году, в качестве устройства среднего уровня я советовал Moto G4 и по-прежнему рекомендую его или Moto G5 Plus в этом году.

Медианные устройства по-прежнему отличаются от средних значений, но мы можем закрыть на это глаза. Мировые средние цены 18 месяцев назад составляли ~ 300 долларов, поэтому средняя производительность может быть представлена устройством за 300 долларов, приобретенным в середине 2019 года. Хорошо подходит Moto G7.

Производительность указанных устройств отличается от показателей устройств, которыми пользуются сами состоятельные разработчики, как ночь и (ослепляющий) день. Какой бы шокирующей не была шестикратная разница в производительности однопоточного процессора, это ничто по сравнению с тем, где нам следует установить глобальный базовый уровень: устройство P75+. 

Используя нашу ментальную модель возраста и замены устройств, мы можем примерно оценить, каким может быть устройство с 75-м процентилем (или выше) с точки зрения его цены и возраста, изучив один из двух вариантов:

  • устройства с половиной средней цены и половиной прошедшего срока для замены;
  • устройства со средней ценой и находящиеся на ¾ этапа цикла замены. 

Сегодня любой из этих методов приводит к аналогичному ответу.

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

Примечание. Несмотря на то, что приведенная здесь модель определения среднего устройства не отличается высокой точностью, я сравнил полученные результаты с внутренним анализом Google и выяснилось, что модель оказалась все-таки верна. 

Разработчики нативных приложений и SDK (набор средств разработки) с глобальным охватом могут классифицировать устройства по категориям высокого / среднего / низкого уровня в зависимости от следующих параметров: 

  • оперативная память;
  • скорость процессора;
  • разрешение экрана. 

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

Нашу модель (средняя цена + возраст устройства) могут повредить многие факторы: 

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

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

В нашем относительно стабильном состоянии за последние 4 года было продано более 90% смартфонов. Замена устройств происходит из-за объективных на то причин: 

  • батареи разряжаются;
  • экраны трескаются;
  • память заполняется. 

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