Обновить
128K+

JavaScript *

Прототипно-ориентированный язык программирования

173,95
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

o2 game engine

Время на прочтение9 мин
Охват и читатели18K

Привет, хабр! Уже 11 лет я пилю свой игровой движок, и я готов представить его публике. Я все еще дорабатываю его, но он уже вполне стабилен и я делаю игры на нем.

Движок открытый и бесплатный, нацелен преимущественно на мобильные игры, поддерживает пачку платформ — ios, android, web, mac, windows, linux. Он компактный (всего несколько мегабайт), производительный, позволяет писать логику игры как на C++, так и на JavaScript. Внутри есть убер‑редактор для всего — вот он на скриншотике выше

На мой взгляд, лучший способ рассказать о технологии — показать демо и рассказать как все устроено внутри. Под катом ссылки на репозиторий и демки (под веб), а также асскажу как он устроен внутри. Велкам!

Читать далее

Больше свободы агентам — жёстче проверки: линтинг React 19 на ESLint 10

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели8.2K

Чем больше автономии я даю ИИ-агентам, тем больше требований к коду превращаю в механические проверки. Когда eslint-plugin-react сломался на ESLint 10, я собрал продолжение для React 19: сократил 102 активных правила до 11 и исправил ошибки, которые проявились только в реальных проектах.

Читать далее

Пагинация. Ошибки тестирования списков и курсоров

Уровень сложностиСредний
Время на прочтение11 мин
Охват и читатели12K

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

Проверить пагинацию

Как не ошибиться при работе с датами и временем. Разбираем все нюансы и ограничения

Уровень сложностиСредний
Время на прочтение15 мин
Охват и читатели7.6K

Всем привет! Меня зовут Денис Смирнов, больше шести лет я работаю в компании iSpring и участвую в разработке нашего основного продукта — платформы для онлайн-обучения. Особенность платформы в том, что в ней достаточно гибко настраивается работа с датой и временем. Часовые зоны (таймзоны) можно указать на уровне аккаунта, тогда каждый пользователь может выбрать собственный часовой пояс. В некоторых модулях их можно дополнительно переопределять для отдельных пользователей.

Читать далее

Как мы переводили страницу объявления на Beduin в мобильной версии Авито

Уровень сложностиСредний
Время на прочтение11 мин
Охват и читатели7.9K

Всем привет! Меня зовут Егор Савинцев, я Frontend Platform Engineer в Авито. Сейчас я работаю в команде архитектуры, а до этого в команде Phobos в рамках Платформизации переводил страницу объявления на Beduin — разрабатывал клиентскую архитектуру и переписывал блоки. 

Сразу важное отступление. 

Beduin — это Backend‑Driven UI. Если в нативе в коде клиентского приложения есть компоненты, бэкенд присылает им данные, и всё работает. В Beduin бэкенд присылает и данные, и сами компоненты в специальном виде. На клиенте у нас только рендерер — специальный компонент, который принимает JSON и рендерит то, что мы прислали. 

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

Статья будет полезна frontend‑ и mobile‑разработчикам, инженерам платформенных команд, архитекторам клиентских приложений и backend‑разработчикам, которые внедряют Backend‑Driven UI. В общем, всем, кто планирует переводить крупные экраны на BDUI и хочет заранее узнать, что может пойти не так. Спойлер: всё.

Читать далее

Bun в 2026

Уровень сложностиСредний
Время на прочтение9 мин
Охват и читатели6.6K

2026 год стал переломным для Bun. Переписывание на Rust с помощью Claude Fable 5 за 11 дней показало новые возможности AI-ускоренной разработки, а 20 августа 2026 вышел Bun v1.4 — первый production-релиз, полностью работающий на Rust-версии рантайма (до этого Rust использовался только внутри, например в Claude Code). Версия 1.3.14 добавила Bun.Image, HTTP/3 и Global Virtual Store, а v1.4 принесла резкий скачок совместимости с Node.js и десятки новых встроенных API. Bun стал частью Anthropic после приобретения в декабре 2025.

Читать далее

Playwright для компонентных CAT-тестов в проекте на angular

Уровень сложностиСредний
Время на прочтение32 мин
Охват и читатели3.6K

Когда говорят «у нас есть тесты на Playwright», обычно представляют классический e2e-сценарий: тест открывает приложение, проходит авторизацию, переходит по нескольким страницам и работает с настоящим или почти настоящим backend.

Мы используем Playwright немного иначе.

Основной пласт UI-автоматизации в нашем Angular-проекте — это CAT-тесты. CAT в данном случае расшифровывается как component autotest. Мы поднимаем отдельный компонент или целую бизнес-форму в Storybook, открываем её в настоящем Chromium, выполняем пользовательские действия, управляем HTTP-ответами и сравниваем интерфейс с эталонными снимками.

Получается тест, который находится между unit и e2e:

Читать далее

Как я запарился считать плитку для ванной и написал свой калькулятор раскладки

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели7.2K

Затеял ремонт в ванной, дошёл до плитки — и тут понеслось. Санузел у меня Г‑образный, в углу венткороб, раскладку хочу диагональную, а «раздели площадь на плитку» вообще не работает, я это понял когда мои циферки не сошлись с тем что плиточник насчитал — разница набежала непонятно откуда.

Плиточник говорит — берите пятнадцать процентов запаса и всё. Пятнадцать процентов от плитки по 2000 с лишним за метр это уже сумма, я в столбик посчитал и решил что нет, надо по‑другому. Калькуляторы онлайн — площадь на цену умножают, я и сам умею. В CAD полез — там сначала модель строй, а мне не чертежи нужны были.

Написал своё в итоге, дальше расскажу что вышло, скрины ниже, там понятнее чем я объясню.

Читать далее

DI во фронтенде: от Context API к Composition Root

Уровень сложностиСредний
Время на прочтение14 мин
Охват и читатели5.7K

Современные веб-приложения содержат сложную бизнес-логику, которая ранее традиционно располагалась на бэкенде. С ростом сложности возникает необходимость в эффективном управлении зависимостями для поддержания тестируемости, модульности и слабого зацепления этих модулей в приложении. Принцип Инверсии зависимостей (Dependency Inversion, DIP) и его реализация в лице механизма Внедрения зависимостей (Dependency Injection, DI) становится ключевым инструментом для решения этих задач.

Читать далее

Платформер в стиле DOOM: портируем старую курсовую на чистый JavaScript

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели12K

Несколько лет назад у нас с одногруппником был зачёт по C++, и вместо того чтобы сделать что-то скромное (например, «Калькулятор» или «Генератор паролей»), мы, конечно же, решили замахнуться на какую-то игру, и тогда нам попалась новость о 30-летнем юбилее игры DOOM. План был красивый, т. к. на тот момент командной работы у нас не было, мы решили, что мой одногруппник пишет псевдо-3D-движок в духе классического рейкастинга, а я делаю 2D-платформер, который в итоге должен был запускаться прямо внутри его мира, как игровой автомат, который запускался бы перед игрой, и сколько патронов ты собрал, столько у тебя и будет в игре.

Проблема появилась не в архитектуре и не в гейм-дизайне, а гораздо раньше — на этапе, который мы оба благополучно пропустили: мы не договорились, на чём пишем. Я по рекомендации преподавателя взял SFML — с ним я уже возился на парах, там всё human-readable, спрайты, окна, звук из коробки. Товарищ выбрал SDL, т. к. видел гайд про DOOM на SDL — она даёт прямой доступ к буферу пикселей, что для рейкастинга буквально то, что нужно: рисуешь вертикальные полоски стен вручную, без лишней абстракции между тобой и экраном.

По отдельности оба выбора были правильными, а вместе — нет. Слинковать в одном проекте SDL и SFML можно, но два разных event loop, два разных подхода к окну и таймингу — это уже не работа для автомата по зачёту, а отдельная курсовая работа, на которую у нас оставалось дня два-три. Мы посчитали и сдали как два независимых проекта. Препод посмотрел, оценил — и выдал ровно ту фразу, которую в такой ситуации выдал бы любой человек, который знал о проекте: «Идея классная, жалко, что не объединили», но нам это было неважно на тот момент, как говорится, зачёт получили — и на этом спасибо.

Читать далее

React Native в 2026 году: New Architecture, нативный код и AI в реальном проекте

Уровень сложностиСредний
Время на прочтение14 мин
Охват и читатели7.3K

React Native по-прежнему часто описывают формулой «один код для iOS и Android». В 2026 году она звучит слишком просто. Современное приложение на React Native — это общий продуктовый слой на TypeScript, нативный интерфейс, Hermes, Fabric, JSI, фоновые процессы, platform-specific код и довольно много решений о том, где именно должна выполняться каждая задача.

Мы столкнулись с этим в Synchra.24 — мобильном приложении для линейных и распределённых команд. В проекте больше тысячи TS/TSX-файлов и свыше ста экранов, но рядом с ними живут Kotlin и Swift: геопозиция, push-уведомления, биометрия, системные виджеты и работа с медиа. Это не история о функциях нашего продукта и не попытка его рекламировать. Это разбор того, чем на практике стала разработка на React Native к 2026 году — и какую часть этой работы действительно можно поручить нейросетям.

Читать далее

Shadow AI — почему инженеры скрывают, что пользуются ИИ

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели7.9K

Слушал подкаст Code of Leadership, выпуск про AI-assisted engineering. Полтора часа про то, как правильно встроить ИИ в разработку: копайлоты, MCP, метрики, место ИИ в SDLC. Разговор хороший, по делу. И где-то в середине проскочил термин, за который я зацепился и с которым хожу уже неделю — shadow AI. Проскочил сноской, в ряду прочих ИБ-рисков, между утечками и комплаенсом.

А я на этой сноске завис. Потому что мне кажется, что она интереснее основного разговора...

Читать далее...

От одного npm‑пакета к кластеру Contagious Interview: практическое расследование supply chain‑кампании

Уровень сложностиСложный
Время на прочтение6 мин
Охват и читатели7.2K

В прошлой статье я рассказывал о случайно попавшем ко мне образце ChainVeil - вредоносном ПО из источника, который на тот момент не был зафиксирован в публичных исследованиях.

На этот раз первым сигналом стал мой собственный supply chain‑мониторинг. Он сообщил о новом npm‑пакете plugin-react-vite. На первый взгляд это выглядело как очередной тайпсквоттинг - ничего особенно необычного.

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

В результате расследование ушло далеко за пределы одного package.json: от подозрительной зависимости я пришел к второму этапу размером около 30 тысяч строк, а затем - к нескольким месяцам активности, связанным пакетам, нескольким npm‑аккаунтам и уже известному кластеру.

Именно этот путь я и хочу разобрать.

Погрузиться в расследование

Ближайшие события

Психанул: как я за полтора месяца сделал формат конфигов и парсеры для семи языков

Уровень сложностиПростой
Время на прочтение5 мин
Охват и читатели9.1K

Cлучилось то, что я обычно советую не делать: я не выбрал из существующих 14 форматов, а сделал 15-й.

Читать далее

Думал, Android пишет двигатель хуже iOS. Передумал. Потом оказалось, что прав, но по своему

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели5.9K

Полторы тысячи записей моторов с телефонов. Виноват был не бренд и не цена телефона, а то, чей DSP отрабатывает запрос браузера.

На iOS та же правка сработала наоборот.

Вскрытие ноу‑код сметы за 500$ или как купить «АИ — ассистента» который сожрёт весь бюджет заказчика

Уровень сложностиСредний
Время на прочтение10 мин
Охват и читатели6.3K

Привет, Хабр! Я разработчик из Минска (работаю официально, в статусе НПД). Занимаюсь автоматизацией на связке Self‑Hosted n8n + Redis. Внедряю автономных ИИ‑агентов для мессенджеров и связываю их с amoCRM.

Поделюсь, как говорится, «мясом» из своей практики. В статье я максимально постараюсь отразить и технический абсурд плавно переходящий в явное кидалово от инфомошенников.

Перед началом сразу обозначу, как говориться, на берегу: во‑первых — это не хейт и не попытка кого‑то «разоблачить». Ленты мессенджеров завалены рекламой от «ИИ‑агентств» и «продавцов успешного‑успеха», которые громко кричат про «...ваш цифровых сотрудников за пару дней...». У меня нет раскрученного профиля с красивыми публикациями, но, есть обычная практика. Данный разбор — это попытка показать (а может кому‑то и знакомо), что скрывается за красивыми нагенерированными видосами и контентом и почему, доверив реальный проект таким «спецам» обойдётся дорого. Во‑вторых — все упоминания брендов и платформ в статье — не реклама и не антиреклама. Названия систем я оставил исключительно ради сохранения контекста, да и в принципе живого отражения примера.

История статьи началась, наверное можно сказать в 2 этапа. На первом этапе, который был ещё наверное в марте этого года, ко мне обратился заказчик с интересным ТЗ: стек Instagram+ amoCRM + Google Sheets при плотном трафике до 5000 диалогов в месяц (таргет что тогда, что по сей день заходит «на ура»). Причём сёстры (заказчик — это семейный бренд ателье дизайнерских украшений) своими силами опробовали «...платформы где платишь подписку и в соответсвии с трафиком выбираешь соответствующий пакет услуг. Итог в который после первого дня триала по самым средним подсчётам вышел бы 1100$ в месяц расхода (!). Поскольку моя статья не о том какая архитектура была в итоге у них развёрнута, так что пойдём дальше.»

Читать далее

GridStack: цена выбора API для nested grids

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели5.2K

Реальный кейс с nested grids в GridStack:

— почему подход на addGrid() привёл к ручной синхронизации DnD, проблемам с lifecycle и множеству фиксов;

— как переход на subGridOpts упростил архитектуру и сделал поведение стабильным.

Читать далее

Страница, которая не моргает: SPA-роутинг для HTML и Web Components

Время на прочтение4 мин
Охват и читатели5.6K

Фреймворки дают клиентский роутинг из коробки. У HTML и Web Components его нет. Если сайт уже отдаёт полные страницы, а клиентская навигация нужна только для части разделов, переписывать всё на фреймворк незачем.

Aura Router решает эту задачу, сохраняя HTML исходной точкой: маршруты объявляются как Custom Elements, а ссылки остаются обычными <a href>. Без JavaScript те же URL открываются как обычные страницы.

В статье соберём минимальный сайт из двух страниц и проверим прямой заход по URL, клиентскую навигацию и работу ссылок без JavaScript.

Читать далее

От клика до железа: хроника одного запроса. Часть 2

Уровень сложностиСредний
Время на прочтение24 мин
Охват и читатели9.1K

В первой части мы заставили кнопку на веб-странице запустить локальный exe-файл через расширение Chrome и Native Messaging Host. Теперь усложним задачу: операция длится десять секунд, сообщает прогресс и поддерживает отмену. Для этого заменим sendNativeMessage() постоянным соединением connectNative(), перепишем хост на Java 21, разберём протокол, восстановление соединения и жизненный цикл процесса, а затем соберём exe с помощью GraalVM Native Image и проверим всё в настоящем Chrome.

Читать вторую часть

Tinted — то, из‑за чего ты захочешь использовать терминал

Уровень сложностиСредний
Время на прочтение13 мин
Охват и читатели6.3K

Всем привет! Меня зовут Илья, я frontend‑разработчик.
Но сегодня хочу поговорить не о JavaScript, а о терминале.

Несмотря на то, что я уже много лет работаю разработчиком, активно пользоваться терминалом я начал всего около года назад. До этого терминал для меня был просто местом, где запускается сборка проекта, немного Git и иногда еще пара команд. Думаю, у многих так же.

Обычно мысли о терминале вызывают ступор. Кажется, что это что‑то непонятное, черно‑зеленое и предназначенное только для «настоящих программистов», и на практике большинство ограничивается npm run dev, git status и на этом все.

В этом гайде я хочу показать, как можно превратить терминал в красивую и удобную среду разработки, которая не уступает IDEA и другим редакторам.

Сразу оговорюсь: речь пойдет исключительно о терминале, а не о NeoVim.
NeoVim — это отдельная большая тема.

Читать далее