⚡️ Как PageSpeed привёл меня к созданию собственного CSS-фреймворка
Кейс с реального MODX-проекта

В SEO-сообществах до сих пор спорят, насколько важны высокие баллы PageSpeed.

Лагерь “Яндекс”: «Это бесполезная метрика. Главное — поведенческие и контент».

Лагерь “Google”: «Зелёная зона (90+) обязательна, иначе в ТОП не попадёшь».

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

🔴 Кейс: Как я ускорял крупный MODX-сайт на Bootstrap 4

Недавно ко мне пришёл довольно крупный проект на MODX. Показатели PageSpeed были в красной зоне — ниже 50. Классический набор проблем: Bootstrap 4 → тонна CSS/JS → куча устаревших jQuery-библиотек → тяжёлая сетка → отсутствие оптимизации.

Первые шаги — «на минималках»:
- минификация и склейка CSS/JS,
- сжатие HTML,
- WebP,
- кэширование, и прочие мелочи.

Результат: PageSpeed вырос до 61.
Но фактическая скорость почти не изменилась. Пользователь всё так же ждал.
Знакомо? :)

🧱 Чтобы получить честные 90+ пришлось переверстать всё
Я оставил от Bootstrap только сетку (и то уже от 5-й версии),
а всё остальное собрал вручную на современном легком JS без старых зависимостей.

И что получилось:
- первый экран начал отрисовываться в 10 раз быстрее,
- сайт стал ощутимо легче,
- PageSpeed упёрся в 89.

И тут вылезли три вещи, которые «ломают» почти каждый сайт:
- Метрика,
- Веной (чат),
- Мегафон (виджет перезвони).

Это те вещи, которые нельзя выкинуть, но они тянут скорость вниз.

Решение: отложенная загрузка
- Метрика → +1 сек,
- Чат и «перезвонишку» → после полной отрисовки страницы.

Итог: 98 баллов PageSpeed.
Если интересно — могу сделать отдельный пост, как правильно откладывать загрузку внешних скриптов.

💡 Почему в этой истории Bootstrap?

Всё просто: каждый второй MODX-сайт страдает от одной и той же проблемы — перегруженного Bootstrap.

Русскоязычное MODX-сообщество его любит: модули и сниппеты часто используют именно его разметку.

Но Bootstrap — это комбайн, который тащит на себе сотни килобайт CSS и JS, даже если сайту нужны только:
- сетка,
- кнопка,
- пара цветов,
- и пара отступов.

🛠 Так родился Light Code Framework

Именно на этой рутине и появилась идея: создать CSS-фреймворк, который можно подключить вместо Bootstrap на текущем сайте — без «развала» верстки.

Цели Light Code Framework:
- быть в разы легче Bootstrap,
- сразу давать прирост PageSpeed,
- сохранять сетку и базовую разметку,
- иметь всё нужное и ни грамма лишнего.

❓ Вопрос к сообществу
Какой у вас максимум (или антирекорд) PageSpeed?
И как часто сталкиваетесь с «зависимостью» от Bootstrap в проектах?

Пишите — обсудим.

🔜 В следующем посте

Протестируем ТОП нейросетей: смогут ли они написать такой фреймворк или хотя бы его основу.

#LightCodeDev #MODX #PageSpeed #FastDevLab

🤖 #AITools: Тестируем ТОП-6 нейросетей на кодинг! Смогут ли они написать Light Code Framework?

В прошлый раз мы обсудили, что для чистых 90+ PageSpeed нужен легкий CSS-фреймворк вместо раздутого Bootstrap. Сегодня — тест-драйв: Могут ли нейросети сделать мою работу и написать этот фреймворк за меня?

Участники теста (ТОП-модели): Qwen2.5-Max, Deepseek, Grok 4, Gemini (Google), ChatGPT 5, Claude Sonet 4.5 (везде, где можно включен режим рассуждения и поиска в интернете).

📝 Лайт-Промт:
" Ты профессиональный Web разработчик, со стажем 20 лет. Твоя задача разработать CSS / JS фреймворк подобный bootstrap 5. В идеале чтобы он и использовал его классы, сетки и т.п. Но бутстрап считаю сильно перегружен кнопки 10 цветов и т.п. и его JS ну такой себе. Ему нужно сильно почикать CSS оставить, к примеру по 3 цвета (кнопок и т.п.), весь JS переписать."

📉 Результаты: Провал и костыли

- Qwen2.5-Max: ❌ Полный провал. Порекомендовал использовать несуществующий кастомайзер Bootstrap и 'почистить' Sass-переменные вручную. То есть, свалил работу на меня.
- Gemini: ❌ Не справился. Набросал Sass-шаблон (тупое подключение Bootstrap по частям) и написал нативный JS только для одного компонента — Modal. Бесполезно.
- ChatGPT 5: 🤦‍♂️ Фиаско. Позадавал вопросы, пообещал архив, а в итоге выдал HTML с пустыми CSS и JS файлами. Спасибо за потраченное время.
Deepseek / Grok 4: ⚠️ Частичный успех. Набросали работающий CSS, JS и HTML. Но забили на половину утилит. Им можно заменить сайт на Bootstrap? Нет, он развалится. Но можно заставить их доработать.

🏆 Победитель: Claude Sonet 4.5

Я тестировал его через Perplexity.ai, и он реально удивил!

✅ Claude Sonet 4.5 сразу (без дополнительных вопросов) создал все файлы: CSS, JS и HTML, причем:
- Сделал страницу с документацией фреймворка.
- Добавил рабочий переключатель цветовых схем прямо в документацию.
- Даже создал документацию в PDF-файле.

Лайк ему однозначно! Он единственный понял задачу комплексно и сразу выдал готовый продукт для дальнейшей доработки.

➡️ Что дальше? От идеи к GitHub

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

А главное: я начал разработку сайта FasDevLab, чтобы ускориться, выбрал готовый премиум шаблон Porto, который использует Bootstrap 5.
Мой дальнейший план — заменить в нем Bootstrap на новоиспеченный Light Code Framework.
Если замена пройдет гладко, фреймворк можно заливать на GitHub, создавать полноценную документацию и выводить в свет!

❓ Вопрос к вам: какая нейросеть вас чаще всего спасает в кодинге? И какой компонент (кроме сетки) вы считаете критичным для любого Bootstrap-подобного фреймворка?

#AITools #LightCodeDev #Coding #FastDevLab

🤖 #AITools: Свежие обновления топовых нейросетей в ноябре 2025! 🔥

1. Baidu ERNIE 5.0 (ernie.baidu.com) — китайский гигант представил омни-модальную модель, которая бьёт GPT-5-High и Gemini 2.5 Pro по бенчмаркам (OCRBench, DocVQA, ChartQA). Нативно работает с текстом, изображениями, аудио и видео. Доступна без VPN, как и ее китайские друзья - аналоги: Qwen (chat.qwen.ai) и DeepSeek (chat.deepseek.com) — тоже free и без прокси в России. Эти AI формирует "тройку лидеров" из Азии.

2. В Gemini (от гугла - gemini.google.com) появилась новая "думающая" модель 3 Pro с прорывом в reasoning (81% на MMMU-Pro, 87.6% на Video-MMMU). Лучше понимает сложные темы, мультимедиа и эмоции. Доступна в бесплатном аккаунте, но в России нужен VPN.

3. У СhatGpt (OpenAI- chatgpt.com) - 12 ноября, появилась новая модель 5.1: smarter и conversational (режимы Instant и Thinking для глубокого анализа). Пока доступна только для платных пользователей, бесплатная версия — позже. Нужен VPN.

4. У xAI Grok (AI Илона Маска - grok.com) появилась модель 4.1, которая обходит GPT-5.1 и Gemini 2.5 Pro по EQ-Bench (эмоциональный интеллект) и LMArena. В общем у него теперь меньше галлюцинаций, круче креатив! Доступна бесплатно. В России — с VPN.

🤯 Решение проблемы с VPN для ТОП-нейросетей!

Если вас достали постоянно отваливающиеся VPN, есть выход, который я сам использую:

🔥 Perplexity.ai PRO. Это агрегатор топовых моделей (GPT-5.1, Claude Sonet 4.5, Grok 4, Gemini 3 Pro) и, самое главное — он РАБОТАЕТ В РОССИИ БЕЗ VPN!

Официальная подписка на год стоит $240.

Лайфхак. На ggsel.net/catalog/perplexityai можно найти "общие" аккаунты или активацию подписки на свой аккаунт по промокоду от 120 до 500 рублей на год! Я сам пользуюсь таким способом уже 2 месяца, полет нормальный. Берите, пока "халява" не закончилась!

⚠️ Небольшое замечание: с учетом последних обновлений, чувствую, что тесты AI на кодинг я провел немного рановато :) Возможно, новые модели показали бы себя иначе. Ну и промт наверное нужно сделать не как у обычных обывателей, а более профессиональный.

🔜 В следующем посте: Расскажу про правильную отложенную загрузку внешних скриптов — как добиться 95+ PageSpeed, грамотно используя метрику и виджеты.

#AITools #AI #WebSurvival #FastDevLab

// ==================== 🧠 Продвинутый вариант ====================
function loadIdleScripts() {
    const scripts = [
        { src: '//api.venyoo.ru/wnew.js?widget_id=YOUR_ID' },
        { src: '//code.jivosite.com/widget/YOUR_ID' }
    ];

    scripts.forEach(config => {
        loadScript(config.src, config.attributes || {})
            .catch(err => console.warn('Idle script error:', err));
    });
}

// ==================== 🚀 Инициализация ====================
function initDelayedLoading() {
    // Всегда загружаем метрику и основные виджеты по таймеру
    loadTimerWidgets();
    
    // Инициализируем загрузку по взаимодействию
    ['scroll', 'mousemove', 'touchstart', 'click'].forEach(event => {
        window.addEventListener(event, loadInteractionScripts, { 
            once: true,
            passive: true 
        });
    });
    
    // Fallback: если пользователь не взаимодействует, загружаем через 5 сек
    setTimeout(loadInteractionScripts, 5000);
    
    // Дополнительная загрузка в простое браузера
    if ('requestIdleCallback' in window) {
        requestIdleCallback(loadIdleScripts, { timeout: 3000 });
    } else {
        setTimeout(loadIdleScripts, 3000);
    }
}

// Запускаем после полной загрузки страницы
if (document.readyState === 'complete') {
    initDelayedLoading();
} else {
    window.addEventListener('load', initDelayedLoading);
}

🎯 Когда какую стратегию использовать?

Тип скрипта / Стратегия / Задержка / Почему
Яндекс.Метрика / По таймеру / 500-1000мс / Не теряем данные, но не мешаем загрузке
Callback-кнопки / По таймеру / 2000-3000мс / Важны для конверсии, но не срочны
Виджеты / По таймеру / 2500-4000мс / Баланс между скоростью и функциональностью
Чаты / По взаимодействию / При действии / Нужны только активным пользователям
Тяжелые виджеты / requestIdleCallback / В простое / Самые низкоприоритетные

📈 Результаты внедрения
После применения этого подхода:

PageSpeed Mobile: +15-20 баллов

Время загрузки: -30-40%

Показатель отказов: -15%

LCP: улучшается на 0.4-0.7 сек

FID: стабильнее на 20-30%

Важно. Не вешайте все скрипты в <head>. Делите их по критичности и загружайте с умом!

❓ Вопрос к вам. Какое время задержки (в миллисекундах) вы считаете оптимальным для Метрики и Чатов на вашем сайте?

#SEOPractice #WebSurvival #PageSpeed #FastDevLab

⚡️ Правильная отложенная загрузка внешних скриптов

В позапрошлом посте мы остановились на том, что чистые 90+ PageSpeed не дают получить сторонние скрипты: Яндекс.Метрика, виджеты обратного звонка (Мегафон, Веной) и онлайн-чаты. Именно они блокируют основной поток рендеринга, пока браузер их ждет.

Это и есть знаменитая "стена 89 баллов", которую невозможно пробить стандартными методами.

Решение: Умная отложенная загрузка с разными стратегиями для разных типов скриптов.

🎯 Три стратегии для разных задач
📊 1. Яндекс.Метрика — загрузка по таймеру (1-2 сек)
Метрику нельзя откладывать надолго, но и грузить сразу — мешать пользователю.

💬 2. Виджеты и чаты — загрузка по взаимодействию
Для скриптов, которые не нужны сразу — только когда пользователь проявил интерес.

⏰ 3. Виджеты по таймеру — балансный вариант
Когда виджеты должны гарантированно показаться, но не сразу.

🛠 Готовое решение

// Универсальная функция загрузки скрипта
function loadScript(src, attributes = {}) {
    return new Promise((resolve, reject) => {
        // Проверка на дубликаты
        if (document.querySelector(`script[src="${src}"]`)) {
            resolve();
            return;
        }

        const script = document.createElement('script');
        script.src = src;
        script.async = true;
        
        Object.keys(attributes).forEach(key => {
            script.setAttribute(key, attributes[key]);
        });

        script.onload = () => resolve();
        script.onerror = () => reject(new Error(`Failed to load: ${src}`));
        
        document.head.appendChild(script);
    });
}

// ==================== 📊 Яндекс.Метрика ====================
function loadYandexMetrika() {
    if (window.ym) return;

    // Noscript для случаев с отключенным JavaScript
    const noscript = document.createElement('noscript');
    noscript.innerHTML = '<div><img src="https://mc.yandex.ru/watch/YOUR_ID" style="position:absolute; left:-9999px;" alt="" /></div>';
    document.body.appendChild(noscript);

    (function(m,e,t,r,i,k,a) {
        m[i] = m[i] || function() { 
            (m[i].a = m[i].a || []).push(arguments) 
        };
        m[i].l = 1 * new Date();
        
        // Проверка на дубликаты
        for (var j = 0; j < document.scripts.length; j++) { 
            if (document.scripts[j].src === r) return; 
        }
        
        k = e.createElement(t), a = e.getElementsByTagName(t)[0];
        k.async = 1;
        k.src = r;
        a.parentNode.insertBefore(k, a);
    })(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

    ym(YOUR_ID, "init", {
        clickmap: true,
        trackLinks: true,
        accurateTrackBounce: true,
        webvisor: true
    });
}

// ==================== ⏰ Виджеты по таймеру ====================
function loadTimerWidgets() {
    // Яндекс.Метрика — через 500мс
    setTimeout(loadYandexMetrika, 500);

    // Callback-виджет — через 2 секунды
    setTimeout(() => {
        loadScript('https://example.com/callback.js', {
            charset: 'utf-8'
        }).catch(error => console.warn('Callback error:', error));
    }, 2000);

    // Другие виджеты — через 2.5 секунды
    setTimeout(() => {
        loadScript('//api.venyoo.ru/wnew.js?widget_id=YOUR_ID')
            .catch(error => console.warn('Widget error:', error));
    }, 2500);
}

// ==================== 💬 Виджеты по взаимодействию ====================
let interactionScriptsLoaded = false;

function loadInteractionScripts() {
    if (interactionScriptsLoaded) return;
    interactionScriptsLoaded = true;

    // Загружаем чаты и тяжелые виджеты
    loadScript('//code.jivosite.com/widget/YOUR_ID')
        .catch(err => console.warn('Chat error:', err));
    
    loadScript('//api.venyoo.ru/wnew.js?widget_id=YOUR_ID')
        .catch(err => console.warn('Widget error:', err));
}

// Слушаем первое взаимодействие
['scroll', 'mousemove', 'touchstart', 'click'].forEach(event => {
    window.addEventListener(event, loadInteractionScripts, { 
        once: true,
        passive: true 
    });
});

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

ИИ-агенты — не хайп, а новый технологический стандарт

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

Ключевые инсайты:

🚀 Рост x30 к 2030 году. Инвестиции в ИИ-агентов вырастут с $25 млрд до $755 млрд. CAGR — 76%!

🏢 Бигтехи — драйвер рынка. В 2030 году они вложат около $360 млрд.

📈 B2B доминирует. 80% всех инвестиций идут в корпоративные сценарии — автоматизацию процессов, поддержку, аналитику.

🧱 Главный тренд — технология для технологий. 42% всех инвестиций направляются в платформы и инфраструктуру для создания агентов (AI Agent Builders).

🔮 Переход от GenAI к агентам уже начался. Многим компаниям недостаточно просто ответов — нужны системы, которые делают работу.

ИИ-агенты — это новый этап цифровой трансформации, который может «взломать рынок» уже в ближайшие 3–5 лет.

Как использовать данную информацию решайте сами, но думаю что найдутся те, кто сможет извлечь из нее пользу)
#AITools #GenAI #FastDevLab

🚨 #WebSurvival. Как ваш контент сам "сдаёт" себя поисковикам? Кейс с AI-текстом и Screaming Frog.

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

Я решил проверить его контент на "сигналы низкого качества" с помощью Screaming Frog (функция проверки грамматики) и... нашел прямые улики!

❌ Улики №1. Стилистические ошибки — "Почерк" нейросетей

Стилистические ошибки были на каждой второй странице. Это не опечатки, это ошибки, характерные для AI-моделей или неаккуратного перевода:

- Неверная капитализация после двоеточия: H1: Почему окна потеют: Анализ причин (вместо: анализ причин);
- Ошибки в списках/заголовках: Разница в температуре: Когда внутр... (вместо: когда внутр...).

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

🕵️‍♂️ Улики №2. Странный "Цифровой мусор" в коде

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

- <p dir="ltr">
- <ul data-path-to-node="17,7,1">
- <span class="citation-11">

Такие классы и атрибуты — это "цифровой мусор", который остается после экспорта из специфических LLM-интерфейсов, парсеров или корпоративных инструментов (вроде Google Docs). Чистый, ручной HTML их не содержит.

Так же у сгенерированных текстов обычно есть некая шаблонность: высокая повторяемость фраз, отсутствие уникальных insights, тонкий контент (мало глубины).

⚠️ Вывод FastDevLab: поисковик наказывает не AI, а его качество

Google и Yandex официально заявляют: мы наказываем не AI-контент, а низкокачественный контент, независимо от того, кто его создал.

Но когда ваш контент массово содержит:
- Лингвистические сбои (как "почерк" AI).
- Технический "мусор" в коде.
- Отсутствие личного опыта (E-E-A-T).

...алгоритм легко считывает это как "спам, созданный в промышленных масштабах". Именно поэтому сайт и сидит на НЧ-запросах — по ним нет конкуренции, и даже низкокачественный контент может пролезть.

🔥 Решение. Нельзя просто генерировать и публиковать! Любой AI-текст нуждается в человеческой редактуре и техническом аудите (проверке кода на мусор) перед публикацией.

❓ А вы? Проверяли ли вы свой контент на "почерк" AI? Какая самая странная грамматическая ошибка попадалась вам в нейросетях?

#AITools #SEOPractice #WebSurvival #FastDevLab

🔐 Прогноз Google Cloud по кибербезопасности на 2026 — что это значит для SEO, разработки и бизнеса

Google Cloud и Mandiant опубликовали свежий прогноз по угрозам на 2026 год. Главный вывод:
ИИ станет основным оружием и атакующих, и защитников.

⚠️ Что вас реально касается:

🤖 ИИ идёт в атаку
— массовое использование AI-агентов хакерами
— взлом ИИ через prompt-инъекции
— автоматизация фишинга и взломов
Если вы используете ИИ на сайте/в бизнесе — это новый вектор атаки.

🗣 Социальная инженерия станет идеальной
— клонирование голоса и deepfake-видео
— «директора», «менеджеры», «техподдержка» будут фейковыми
— всё меньше взлома кода, всё больше взлома людей

💣 Вымогательство + кража данных = главная угроза 2026
Обновления CMS нет → бэкапов нет → уязвимость есть = идеальная цель.

Особенно под ударом:
— сайты на CMS (WordPress, MODX и др.)
— виртуальные серверы и облака
— CRM, ERP, базы данных

🏗 Атаки смещаются с сайта на инфраструктуру
Хакеры всё чаще ломают:
— виртуализацию (VMware / гипервизоры)
— хостинг и серверы
— сетевую инфраструктуру
Один взлом = падают *десятки проектов сразу*.

🌍 Государственные атаки никуда не исчезнут
В отчёте выделены:
— Россия
— Китай
— Иран
— Северная Корея

И «обычный сайт» может оказаться частью большой цепочки атаки.


✅ Что стоит начать делать уже сейчас:

✔️ Обновить CMS / плагины / серверы
✔️ Пересмотреть доступы сотрудников
✔️ Делать офлайн-бэкапы
✔️ Включить мониторинг аномалий
✔️ Прописать план действий при взломе
✔️ Проверить всё, где используется ИИ

📌 К 2026 году кибербезопасность — это часть SEO, разработки и маркетинга.
Если сайт уязвим — вы теряете не только данные, но и репутацию + позиции в поиске.

Интересна данная тема? Если да пишите, могу сделать серию постов по этому поводу, например: как проверить безопасность сайта за 30 минут и т.п.

Оформление постов в телеграмм 🎨

Написал гайд по форматированию в Telegram (больше для самого себя, но возможно пригодится и вам).

Собрал всё: от банального жирного шрифта до скрытых спойлеров и профессиональной вёрстки для ботов.

Внутри статьи:
🔹 Все виды разметки: Markdown, HTML и горячие клавиши.
🔹 Как делать красивые списки и цитаты.
🔹 Лайфхаки: комбинируем стили (жирный + курсив) и прячем текст под спойлер.
🔹 Шпаргалка для тех, кто ведет каналы через ботов и автопостинг.

🔗 Читать гайд по оформлению: https://web-revenue.ru/smo-smm/kak-oformlyat-tekst-v-telegram
#Telegram #Копирайтинг #SMM #Оформление #Полезное