Как стать автором
Обновить

Комментарии 52

Я так понимаю — это тот доклад, что ещё предстоит вам рассказывать через 4 часа на MoscowJS? Эх, всю интригу попортили =(
Но всё равно спасибо.
доклад будет читать Максим Фролов, и контент его доклада будет отличаться)
Скажите, а нельзя ли на мобильной Ленте сделать заранее заданными размеры рекламы вверху страниц? Мало того, что реклама бывает навязчивой, так она грузится после страницы, и вот вроде страница прогрузилась, и только ты думаешь тыкнуть в ссылку на экране — в этот момент контент прыгает вниз на неизвестное расстояние (высота баннера), и ты попадаешь пальцем в баннер или в другую ссылку.

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

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

P.S. Наверное, нет нужды говорить, что adblock воспринимается после такого вовсе не как «грабитель обездоленных владельцев сайтов», а просто как что-то, что дает сайты читать, не пребывая в постоянном стрессе от боязни не туда нажать или не то выбрать? )

P.P.S. А за «клюкву» в стиле «показывать только хорошие новости» хочется маркетологам руки оборвать. Маму или не маму за деньги продать — не знаю, что они готовы, но на новостном сайте в угоду рекламе изменять подачу материала… Это непрофессионально, минимум. Конечно adblock-чить такое!
Вот чего я не могу понять: неужели браузер считает, что клик по элементу через 50 мс после его отображения — это то, что я действительно имел в виду? Почему бы разработчикам не сделать элемент некликабельным некоторое время после его отображения или перемещения?
Ну мы тут доходим до того, чтобы железка за нас считала, что нам надо :)

Но, правда, при таком размахе применения adblock-ов, и при такой конкуренции СМИ, даже странно, что баннеры так глупо лепят — ведь пара таких «промашек мимо ссылки», и человек думает. что делать с рекламой.
У нас было 2 версии сайта, 75 сторонних рекламных скриптов, 5 скриптов метрик, пол-солонки БЭМа и целое множество запросов от бизнеса всех сортов и расцветок, а также легаси, рефакторинг, ящик ошибок, пинта чистого энтузиазма и безрезультатные усилия. Не то что бы это был необходимый запас для проекта. Но если начал собирать проект, становится трудно остановиться. Единственное что вызывало у меня опасение — это легаси. Нет ничего более беспомощного, безответственного и испорченного, чем легаси. Я знал, что рано или поздно мы перейдем и на эту дрянь.
Ну так это… я видимо чего-то не понимаю. Если из стандартной версии убрать все скрипты, стили, картинки и тд, как вы сделали с АМР — то и получится то же самое. И без всякого АМР. Нет?
полностью убрали только скрипты. стили и картинки были переоформлены и урезаны по правилам amp. по сути amp — это набор правил + конструктор, состоящий из готовых оптимизированных виджетов. плюс кеширование, скорость отдачи и приоритет в выдаче гугла.
goto Gorky; // infinty loop here

Признаться честно, читая первые абзацы статьи тоже думал, что amp загрузит быстрее мою страницу а не предложит делать рефакторинг кода. Но как оказалось, чудес не бывает.
А теперь разгадка. При переходе по AMP-ссылке с мобильного устройства гугл загружает (и предзагружает) всю информацию не с лента.ру, а со своего cdn. Пример ссылки: https://www.google.ru/amp/s/m.lenta.ru/news/2016/03/31/twentymillions/amp/. Ссылка открывается только с юзерагентом мобильного устройства, а на десктопе перенаправляется на лента.ру.

Плюсы:
  1. не надо открывать http(s)-соединение
  2. этот cdn очень быстрый
  3. сервера гугла могут пересжимать шрифты, скрипты и картинки
  4. привет роскомнадзору

Минус: фактически, сайты на amp дарят весь контент гуглу. Это чем-то напоминает ситуацию с новостными агрегаторами, но последние обычно показывают только часть контента и дают ссылку на оригинал, а с amp 100% запросов идут на гугл.
По сути, AMP — это просто как кеширующий прокси.
Ничего волшебного.
Хотелось бы узнать, как это повлияет на посещаемость, показатель отказов и другие метрики (помимо скорости). Стоила ли игра свеч, так сказать.
Планируется ли в будущем пост с аналитикой?
Да, в ближайшем будущем соберём данные и сопоставим изменения в посещаемости.
А можно с обычной ленты выкинуть криворукие баннеры, которые вешают Firefox?
> Page size: 8.8mb
> Page size: 0.9mb
1) Очень больно смотреть на страничку на 9мбайт…
2) Сраниваются две версии страницы — одна на 8 мбайт и 438(!) запроса против 23 запросов на 900кбайт.
А не очевидно ли, что если бы вы просто сократили бы количество подключаемого контента также в 20 раз, то у вас также выросла бы скорость загрузки страниц?

Или это первоначальная прогрузка странички, и основной рендеринг всего остального происходит уже после 1.43s?

Еще вопрос:
Иногда бывает так, что выходишь в интернет из публичного места, например популярного кафе, и его IP много где забанен. И в таких неприятных случаях случается такое, что из-за подтягивания виджетов соц.сетей — загрузка страницы просто не происходит, т.к. ожидается загрузка скриптов с facebook, это не происходит, случается какая-то ошибка, сайт встает белым экраном и никакого тебе контента из-за твоего IP. Вы как-то прорабатываете такой кейс, когда тупо не отвечает соц.сеть? Ведь даже facebook раз в год падает…
семь бед, один async
Единственное что меня заставляет на телефоне использовать полную версию сайта на телефоне так это отсутствие кнопки «обсудить».
Хотя раздел на сайте есть m.lenta.ru / comments*, а ссылки из новости на него нет.
Увидел как из страницы убрали мусор, не увидел где польза от AMP!
Обычная мобильная страничка весом 8,8МБ это странновато, вам так не кажется?
Суть AMP не в сокращении веса и уменьшении количества запросов. За это отвечает оптимизация. Суть AMP — кеширование, и главное — выдача в Google. Одного этого достаточно для применения технологии.
Кеширование где?
Спасибо, это будет интересней этой статьи почитать
Хотя нет, там никаких подробностей или я читаю не очень внимательно. Как можно в AMP влиять на кеширование? Что делать, если гугл закешировал что-то не то? Гугл кеширует только превьюшку, которую сам показывает, верно? Вот эту:
image
Гугл кэширует весь контент, включая скрипты, изображения и шрифты. Когда пользователь мобильного устройства нажимает на ссылку (как на вашем скриншоте), вопреки ожиданиям пользователя открывается кэшированная страница https://www.google.ru/amp/s/..., а не lenta.ru. Эдакий cloudflare поверх очень сильно прокачанного rss.
т.е. из выдачи гугла попадёте туда, из яндекса/бинга/напрямую — на обычную страницу, где кешированием управляете самостоятельно, из мобильных приложений — зависит от того кто их и как делал, верно? Или это какой-то стандарт и тот же твиттер тоже будет посылать на кешированную гуглом версию? Я не вижу подробного описания этой фичи, подскажите где оно.
У меня PageSpeed Insights Показывает 59/100 для главной страницы. Не похоже на скорость света
Главную не трогали, потому что контент динамически меняется. Amp хорош именно для контентных страницы.
PageSpeed Insights считает что все подключаемые скрипты и прочая лабуда важны на странице. Текст поста говорит об обратном. А оценка лишь показывает насколько этот мусор удобен для загрузки девайсами. Конкретно на примере соседнего вашего комментария: можно выиграть на сжатии JS около 55,8 КБ из 1.6MB общего веса. Это добавит 5 баллов, но поможет ли?
Я к тому, что раз уж решили разгонять, то можно было бы и неважные скрипты сократить в два раза.
Неважные скрипты можно бы и совсем убрать, но PageSpeed сотку всё равно не даст. tools.pingdom.com в данной ситуации более корректный инструмент т.к. показывает ещё и вес и число запросов, а не просто даёт рекоммендации. Я не говорю что гугл советует что-то плохое. Вы верно заметили что помимо лишнего кода на сайте ещё и неоптимизированный код есть, а также другие проблемы, с которыми следует бороться.
Хорошая страничка после всех оптимизаций должна весить ~300КБ включая графику и набирать 80+ в том же PageSpeed. Но этого в посте нет и не планировалось.
Скажите, а воровство контента с ютуба с приклеиванием «Lenta.ru» в первые 10 секунд у вас тоже автоматически?
Это, конечно, все здорово. Но ленту кто-то еще читает?
Медуза — это понятно. Но в статье-то речь про "новую" ленту.
Боты.
А почему бы ее не читать?
Вот как раз картинка в тему появилась. Интересно, про панамские офшоры вы что-нибудь уже слышали? (хотя мы уже в глубокий офтоп уходим)
Сделайте, пожалуйста, ссылку на комментарии в мобильной версии. И еще не обрезайте картинки в галереи в той же мобильной версии (лучше добавьте белые полосы, но не обрезайте головы людям).
AMP сильно упрощает жизнь тем, кто часто читает новости на мобилке не через приложения. Можно просто ввести название ресурса в хроме и просто пролистать карусельку, даже не заходя на сайт, тем самым сэкономив время и трафик. BBC, Lenta, Meduza… да хоть RT. И другие подтягиваются потихоньку.
Печалит только ограничение Googl'а «только новостные ресурсы».
При чём тут AMP вообще?
Страница стала 1 Мб вместо 8 Мб, 23 запроса вместо 400, КОНЕЧНО она будет загружаться быстрее =)))
Не только из-за этого. Есть ещё гугловский кеш.
Ну это давно уже используется, такие проксирующие кеши были начиная с самого рождения интернета =)
Конечно. Только обычно это мемкеш или что-то подобное. А тут локальный гугловский cdn играет эту роль, и вам не надо тащить данные с другого континента.
memcache тут ни при чем.

или в ленте про geo-cdn не слышали?
тут готовое решение, развернуть которое — это изменить вёрстку и пару скриптов добавить. в обмен вы получаете гугловские cdn без необходимости лезть в nginx и что-то настраивать дополнительно.
вы конечно не обижайтесь, но вы выражаетесь в стиле «слышу звон, да не знаю где он»

пусть прозвучит как реклама cloudflare, но там вообще не надо лезть в настройки nginx. только поменять ns-сервера.

Взамен, из коробки, например, можно получить автоматическое сжатие картинок или combine js&css.

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

Peace ;-)
По ссылкам известные и не очень новые вещи. :) Спасибо что нагуглили.

Мобильную оптимизацию cloudflare даёт только на платном тарифе и никакие стандарты на код не налагает и подсказывает что и где поправить.
Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.