Я взял домашнюю страницу csswizardry.com и протестировал ее...

142

Я взял домашнюю страницу csswizardry.com и протестировал ее через 3G-соединение, пишет Гарри Робертс

Затем я улучшил пропускную способность или задержку на 10% до 2× изменения, затем я сделал 4× и 8× изменения.

📈 На каждые 10% улучшения пропускной способности мы видим в среднем 0,21% увеличения FCP (First Contentful Paint - первая отрисовка контента).

📉 Улучшение пропускной способности на 8× дает улучшение FCP только на 1,64%.

📉 На каждые 10% улучшения задержки мы видим в среднем 2,1% улучшения FCP.

📉 Улучшение задержки в 8× дает улучшение FCP на 94%.

Ключевые выводы:

1. Улучшение любого из этих показателей не гарантированно будет линейным (т.е. 10% улучшение задержки != 10% улучшение FCP; удвоение пропускной способности не приводит к уменьшению таймингов вдвое).

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

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

— Я измерял только FCP, поскольку он достаточно привязан к сети и является хорошей метрикой UX.

— Я провел 125 тестов, чтобы получить эти данные, но это все еще только одна страница на одном сайте.

— Мой сайт и так работает быстро, так что он не особенно показателен для всего Интернета в целом.

— Я ожидал бы получить другие результаты, измеряя что-то вроде нагрузки или LPH (Last Painted Hero) на страницах с большим количеством изображений.

— Я бы ожидал других результатов, если бы значительный вес приходился на критический путь (например, Base64).

Почему увеличение пропускной способности не помогает?

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

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

Конечно, он может доставить больше пончиков, но не один пончик быстрее.

Все новые TCP-соединения проходят через период медленного старта, когда они начинают работать только с емкостью ~14 КБ.

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

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

При оптимизации таймингов отрисовки первого рода (SR, FP, FCP) оптимизируйте задержку, а не пропускную способность.

Как бы ни улучшалась пропускная способность, она здесь бесполезна.

@MikeBlazerX