кейс

Сайт, который вы читаете, и есть кейс. В нём видео в hero на прокрутке, WebGL-инструменты и анимированная навигация — ровно то, чего советуют избегать ради скорости, — и при этом 99 баллов Lighthouse на десктопе. Страницы без видео дают 100. Этот один балл — цена видео, и она того стоила. Проверьте любое число здесь сами, в своём браузере.

  • Lighthouse, десктоп 99, с работающим видео в hero
  • Агентный просмотр в Lighthouse 3/3 — все проверки пройдены
  • Дизайн-токены ≈80 кастомных свойств, без фреймворка

  1. Задача

    Маркетинговые сайты умирают от накопления: фреймворк здесь, трекер там, библиотека каруселей — пока медианная главная бизнеса не начинает открываться секундами и тихо наказываться за это в поиске. Обычное «решение» — красивый сайт, который тормозит, или быстрый сайт, который выглядит как README.

  2. Ограничение

    Один инженер, один дедлайн и бриф, который отказывается разменивать одно на другое: сайт обязан выглядеть незаурядно — видео в hero на прокрутке, WebGL в лаборатории, анимированная навигация — и всё равно держать планку Lighthouse, которую большинство агентств обещают только на пустом шаблоне. Ни команды по производительности, ни отдельного прохода по доступности, ни бюджета на лицензионную видеотеку — все ограничения реального клиента, применённые сперва к собственной витрине студии.

  3. Решения

    Astro рендерит всё в статический HTML; JavaScript едет только для островов, которые действительно интерактивны, и грузится только когда они появляются на экране. CSS — чистый, на дизайн-токенах, а не на фреймворке: около восьмидесяти кастомных свойств управляют цветом, отступами, шрифтом и движением по всему сайту. Тяжёлое спроектировано вокруг метрик, а не вопреки им: видео в hero перематывается прокруткой, а не проигрывается само, и собрано из материала, сделанного своими силами, а не из лицензионного стока; 3D грузится лениво на своём роуте; каждая анимация стоит за prefers-reduced-motion — и это не декорация: посетитель, попросивший меньше движения, вообще не скачивает байты видео.

  4. Что стоило и что купило каждое решение

    Чистый CSS вместо utility-фреймворка стоил больше времени на старте — восемьдесят токенов пришлось спроектировать и назвать до того, как появился первый компонент, — и купил сайт, который перекрашивается через горстку переменных, а не через раскопки по разметке. Собственный движок видео на прокрутке вместо готового плагина стоил больше времени на реализацию и купил hero без веса стороннего рантайма и полный контроль над тем, что посетители с reduced-motion никогда не скачают. Зацикленные ролики для hero, сгенерированные своими силами, стоили времени на локальной GPU вместо лицензионного платежа и купили движение, подогнанное именно под эту страницу, а не растянутое под неё.

  5. Измеренная реальность

    Производительность в Lighthouse на десктопе: 99, с работающим видео в hero — не на урезанной тестовой сборке и не на пустом шаблоне; страницы без видео в том же прогоне дают 100. Агентный аудит Lighthouse — собственная экспериментальная проверка Google на то, насколько сайт читается ИИ-агентом, — проходит здесь все три проверки: корректное дерево доступности, нулевой сдвиг вёрстки и валидный llms.txt; убедитесь сами в PageSpeed Insights или в Chrome DevTools, если у вас свежий Chrome, — это минута. Весь сайт живёт в двух полных локалях с корректным hreflang. Мобильный платит за этот hero больше: видео на прокрутке нагружает радиомодуль и процессор телефона сильнее статичной картинки, и дизайн сознательно принимает более низкий мобильный балл, лишь бы не резать десктопное впечатление, — размен назван здесь, а не спрятан. Все числа на этой странице получены прогоном Lighthouse; прогоните сами и спросите с меня.

  6. Чего здесь сознательно нет

    Нет CMS. Текст живёт в коде, так что правка формулировки — это небольшой pull request, а не правка в панели, — размен, на который идёт статичный, свободный от фреймворков сайт, и о нём стоит знать до покупки. Ни один аналитический скрипт не грузится раньше первого абзаца; если клиенту нужны цифры, они берутся из серверных логов или из скрипта, который не стоит Largest Contentful Paint. И никакой охоты за последними мобильными баллами Lighthouse против видео в hero — от этой борьбы отказались сознательно, а не проиграли её случайно.

Что это доказывает для вашего проекта

«Быстро» и «незаурядно» — это инженерный выбор, а не ценовая категория. Пакет сайтов прописывает этот же целевой балл в договор именно потому, что этот сайт доказывает его достижимость, а готовность к ИИ-поиску, которую клиенты покупают отдельным аудитом, — schema, llms.txt, доступ краулеров — здесь встроена в каждую сборку с первого коммита. Как устроены договор, этапы оплаты и гарантия — на странице Доверие и процесс , а где стоит эта ступень — на полной лестнице цен .

Готов, когда готовы вы

Напишите два предложения о том, что вы пытаетесь сделать. Получите прямой ответ — включая «для этого я вам не нужен», если это правда.

Обсудить задачу

Договор и NDA до начала работ (кроме аудита) · оплата по этапам, обычно 30/40/30 · 30 дней гарантии · зарегистрированный ИП, Армения · GMT+4, часы ЕС · Доверие и процесс