Медиа Илья Пономарев
8 730

Сравнение скорости загрузки сайтов изданий

Спойлер: AMP быстрее, чем нормальные сайты.

В закладки

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

N+1

«Медуза»

ТАСС

Medialeaks

Бонус: издания «Комитета»

vc.ru

TJ

DTF

Материал опубликован пользователем. Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Илья Пономарев", "author_type": "self", "tags": [], "comments": 48, "likes": 16, "favorites": 32, "is_advertisement": false, "subsite_label": "media", "id": 60092, "is_wide": false, "is_ugc": true, "date": "Sat, 02 Mar 2019 23:40:02 +0300" }
{ "id": 60092, "author_id": 66580, "diff_limit": 1000, "urls": {"diff":"\/comments\/60092\/get","add":"\/comments\/60092\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/60092"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199130 }

48 комментариев 48 комм.

Популярные

По порядку

Написать комментарий...
15

Охренеть вывод.
Надо ещё сделать замер воды и газа и СПОЙЛЕР - вода мокрая!

Ответить
0

Не мокрый

Ответить
0

жидкий же

Ответить
0

и все ровно не мокрый

Ответить
11

Исследования, которые мы заслужили..

Ответить
8

Вообще не понимаю amp или турбо-страницы. Эти штуки надо было активно продвигать в начале 2000х, а не в 2019 когда уже первые телефоны с 5g появляться начали.

Ответить
6

Там дело не совсем в размере передаваемых данных. Точнее проблема не в передачи данных. Каждый дополнительный байт js и css увеличивает затраты процесса на парсинг, компиляцию в байткод и анализ дерева, а так же расход памяти. Это сейчас актуально как никогда. В 2000х в принципе никто не передавал по 5МБ js-кода и интерфейсы были простейшие. Так что надобность в AMP появилась именно сейчас. Да и по статистике преобладают бюджетные телефоны (а в 2000х сидели в основном с компа), а в бюджетных слабые процессоры и мало памяти.

Ответить
0

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

Ответить
7

Уверен.
1) Когда я открываю новость или товар с телефона, я хочу это сейчас. Я не хочу грузить 15 мегабайт js-кода, который потом будет перевариваться моим дешевым телефоном секунд 5-20.
Нужен пример? Браузерная версия gmail. У меня на i5 последнего поколения открывается по 2-5 секунд. Вот вам и супер-быстрое SPA. Вот только здесь ещё оправдано (1 раз подождали и работает дальше очень шустро), а вот на страницах, на которые заходят из поиска, это не допустимо. Представьте, сколько такая страница будет грузиться на слабеньком телефоне.
2) Перевод js в байткод (по крайней мере на первом хите, когда байткод ещё не лежит в кеше браузера) никто не отменял. Это всё такая же затратная операция для мобильных браузеров. Анализ DOM-дерева и CSSOM всё так же забирают приличное время на слабых телефонах.
3) Серверный рендеринг не спасёт. Если логики много, то я увижу новость или товар, но вот беда, страница ещё секунд 10 не будет интерактивной. Меня это выбесит и я уйду к другим. А если добавить нестабильный мобильный интернет, то это будет довольно часто.

Если у вас простой сайт, где нет толком логики, то AMP и близко не нужен. Но если попытаться посмотреть на все популярные интернет-магазины, то будет понятно, какие они тормозные на слабых телефонах.

Если не верите, то просто замедлите в браузере интернет до быстрого 3G, а так же включите тротлинг процессора 4x, а лучше 6x. Посмотрите, на что уходят первые несколько секунд на популярных сайтов и удивитесь.

P.S. Возможно, у вас очень крутые пользователи, которые сидят только с очень крутых компов. Тогда вам эти оптимизации действительно не сдались. Например, у меня на компе даже дев-сборки react/vue проектов летают.
P.P.S. Так же рекомендую ознакомиться с туториалами гугла по поводу оптимизаций фронта. Вот конкретно раздел, посвященный тому, как работает рендеринг и почему он может тормозить - https://developers.google.com/web/fundamentals/performance/rendering/
Не уделяя внимание таким вещам (а тем более не зная об этом, но я верю, что это не такой случай и просто идёт игнорирование фундаментальных проблем производительности) сложно сделать сложный быстрый сайт

Ответить
0

css-minify, js-minify, varnish, memcache и прочие штуки сделают загрузку любой страницы на уровне AMP/Turbo не теряя функционала и стиля, а кеш браузера вообще сохранит это все у себя и при повторной загрузке будет отдан моментально, так что все эти костыли в виде АМП/Турбо были актуальны на заре веба когда про кеш и прочее особо не знали или его не было, тот же OpCache появился только в PHP 5.6 а до этого возможно да было бы актуально на 2G интернете или DialUp загружать AMP, что собственно Браузер Опера и делал, у них первых появились "упрощенные страницы"

Ответить
3

Простите, а как минификаторы могут ускорить перевод js в байткод и работу самого браузерного движка с этим байткодом? Да, они могут совсем чуть-чуть оптимизировать и убрать явный мусор. Вот только иногда на странице очень много "важного" кода, который забирает драгоценные ресурсы на каком-нибудь Xiaomi redmi или samsung Galaxy J/A(2015-2017).

Ответить
0

> Простите, а как минификаторы могут ускорить перевод js в байткод и работу самого браузерного движка с этим байткодом?

очень просто JS весил 5 мб, после сжатия стал 1 МБ этот 1МБ во-первых проще загрузить с сервера в браузер и хранить в кеше браузера или его вообще можно упаковать в AppCache (кеш HTML5) который будет всегда загружаться локально, в AppCache можно вообще запихать все что угодно и картинки и стили и скрипты предварительно их сжав потому что лимит AppCache 5 МБ, в эти 5 МБ вообще можно упаковать весь сайт, чтобы менялся только текст от страницы к странице, то есть разницы не будет что мы загружаем текст с AMP / Turbo что загружаем текст предварительно имея все остальное в AppCache

Ответить
1

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

Конечно, браузерные движки стараются оптимизировать всё и вся, но у них много проблем. До сих пор достаточно много паттернов, которые браузер не может оптимизировать. Вот как раз тут и приходит на помощь AMP. Он очень сильно регламентирован, а так же оптимизирован по самое не хочу. Самостоятельно такого добиться крайне сложно. А ограничения по компонентам как раз не позволяют притащить на страницу то, что будет её замедлять. Хотите быструю работу сайта - откажитесь от части функционала. Но тогда зачем изобретать свой AMP? Потому что помимо готовых компонентов у AMP есть множество других плюшек, например кэширование данных на серверах гугла со всеми вытекающими.

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

Ответить
0

> Мы немного о разном

Вы о том, что процессор переводит JS в байт код и тем самым устает. А я о том, что сейчас такие технологии кеширования, что нет особой разницы. JS / CSS переводится в байт код 1 раз, далее результат кешируется и все.

Нет разницы отобразить HTML с серверов в Гугле в виде АМП или отобразить этот же HTML из локального кеша

Ответить
1

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

Ответить
–1

щас у всех интернет 4G на скорости по 50 мегабит / сек и восьмиядерные телефоны с 6 ГБ RAM не думаю что скрипты по пару МБ вообще проблема для кого-то сейчас.

Ответить
1

у всех интернет 4G на скорости по 50 мегабит / сек и восьмиядерные телефоны с 6 ГБ RAM не думаю что скрипты по пару МБ вообще проблема

Ответить
0

В Индии интернет быстрее чем в России ))))

Ответить
0

> Он очень сильно регламентирован

Я бы так не сказал. Посмотрите AMP Wordpress Theme - там и стили и скрипты уже на них вешают и картинки любые и все на свете)

Ответить
1

К сожалению пока много где очень плохой и не особо дешёвый мобильный интернет
Или кейс когда у тебя в каком-нибудь Emirates дают 20мб интернета, и хочется прочитать как можно больше

Ответить
3

Мода на простые сайты обязательно вернётся. Но теперь - с горьким опытом бесполезности свистоперделок.

Ответить
2

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

Ответить
1

У меня больше от современных говно-сайтов глаза вытекают)

Ответить
1

Мошковский сайт хрен спарсишь нормально из-за всей этой мурзилки

Ответить
0

хрен спарсишь

в каких целях?

Ответить
0

Благотворительных (:

Ответить
1

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

Ответить
0

есть хорошие статьи по теме? Конкретно про разработку сразу под AMP с учетом его ограничений. Интересует в первую очередь сторона дизигна, но и всё остальное тоже было б неплохо.

Ответить
0

19445 год

Ответить
1

Было бы странно придумать amp, а он не работаеТ

Ответить
–8

Почему это он не работает? Данное сравнение как раз-таки и показывает, что оно работает

Ответить
7

Ты серьезно?

Ответить
0

Он сарказмнул!

Ответить
0

Нужна правильная разработка сайтов? Обращайтесь

Ответить
1

У вас что-то с версткой :)

Ответить
0

а чему у вас долго грузится, если весь сайт 1 картинка + видео на фоне, которое не идет в учет этого времени?

Ответить
0

Мода на тотальное упрощение и отупение интерфейсов, надеюсь, пройдёт с увеличением диагоналей раскладывающихся экранов.

Ответить
0

Все оптимизации в обсёре, потому что Гугл поменял критерии оценки

Ответить
0

Парень, Lighthouse это полный приметив. Это все равно, что написать статью, как разные сайты реагируют на изменение масштаба

Ответить
0

Pagespeed полный примитив. Lighthouse еще норм.

Ответить
0

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

Ответить
0

AMP / Turbo нужны поисковикам чтобы откручивать там вашу рекламу, тут все просто, смотрите:
1. Пользователь открывает АМП / Турбо, там ему показывается реклама встроенная в упрощенные страницы
2. Пользователь нажимает "показать полную версию" и ему еще раз откручивается эта же реклама на полной версии сайта.

То есть, идет двойной показ рекламы. А потом Яндекс и Гугле рапортуют о прибылях и прочее, типа смотрите мы подняли лярды денег за первый квартал, какие мы молодцы :)

На самом деле забота о пользователях там стоит даже не на втором и не третьем месте.

Ответить
0

Не жму полные версии страниц. Нафиг они нужны?

Ответить
0

Чтобы заработать на РСЯ / КМС двойные суммы нужно всего лишь раз в неделю... [читать полностью..]

Ответить
0

На «моих» сайтах тест и так целиком, видимо

Ответить
0

Умнее было бы не этим инструментом тестировать, а чем-то, что реально меняет фактическую скорость загрузки.

Например, https://tools.pingdom.com

Page speed от Google - это лишь ориентир, не более того. Хотя на моих сайтах и с ним проблем нет. Например: https://georgia.in-facts.info/prices/chto-privezti-iz-gruzii/ (страница без чужих скриптов).

Ответить
0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Компания отказалась от email
в пользу общения при помощи мемов
Подписаться на push-уведомления
{ "page_type": "default" }