perfScan - Секреты быстрых сайтов

🚀 Друзья!На канале perfScan давно не было новых публикаций.Причина простая и очень банальная: на качественный контент нужны время и ресурсы.Я могу в ChatGPT писать посты каждый день, как делают 90% каналов, но хочется все делать с максимальной пользой и через призму моего опыта - вы и сами знаете, что я сильно задрал планку качества публикаций.Я хочу вернуть регулярные разборы, гайды и обновления, мне совершенно точно есть что сказать, но для этого мне нужна ваша поддержка, и что самое главное - уверенность, что это кому-то нужно.⚠️ Если вам важна тема ускорения сайтов и вы хотите видеть развитие канала - поддержите проект донатом.➡️ Поддержать можно здесь: https://pay.cloudtips.ru/p/4ad68fa9Ваша помощь даст возможность выпускать больше контента и сделать этот канал снова активным и полезным пространством для всех, кто ценит скорость.👍 - если перечитывал посты и плакал, как и я

Всем привет! С Новым годом! Завтра в 15:00 по МСК я проведу разбор ваших сайтов на вебинаре у Михаила Шакина.Я дам вам советы по улучшению ваших сайтов в обмен на лайки и реакции. 📱 https://www.youtube.com/watch?v=uNXL1xjoDUU 📱 https://vkvideo.ru/video80770238_456240948 ⚠️ Как отправить сайт на аудит:Заполните поля в форме по ссылке https://docs.google.com/forms/d/e/1FAIpQLSeHUoQwRsGvJut5HxIOM0YCu-QExtKO82mfv0dViP6BFJ3icA/viewform в комментариях укажите, что вы с канала @perfScan и на что нужно мне обратить внимание при разборе вашего сайта.Не пропусти, первый мой разбор сайтов в 2025 году.

Привет всем!Завтра в 13:00 я буду выступать на АспроSearch — SEO-конференции от компании Аспро. В своем докладе я расскажу о том, как работает PageSpeed, как интерпретировать его данные и почему пейджскор вашего сайта именно такой.Кроме меня на конференции выступят и другие докладчики, но в другие дни.Приходите, это будет полезно. Подробнее про АспроSearch можно узнать на сайте.Зарегистрируйтесь через чатбот, чтобы вовремя получить напоминание, ссылку на трансляцию, материалы и записи.

Если вы смотрели мои эфиры, то наверняка видели мой сервис, который выводит исторические данные Web Vitals из базы Chrome UX Report.Если что - ➡️он здесь⬅️Так вот, совсем недавно я его сильно обновил, добавил общие рекомендации по каждому параметру, вывел общую оценку производительности, чтобы с первого экрана было все ясно, и теперь польза этого сервиса, как мне кажется, повысилась на порядок.В рекомендации попали все советы, про которые я много раз писал здесь и говорил на каждом из своих эфиров. Если я что-то упустил, давайте вместе добавим и доработаем сервис, чтобы он стал еще полезнее.Также добавил максимум ссылок на этот канал (если перебор — тоже пишите, удалю лишнее, может и правда переборщил).Так вот, на сегодня есть несколько проблем у этого сервиса:1. У молодых сайтов и сайтов с небольшим трафиком нет данных в Chrome UX Report и многие получают заглушку, мол, нет данных, и уходят. Как думаете, что с этим можно сделать?2. Для Chrome UX Report сайты с www и без www являются разными, ровно как и http/https. Таким образом, необходимо, чтобы пользователь правильно вводил данные. Так как бэкенда тут как такового нет, а все запросы летят напрямую в Chrome UX Report, то на лету сложно преобразовывать, следовать редиректам и проверять сертификаты. Как думаете, писать ли свой бэкенд, или и так норм?💬 Очень жду ваших советов и мнений относительно вышесказанного.🔥 И дайте огня, если сервис полезный!

Всем привет!Завтра в 15:00 по МСК я снова проведу разбор ваших сайтов на канале Михаила Шакина. С меня советы по улучшению быстродействия и загрузки, с вас реакции.📺 https://www.youtube.com/watch?v=ztQl0eTw4qwЧтобы отправить ваш сайт на разбор, оставьте заявку в форме https://docs.google.com/forms/d/1pGnpcZaqMJhOYhhue3pITh1vFBoXyZOrYZPI_9S_oPY/edit в комментарии укажите, что вы с канала @perfScan. Также в комментарии можете указать на конкретную проблему на которую хотите обратить моё внимание.Приходите на прямой эфир, отвечу на любые ваши вопросы по ускорению и улучшению производительности ваших сайтов.

Всем привет!Я жив, почти здоров, и завтра в 15:00 по МСК на канале Михаила Шакина я разберу ваши сайты и отвечу на вопросы по ускорению сайтов. Кстати, если хотите пригласить меня к себе, делайте как Михаил - просто пишите мне )📺 https://www.youtube.com/watch?v=IxshIqTFhm4Чтобы отправить ваш сайт на разбор в прямом эфире оставьте заявку в форме https://docs.google.com/forms/d/1pGnpcZaqMJhOYhhue3pITh1vFBoXyZOrYZPI_9S_oPY/edit в комментарии укажите, что вы с телеграм канала @perfScan. Также в комментарии можете указать на конкретную проблему на которую хотите обратить моё внимание.

Всем привет. С Новым годом! 🎄Как проходят ваши праздники? Давайте завтра в 15-00 по МСК проведем время с пользой для ваших сайтов. Михаил Шакин пригласил меня к себе на канал, чтобы разобрать сайты подписчиков на предмет скорости загрузки и быстродействия.▶️ https://www.youtube.com/watch?v=mvTi4JzcF5MРазберем, что можно улучшить на ваших сайтах, дадим советы, которые вы сможете внедрить на своем сайте, и сделать его быстрее.Чтобы отправить ваш сайт на разбор в прямом эфире оставьте заявку в форме https://docs.google.com/forms/d/1pGnpcZaqMJhOYhhue3pITh1vFBoXyZOrYZPI_9S_oPY/edit в комментарии укажите, что вы с телеграм канала @perfScan.

Привет всем. Завтра в 15-00 по МСК я проведу разбор скорости сайтов подписчиков на канале Михаила Шакина. Дам советы по улучшению и конечно подведу итоги года, и отвечу на все ваши вопросы. Да, и расскажу кое-что про новогодние украшения сайтов.https://www.youtube.com/live/Ku6r1XWQTdUПриходите, будет интересно, а если хотите, чтобы я разобрал ваш сайт, оставляйте заявку в форме https://docs.google.com/forms/d/1pGnpcZaqMJhOYhhue3pITh1vFBoXyZOrYZPI_9S_oPY/edit в комментарии пометьте, что вы с телеграм канала @perfscan

Привет. Завтра 10 ноября снова буду в эфире на канале у Михаила Шакина, где буду анализировать сайты и давать советы по улучшению.https://www.youtube.com/watch?v=klG1LDhlNU0Приходите, кто хочет получить бесплатный разбор своего сайта. Главное - отправьте ссылку на сайт заранее через форму https://docs.google.com/forms/d/1pGnpcZaqMJhOYhhue3pITh1vFBoXyZOrYZPI_9S_oPY/edit в комментарии пишите, что вы с канала @perfScan

Привет. В комментариях просили заранее анонсировать подобные эфиры. В пятницу, 6 октября, я вновь приглашен на прямой эфир к Михаилу Шакину, где буду разбирать скорость загрузки сайтов и давать рекомендации по ним.https://www.youtube.com/watch?v=zyu19xiJRqAКто хочет — приходите, разборы бесплатные, только заранее отправьте свой сайт по ссылке: https://docs.google.com/forms/d/e/1FAIpQLSeHUoQwRsGvJut5HxIOM0YCu-QExtKO82mfv0dViP6BFJ3icA/viewform Отправляя, напишите, что вы с этого канала в комментарии. Кстати, можно и вопросы во время эфира задавать.P.S.Эх, как же хочется продолжить писать на канал.Пишите в комменты к этому посту, кто хотел бы тут видеть не только мега полезные посты но и рассуждения/истории по теме канала.

Привет всем. Сегодня буду разбирать скорость сайтов на канале Михаила Шакина и давать общие рекомендации по ним. https://www.youtube.com/watch?v=FYAS6Al8oFIКому интересно - приходите, все бесплатно и можно никуда не подписываться. Свой сайт на разбор можно отправить по ссылке: https://docs.google.com/forms/d/e/1FAIpQLSeHUoQwRsGvJut5HxIOM0YCu-QExtKO82mfv0dViP6BFJ3icA/viewformЕсли понравятся разборы, можно будет повторить.

Дорогие топовые фронтендеры, сегодня пост не для вас. Так как вы используете системы сборки и с такой проблемой почти никогда не сталкиваетесь, а в опросе вы выбрали вариант про defer для inline скриптов.Иногда критически важно ускорить существующий сайт, например на Битрикс, но с выводом скриптов там вечная путаница, потому что тему использовали готовую, и затем долго дорабатывали её. Поэтому нет возможности прописать всем скриптам defer, так как на inline скрипты он не работает, а в коде много вызовов, которые используют тот же jquery или другие библиотеки и плагины.Например, вот такой фрагмент скрипта<script>jQuery(document).ready(function(){alert('ok')});</script>требует наличия загруженного jQuery, и вызовет ошибку, если у подключения jQuery написать defer. Один из самых простых способов: использовать base64 и тот же defer для всех скриптов. Давайте превратим этот инлайн скрипт в base64 и подключим как через data, на которые этот defer распространяется<script src="data:text/javascript;base64, alF1ZXJ5KGRvY3VtZW50KS5yZWFkeShmdW5jdGlvbigpe2FsZXJ0KCdvaycpfSk7" defer></script>Да, браузеру придется декодировать base64, однако вам не придется следить за порядком выполнения, это сделает сам браузер. Да, это не самый оптимальный вариант - самый оптимальный переписать все нормально. Но если вы ограничены во времени/бюджете, то это неплохой вариант снять блокировку на первую отрисовку, улучшить #FCP, возможно #LCP и ничего не сломать на сайте.Да, поддерживать такой код невозможно, поэтому нужно сделать так, чтобы вся работа происходила на бакенд и разгрузить фронт, улучшив первую отрисовку.🔥 Дайте огня, если было полезно, или 👍 палец вверх, если уже использовал данный метод.💬 Коммент, если хотите поддержать автора и улучшить его код.

👋 Многие из вас просили меня сделать слайдер, который не будет менять DOM и вызывать перерисовку при инициализации. Я и сам давно обещал вам такой слайдер, очень давно, даже стыдно, но все никак не мог добраться до него. Поэтому я решил попросить помощи у (внезапно) Bing, который работает на GPT-4, и… получилось нечто невероятное!Благодаря множеству уточнений и итераций, Bing написал за меня почти весь код, который работает как мне хотелось и выглядит вполне прилично. Это не готовая библиотека, конечно, но для одного слайдера на странице вполне подходит, и его можно адаптировать под свои нужды. Я намеренно не стал приводить стилистику кода к единому формату, чтобы можно было видеть еще и результат работы нейросети.Я лишь немного подправил оформление точек под слайдером, общий layout, прописал url для картинок и добавил заголовок и футер. Все остальное - заслуга нейросети. Я уже пробовал ранее использовать Bing и ChatGPT для написания кода, но такого успеха еще не было. Я потратил 10 минут, писал только запросы с телефона, при этом сам не писал код, а говорил что и как улучшить. Почти как в повседневной жизни, где я консультирую команды и даю рекомендации по улучшению быстродействия сайтов.В итоге мы имеем слайдер, который полностью соответствует моим требованиям, не меняет DOM и не вызывает перерисовку при инициализации, и даже частично работает без JS. Это ли не чудо? )✅ Ссылка на код слайдера.Если кто-то захочет - можете улучшить его и упаковать в универсальную библиотеку, если пришлете ее мне - я с радостью расскажу о ней.🔥 Зажгите огонь для Bing, или 👍 палец вверх за мои запросы и уточнения )💬 Напишите в комментариях, что вы думаете об этом слайдере и о Bing конечно же.

⚡️ Хорошая новость для всех, кто заботится о скорости работы своего сайта, и для всех, кто не может отказаться от счетчика Яндекс-Метрики, но проблемы с производительностью возникают именно в нем. Код подключаемого бандла теперь opensource.Что это значит? По ссылке доступен исходных код и правила для сборки кода бандла Яндекс-Метрики. Даже просто отключив поддержку очень старых браузеров и разместив его у себя, мы получим улучшение быстродействия. Дерзайте, я тоже проведу эксперименты со своей стороны.Подробнее в статье на хабре, там описано как работает код, что можно менять, и как отключить ненужные функции.⚠️ Обратите внимание, запросы отправляются к яндексу, поэтому еще одно соединение никуда не денется. Чтобы от него избавиться на клиенте, рекомендую использовать проксирование, о котором я писал ранее.💬 Что думаете по этому поводу? Будете ли использовать собсвтенную сборку или останетесь на стандартном бандле, подключаемом с серверов Яндекса?👍 Палец вверх, если вы уже подключаете свою версию метрики в основной бандл.

⚡️ Сегодня ночью Lighthouse был обновлен до 10 версии.‼️ Важные изменения:1. Time To Interactive (TTI) больше не учитывается при общей оценке производительности. В восьмой версии его влияние уже было снижено до 10%, а теперь он и вовсе не участвует в формировании оценки. Показатель все равно рассчитывается и можно его получить в json отчете. 2. Влияние Cumulative Layout Shift (CLS) усилено c 15% до 25%. Именно он получил те самые 10% от TTI.3. Добавлен новый аудит bfcache, это проверка как браузер обрабатывает навигацию вперед/назад, такие страницы должны быть показаны моментально. Но этот аудит не будет отображаться в Google PageSpeed Insights. Доступ к нему можно получить через JSON.Также был переработан механизм сборки, изменены названия аудитов в JSON, некоторые аудиты вообще удалены. Подробнее можно ознакомиться на Github проекта и в нашем любимом калькуляторе общей оценки.⚠️ Из идентификации User-Agent убрали "Chrome-Lighthouse", теперь не получится по этому параметру скрывать часть контента или отдавать облегченную версию.💬 Давайте обсудим в комментариях.Что вы думаете о текущих изменениях?Обращали ли вы последнее время внимание на TTI?Не считаете ли завышенным влияние CLS?🔥 Дайте огня за оперативность.