Skip to content

Headless Magento в 2026: полный и честный гид

Все, кто продаёт headless Magento, говорят, что он быстрее и гибче. Почти никто не говорит, что реально ломается по пути и когда ваша текущая тема всё ещё правильный выбор. Вот честная версия.

Headless-витрина на бэкенде Magento на десктопе, планшете и телефоне, с каталогом, страницей товара и корзиной, соединённая с бэкендом через слой GraphQL API
Автор:Опубликовано:Обновлено:Время чтения:12 мин чтения

Senior Frontend Architect, 10+ лет опыта построения production-проектов на Next.js. Contentful Certified Professional (2024). Специализация: React Server Components, headless eCommerce, инженерия Core Web Vitals.

Ищете гид по headless Magento — и получаете их стену, почти все написаны агентствами, чей бизнес — выставлять вам счёт за часы разработчиков. Это диктует, что вам говорят: делать нужно всё, всё сложно, и ответ всегда — ещё часы. Этот гид написан с другой стороны, тем, кто собирает витрины, поэтому может позволить себе прямоту: когда headless Magento окупается, когда нет и где прячется реальная цена. Без лишнего жаргона и без попыток выставить всё сложнее, чем оно есть.

Что вообще значит headless Magento?

Ваш магазин — это две системы, соединённые вместе. Magento — это бэкенд: товары, цены, склад, акции, заказы и админка, где ваша команда работает каждый день. Витрина — половина с лицом: листинги категорий, карточки товара, поиск, корзина и оформление. В обычном магазине Magento они идут одним пакетом, и тема Luma решает, насколько магазин быстрый и гибкий. Headless их разделяет. Вы оставляете Magento нетронутым и заменяете витрину темы кастомным фронтендом, который берёт данные из GraphQL-API Magento. Команда по-прежнему ведёт всё из той же админки Magento. Меняется только слой, на который смотрит покупатель, а именно он и решает, как быстро грузятся страницы, как выглядит магазин и сколько посетителей действительно покупают.

Сколько на самом деле стоит медленный магазин на Magento?

Цифры не мягкие. Собственные данные Google, опубликованные на web.dev, показали: у сайтов, проходящих пороги Core Web Vitals, на 24 процента ниже доля посетителей, уходящих со страницы до того, как она вообще загрузилась. Исследование Portent измерило сторону конверсии: конверсия магазина падает примерно на 4,42 процента с каждой лишней секундой загрузки в первые пять секунд. Deloitte показал, что эффект работает и в обратную сторону, причём в масштабе, который должен беспокоить любого, кто сидит на тяжёлой теме: сокращение загрузки на десятую долю секунды сдвинуло розничную конверсию вверх на 8,4 процента. Тема Luma, отягощённая расширениями и серверным PHP, — ровно та витрина, что теряет эти секунды, и по моему опыту секунды уходят на категориях и карточках товара, там, где покупка и происходит.

Больше всего это видно на больших каталогах, и Google публикует, сколько починка принесла некоторым из них, в собственной библиотеке кейсов. Redbus увёл CLS с 1,65 в ноль и сообщил о росте мобильной конверсии на 80 — 100 процентов. AliExpress улучшил CLS десятикратно и LCP вдвое, получив на 15 процентов меньше отказов. Tokopedia срезала LCP на 55 процентов, и сессии стали длиннее на 23 процента. Cdiscount провёл Чёрную пятницу после работы над скоростью и сообщил о 6 процентах дополнительной выручки. Это их магазины и их цифры, а не прогноз для вашего, но они показывают порядок величины, о котором идёт речь. Если Search Console уже вас помечает, как читать проваленную оценку Core Web Vitals разбирает, что на самом деле говорит отчёт, прежде чем вы потратите хоть копейку на переделку.

Adobe Commerce, Open Source или Mage-OS: это меняет сборку

Magento — это не один продукт, и редакция, которую вы используете, меняет то, что должна сделать headless-сборка, особенно вокруг stored value. Adobe Commerce поставляет гифт-карты и store credit, но не имеет чистого API, чтобы создавать их headless, поэтому этот разрыв нужно закрывать. У Open Source и Mage-OS вообще нет ни гифт-карт, ни store credit, ни механизма наград, поэтому инструмент приходится давать целиком. Именно такая деталь никогда не попадает в презентацию продаж, а потом съедает две недели в середине проекта. Витрина, собранная под реальный Magento, закрывает это небольшим модулем-компаньоном на редакцию: одним для Adobe Commerce и одним для Open Source и Mage-OS, отдавая одни и те же маршруты, чтобы фронтенду было всё равно, какая редакция стоит за ним.

Stored value различается по редакции Magento, поэтому гифт-карты и лояльность в headless-сборке требуют моста под каждую редакцию.
РедакцияВстроенный stored valueHeadless API созданияЧто добавляет темплейт
Adobe CommerceГифт-карты и store creditНетМодуль Samcheek_HeadlessLoyalty для создания их headless
Magento Open SourceНетНетМодуль Samcheek_TenderInstrument, дающий инструмент
Mage-OSНетНетМодуль Samcheek_TenderInstrument, дающий инструмент

Сложные части, которых нет в презентации продаж

Headless Magento сложен не из-за витрины. Он сложен из-за швов, где витрина встречается с бэкендом, который никогда не проектировался как headless. Вот части, что тихо съедают бюджет:

  • Checkout. В отличие от Shopify, который передаёт оформление своему хостовому checkout, checkout Magento — ваш, целиком headless, включая интеграцию платёжного шлюза. Это самый большой кусок работы и тот, что большинство гидов проскакивает. Здесь же и больше всего денег: Baymard оценивает среднюю долю брошенных корзин в 70,22 процента, главной причиной называет неожиданные доплаты при оформлении, её указывают 48 процентов покупателей, и оценивает выигрыш только от лучшего дизайна оформления в 35,26 процента конверсии для среднего крупного магазина. Владеть checkout — это работа, но это же и возможность.
  • Типизированный GraphQL. Схема GraphQL у Magento большая и неровная. Без кодогенерации и типизированного слоя данных каждый запрос — место, где может спрятаться рантайм-ошибка. Полный гид по сборке Next.js commerce показывает ту же дисциплину от начала до конца.
  • SEO и канонические URL. Headless-переделка — это место, где позиции тихо умирают, если метаданные, карты сайта, разметку и канонические URL для вариантов товара не перенести точь-в-точь. Это незаметно, пока через месяц не упадёт трафик.
  • Гифт-карты и лояльность как тендер, а не скидка. Оплата баллами или гифт-картой должна уменьшать тендер, а не налогооблагаемую базу. Считать это скидкой — значит недобирать налог с каждого заказа, а это реальная ответственность, не погрешность округления.
  • Возвраты и рефанды. Витрина, которая владеет checkout, должна владеть и путём рефанда обратно в Magento, а это требует админ-токена и аккуратной идемпотентной обработки, чтобы повтор никогда не вернул деньги дважды.
  • Производительность. Весь смысл headless — скорость, поэтому границы бандла, image pipeline и кэширование нужно проектировать, а не предполагать. Планка опубликована и конкретна: чтобы пройти, Google хочет largest contentful paint меньше 2,5 секунды, interaction to next paint меньше 200 миллисекунд и cumulative layout shift меньше 0,1, причём измеренные по 75-му процентилю реальных визитов, а не в лаборатории. Ошибитесь тут — и получите headless-магазин, который каким-то образом медленнее темы, что вы оставили.

Как production-темплейт делает headless Magento

Смысл собирать на протестированном темплейте, а не с чистого репозитория, простой: каждая из сложных частей выше уже собрана, уже протестирована и включается конфигом, поэтому деньги идут в ваш магазин, а не в переделку сантехники. Темплейт headless-коммерции работает с Magento по GraphQL с кастомным checkout, типизированным слоем данных, встроенным SEO и тендером гифт-карт и лояльности по редакции Magento. Та же витрина работает и на Shopify сменой одного значения конфига, поэтому платформа остаётся решением, к которому можно вернуться позже, а не стеной, об которую строишься. Он идёт с 460+ автотестами, доступностью WCAG 2.2 AA, проверяемой на каждом изменении, гейтами Lighthouse по производительности и SEO и связкой Docker плюс Redis для нескольких реплик за балансировщиком. Посмотреть в работе можно на живом демо.

  • Быстрые страницы по умолчанию. Core Web Vitals в зелёной зоне и гейты Lighthouse в CI, которые держат их такими, чтобы скорость, за которую вы заплатили, не осыпалась тихо после запуска.
  • Ваш Magento нетронут. Товары, заказы, акции и админка остаются ровно там, где команда уже работает. Меняется только витрина.
  • Гифт-карты и лояльность сделаны правильно. Обрабатываются как настоящий тендер по редакции, с небольшим модулем-компаньоном для Adobe Commerce и одним для Open Source или Mage-OS, так что фронтенд одинаков на обеих.
  • Дизайн полностью ваш. Цвет, типографика и отступы живут в токенах, а не внутри компонентов, поэтому ребрендинг — это файл значений, а не проход по всем стилям.
  • Одна витрина, любой бэкенд. Тот же магазин работает на Magento или Shopify, поэтому будущая смена платформы не значит выбросить витрину.

Когда headless Magento не оправдан

Есть вариант ответа, который ничего не стоит: не делать. Если Luma отрисовывает ваш каталог достаточно быстро, полевые данные зелёные, а дизайн делает то, что просит маркетинг, — фронтенд не то, что держит магазин, и заменять его значит купить себе обслуживание вместо продаж. То же с молодым магазином, где каталог тонкий, а трафика мало: там ограничение в том, чтобы понять, что вообще покупают, и слой рендеринга на это не отвечает. Сигнал к действию уже, чем обещает продажа: витрина, которая в ваших собственных цифрах выглядит потолком. Честная смета говорит об этом раньше, чем начинает про архитектуру. Если хотите такой разбор по своему магазину, бесплатный аудит сайта вернёт ваши полевые данные и стоящие за ними проблемы страниц для любого URL, а разбор headless-архитектуры покрывает более глубокую работу с рендерингом и взаимодействием.

Будут ли мои расширения Magento работать после перехода на headless?

Зависит от того, за какую половину расширения вы на самом деле платите, и разделение тут чище, чем принято думать. Всё, что работает за админкой, продолжает работать без изменений: синхронизация с ERP и учётом, налоговые движки, серверная обработка платежей, инструменты импорта, отчётность, логика склада и остатков. Ничего из этого никогда не знало, что витрина существует. Всё, чья ценность - отрисованный интерфейс, не выживает, потому что headless-витрина никогда не грузит шаблон Luma, и PHTML-файлам, layout XML и Knockout-виджетам просто не к чему прицепиться. Решает бюджет средняя категория: расширения, которые добавляют данные к товарам или заказам и ждут, что фронтенд их покажет. Полезная проверка - собственное правило Adobe. Модуль обязан положить файл schema.graphqls в свою папку etc, чтобы определить запросы и указать на резолверы, и Adobe отмечает, что если все атрибуты модуля - это extension attributes для уже существующих модулей, отдельное определение запроса не требуется. Расширения, сделанные так, часто переезжают вообще без работы. Тем, кто никогда не выставлял GraphQL наружу, эту поверхность нужно написать, и это строка в смете, которую считают до старта проекта, а не обнаруживают на второй месяц.

  • Переезжает без изменений: Синхронизация с ERP, учётом и PIM; расчёт налогов; серверные платёжные шлюзы; админские и отчётные инструменты; логика склада и остатков; всё, что крутится на cron.
  • Не выживает: Расширения темы; page builder'ы, привязанные к Luma; фронтовые слайдеры, попапы и мега-меню; всё, чей результат - PHTML-шаблон или Knockout-компонент. Витрина пересобирает это поведение в своих компонентах.
  • Проверять по одному: Расширения, добавляющие кастомные атрибуты товара, кастомные поля заказа, балансы лояльности, B2B-правила цен или сообщения об остатках. Спросите вендора, поставляет ли модуль GraphQL-схему, и если нет, резолверы кому-то придётся написать.
  • Сделайте инвентаризацию до того, как брать смету: Выгрузите список модулей из админки, разложите по этим трём корзинам и считайте только третью. Этот список обычно заметно короче тревоги вокруг него, и это единственная часть вашего парка расширений, переезд которой стоит денег.

PWA Studio от Adobe - более безопасный выбор, чем кастомный фронтенд?

Это реальный вариант, и он не заброшен, что бы вы ни читали. Последний релиз PWA Studio в собственном репозитории Adobe - v14.5.1 от мая 2026 года, так что фраза «PWA Studio мёртв», которая ходит по агентским блогам, просто устарела. Настоящий выбор не про выживание, а про соответствие. PWA Studio отдаёт вам поддерживаемую Adobe React-витрину с уже подключённым слоем данных Magento, что снимает большой кусок интеграционной работы и оставляет вас внутри стека, который Adobe поддерживает. Взамен вы берёте на себя его соглашения: структура компонентов Venia и хуки Peregrine принадлежат PWA Studio, а не React как таковому, из-за чего сужается круг разработчиков, способных быстро в нём двигаться, а дизайн, уходящий от дефолтной темы, стоит дороже, чем кажется. Кастомная витрина на Next.js переворачивает обе стороны: интеграцию вы строите сами, зато любой нанятый React-разработчик уже знает идиомы этого кода.

  • PWA Studio подходит, когда: Вы на Adobe Commerce, хотите остаться внутри поддерживаемого вендором стека, ваш дизайн близок к обычной коммерческой раскладке, и у вас есть или наймутся люди, знающие его соглашения.
  • Кастомная витрина подходит, когда: Дизайн - ваше отличие, нужен контроль над рендерингом, чтобы держать Core Web Vitals, нужна возможность сменить коммерческий бэкенд позже, или вы предпочитаете нанимать с общего React-рынка, а не из нишевого.
  • Швы одинаковы в обоих случаях: Чекаут, налог на оплату подарочной картой, возвраты и канонические URL сложны потому, что бэкенд - Magento, а не из-за фронтенд-фреймворка. Готовыми их не отдаёт ни один фреймворк.
  • Утверждение, которому не стоит верить: Кто говорит вам, что один вариант мёртв, а другой - короткий путь, тот что-то продаёт. Проверьте историю релизов сами, а потом решайте по найму и дизайну, потому что выбор держится именно на них.

Помогает ли headless Magento SEO и AI-поиску?

Да, когда сделано правильно, и по двум причинам. Google ранжирует с оглядкой на удобство страницы, поэтому витрина, проходящая Core Web Vitals там, где Luma не проходила, снимает штраф, который тема накладывала на каждую вашу позицию. Вторая причина в том, что предсказуемую семантическую разметку ассистент способен разобрать и процитировать, а всё больше решений о покупке теперь начинается с вопроса к нему, а не с прокрутки десяти синих ссылок. Что стоит знать, прежде чем вам продадут «AI-пакет»: документация Google по AI-функциям говорит, что дополнительных требований и особой разметки нет, нужны лишь страницы, которые проиндексированы, доступны для обхода и держат содержимое настоящим текстом. То есть та же инженерия, а не отдельный продукт. Оговорка в том, что небрежная headless-переделка может, наоборот, убить SEO, потеряв канонические URL и разметку, поэтому их перенос здесь — основная работа, а не мысль напоследок. Для более широкой технической картины архитектура enterprise-коммерции разбирает, как части складываются на масштабе.

Могу ли я оставить Magento и всё равно получить быструю витрину?

Именно это headless и даёт. Вы оставляете Magento как бэкенд, а команда — привычную админку, тогда как обращённая к покупателю витрина становится быстрым кастомным фронтендом, читающим из Magento по GraphQL. В том, как вы ведёте бизнес, ничего не меняется. Дорогая, обращённая к покупателю половина магазина модернизируется без рискованной миграции платформы, и, поскольку та же витрина работает и на Shopify, вы не заперты, даже если позже смените бэкенд под ней. Можно посмотреть production-кейсы, чтобы увидеть подход в контексте.

Как это реально получить?

Начните с живого демо и темплейта headless-коммерции, чтобы увидеть, что входит в готовую сборку. Если подходит, темплейт подключается к вашему Magento и запускается за часы, а не за месяцы, потому что сложные части уже собраны и протестированы. Когда будете готовы обсудить свой магазин, редакцию и ограничения, свяжитесь, и мы разберём, headless ли правильный выбор для вас прямо сейчас или у текущей темы ещё есть запас.

Похожие статьи

Стоит ли переходить на headless-коммерцию? Гид для владельца магазина (2026)

Вам постоянно советуют «уйти в headless», но почти никто не объясняет, что это значит для того, кто за это платит. Это простой гид для владельца магазина, без жаргона. Что такое headless-коммерция, когда она окупается, а когда нет, что она делает со скоростью и позициями в Google, работает ли с Shopify и Magento, и что вы реально получаете с готовой витриной на протестированном production-темплейте, который подключается к вашему бэкенду и запускается за часы.

HeadlesseCommerceShopify
Читать статью

Цена headless Shopify в 2026: сколько это реально стоит

Почти все страницы про цену headless Shopify — это замаскированные заявки на расчёт. Эта разбирает стоимость честно: сколько на самом деле берёт платформа Shopify, почему фреймворк и хостинг бесплатны, из чего складывается диапазон сборки агентства и почему, какие скрытые постоянные расходы почти никто не перечисляет, и как протестированный темплейт витрины превращает месяцы кастомного проекта в стоимость подключил-и-запустил за часы.

HeadlessShopifyShopify Plus
Читать статью

Headless Shopify на Next.js: полный гайд по архитектуре (2026)

Практический гайд по построению продакшн headless Shopify-стора на Next.js App Router. Три API-уровня Shopify, типизированный GraphQL data layer, генерация каталога через generateStaticParams + ISR, механика Cart API с cookies, OAuth PKCE для Customer Account API, SEO для вариантов продуктов и производительность - с референсами из реальных продакшн-реализаций.

ShopifyNext.jsHeadless
Читать статью