Реальный кейс с nested grids в GridStack:
— почему подход на addGrid() привёл к ручной синхронизации DnD, проблемам с lifecycle и множеству фиксов;
— как переход на subGridOpts упростил архитектуру и сделал поведение стабильным.
Итак, разбираем реальные сценарии, роли судей и организаторов, ночные нюансы и архитектуру SPA с оффлайн-синхронизацией.
Подходит к концу лето 2026 года. AI‑агенты, вайб-кодинг, Docker и тонны фреймворков, библиотек и примеров для всех современных платформ. Микросервисы — цель, икона и грааль как в разговорах, так и в требованиях к кандидатам. В одиночку можно быстро поднять работающий проект, подключить к нему ИИ и выложить для использования.
Наконец-то закончилась волна входа в IT с бесконечными полусырыми курсами и инфоцыганскими каналами для вайтишников. Как-то поуспокоилось.
Но есть ряд вопросов: не тратит ли разработчик больше времени, сражаясь с настройками контейнеров для разработки или с тем же Webpack, чем на написание самого кода? Сколько нужно знать, чтобы написать простое веб-приложение? Каково минимальное количество библиотек и фреймворков нужно для этого? Всегда ли нужны микросервисы?
Именно такие вопросы давно и регулярно всплывали в разговорах с коллегами и для ответа на них был сделан небольшой проект — чисто эксперимента ради. О нём я и хочу рассказать. Что-то будет разбираться очень подробно, а что-то пройдём мимо — это не обучение, это результат эксперимента.
Часть 1. Как я делаю backend для браузерной игры три в ряд: server-driven персонажи и способности, общий контракт клиента и сервера, версионирование контента, транзакции, идемпотентность и админка.
Привет, Хабр! Меня зовут Эрнест Гилязов, я тимлид группы разработки интерфейсов Рунити. В этой статье расскажу, как мы переносим на новый стек проект Рег.ру, кодовой базе которого исполняется 20 лет, и почему в итоге Nuxt-приложение само раздает шапку и футер в легаси-монолит через обычный JSON-эндпоинт.
Как я сделал браузерную 3D-игру на Three.js и Vue: система аномалий, GLB-сцена, PS1-рендеринг и оптимизация под слабые устройства.
Тридцать лет я собирался написать игру, а потом за десять рабочих сессий довёл до продакшена браузерную Hexnome: 3D-поле, одиночный режим, онлайн-мультиплеер и серверный журнал команд. Получилось 245 промптов и 99 коммитов в основной ветке. Ещё 30 коммитов пришлось выбросить, когда первая архитектура мультиплеера оказалась «играбельной, но ненадёжной». Рассказываю, что именно ускорил AI — и какие решения он за меня не принял.
Vue снова меняет способ обновления интерфейса: теперь на горизонте Vapor и рендеринг без Virtual DOM. Зачем очередная архитектурная перестройка и что не устраивает команду Vue в нынешнем подходе?
Чтобы ответить, проследим путь Vue от Object.defineProperty до Proxy и зачем теперь понадобился Vapor. Это поможет лучше понимать поведение ref, reactive и computed, вникнуть в причины архитектурных изменений Vue и подготовиться к дальнейшим изменениям.
Может ли лишняя запись в yarn.lock повесить браузер? Наша прожила в репозитории три месяца, не привлекая внимания, а потом ночью после релиза положила прод вечным лоадером - причём только в Chromium. Рассказываю, как мы шли к разгадке через ложные следы и что в итоге оказалось в рантайме.
Разработчик интерфейсов уверен, что выбранный им фреймворк автоматически решает за него вопросы структуры и организации кода. Он искренне верит, что если взять React, Angular, Vue, да тысячи их, то получает в руки серебряную пулю, которая закроет все проблемы разработки. Достаточно следовать документации фреймворка, и с проектом все будет хорошо в долгосрочной перспективе. И я сам долгое время рассуждал точно так же, я воспринимал только Angular, потому что там есть хоть какой-то структурный подход. На практике это оказывается большим заблуждением.
Год назад я написал здесь, что собрал на PHP/Laravel AI-агента, который способен рассуждать в циклах, потестил и остановился со словами «работает, но нужны идеи помощнее». Нужно что то необычное, новое.За год прототип оброс несколькими видами памяти, RAG, оркестрацией, зрением, голосом — и слоем, который даёт агенту что-то похожее на внутреннее состояние. Рассказываю, что выросло. Получился DepthNet 1.0
Привет, меня зовут Сергей Цибульченко, я fullstack‑разработчик. На хабре уже есть несколько статей про PWA, но они не раскрывают всех подводных камней данной технологии, я с этим лично столкнулся когда делал пет‑проект по этим статьям.
Для начала, что такое PWA? Это веб‑страница которая выглядит и ведёт себя как приложение, но при этом имеет технические ограничения веб‑страницы.
Привет, друзья! Меня зовут Наталья и я frontend‑разработчик в компании SimbirSoft.
Когда‑то в 2020 году микрофронтенды были модой. Чуть ли ни каждый хотел почувствовать себя всемогущим и попробовать разделить монолит на части, а также получить от шефа премию или эмоциональное поглаживание и картонку с надписью «Спасибо» (если повезет, то отдадут прямо с рамкой). Затем забыли про них и, но недавно в компанию пришла потребность разработки сайта с архитектурным паттерном «Микрофронтенды». Всех обязали вспомнить или узнать что же такое микрофронтенды? Чушь или все‑таки необходимость? Давайте разбираться.
По мере роста проектов мне как Vue‑разработчику уже неоднократно приходилось сталкиваться с вопросом: как разделить фронтенд между несколькими командами так, чтобы они меньше зависели друг от друга?
Одним из вариантов остаются микрофронтенды. В статье я разберу Module Federation 2.0 для Vue 3 + Vite, изоляцию стилей и состояния, способы коммуникации между remotes и то, что происходит с этой архитектурой, когда в проекте появляется SSR и Nuxt 4.
Статья будет полезна разработчикам и техлидам, которые рассматривают разделение крупного фронтенда между несколькими командами. А если вы пока только знакомитесь с микрофронтендами, основные понятия я тоже постараюсь объяснить по ходу статьи.
Сначала разберём Module Federation для Vue 3 + Vite, затем — изоляцию стилей и состояния, коммуникацию между приложениями, SSR в Nuxt 4 и роль host‑приложения в маршрутизации.
В конце оставлю короткий чек‑лист, по которому можно оценить, готов ли проект к такому переезду. Спойлер: микрофронтенды — это не «следующий уровень» архитектуры, а инструмент с довольно конкретной областью применения. И понимать, когда он не нужен, не менее важно, чем уметь его настроить.
Добавить на страницу новые функции, не трогая саму страницу, звучит как противоречие. Но альтернативу мы посчитали командой: полное переписывание заняло бы год, в течение которого страница не получила бы ни одной новой функции. Мост между старым кодом и новым занял два месяца, и строил его уже я один. Расскажу, как этот мост устроен, почему получился несимметричным, где чуть не зациклился и что в нём так и осталось кривым.
Каждые пять лет я слышу одно и то же: фронтенд больше не нужен, ему остался последний год. Сначала говорили про визуальные конструкторы - Wix, Tilda, все дела. Потом, когда ИИ выстрелил, начали хоронить разработчиков под флагом «AI напишет тебе кнопку за секунду». А сейчас новая мода - фулстекеры. Приходят такие ребята и говорят: «Да зачем нам отдельный фронт, я сам и бэк, и фронт на коленке соберу, проект сэкономит, все будут счастливы».
Давай просто выдохнем и разберемся, что на самом деле происходит, без паники и хайпа.
Nuxt 4.5 это действительно крупный релиз. В нём обновили сразу три ключевых компонента системы сборки: Vite 8, Rspack 2 и совершенно новый пайплайн на базе Rsbuild для сборщика Rspack.
Также появились экспериментальный режим потокового SSR, стабильная система кодов ошибок, несколько новых composables и соглашений, а ещё множество внутренних улучшений, которые приближают нас к Nuxt 5.
JWT не защищает от кражи. Подпись гарантирует, что токен не подделан, но не мешает злоумышленнику использовать его, если тот оказался в чужих руках. В 2026 году утечки токенов через XSS, логи и CDN-атаки входят в тройку самых частых векторов компрометации, а медианное время обнаружения такой кражи составляет 43 дня.
В этой статье разбираем полный жизненный цикл токена — от выдачи до отзыва. Сравниваем хранение в localStorage, HttpOnly-куках и BFF-прослойке. Объясняем, почему Refresh Token Rotation — это must-have, а не опция, и как детектировать кражу еще до того, как злоумышленник успеет навредить.
Копипаста редко выглядит как копипаста. После переименования переменных, строк и чисел два одинаковых блока спокойно проходят ревью как разный код. Я написал clone-alert, чтобы находить такие совпадения в TypeScript, JavaScript и шаблонах Vue, Svelte и Angular.
На Хабре вышла хорошая статья «Нужен ли здесь useEffect?»: 12 сценариев из code review, в которых эффект либо не нужен, либо нужен не такой.
Я пишу на $mol и читал её как этнограф. в моле нет API эффектов. Во что превратятся все 12 демо, если их переписать ? Посмотрите ?. Сделал страницу с демками.
Спойлер: чек-лист из 12 строк в конце схлопнулся в …
В этой статье я хочу поделиться своим подходом к решению задачи виртуализации списка элементов неизвестной высоты. Популярные библиотеки решают эту задачу с помощью приблизительных оценочных размеров с последующими замерами и корректировкой. Я хочу описать метод, основанный на привязке индексов к положению скроллбара, который позволяет достаточно точно позиционировать видимый диапазон элементов, при этом, не зная даже приблизительных размеров всех предыдущих элементов, используя только простую математику и родные механизмы позиционирования и разметки браузера.
С примерами работы на TypeScript, React, Vue и Angular можно ознакомиться на домашней странице проекта Layout Virtual.
Репозиторий с проектом тут.
