TypeScript *

🕹️ Подключение бота к бирже за час, а не неделю

Подключение торгового бота к бирже обычно отлаживается так: пишешь адаптер, запускаешь live и ждёшь торгового сигнала, чтобы поймать баг — а сигнала может не быть сутками. А в алготрейдинге мы делаем именно так.

Статья содержит руководство, как оптимизировать временные затраты на отладку интеграции в биржу

Технический разбор браузерного top-down шутера на Phaser 4 и TypeScript: архитектура сцен, менеджеры, Tiled-карты, оружие, боссы, VFX/SFX, Playgama-интеграция и оптимизация ассетов.

Отдельно рассказываю, как использовал AI-ассистентов в разработке: где помогли Phaser skills против выдуманных API, как референсы удерживали единый стиль спрайтов, и почему генерация ассетов оказалась не “картинкой по промпту”, а полноценным пайплайном с Krita, Pixelorama и проверкой в игре.

Агент не ломает архитектуру. Он заливается в те щели, которые ты ему оставил. Как я перестроил проект на 200К строк, чтобы границы держал линтер и CI, а не слова в CLAUDE.md. С кодом и цифрами до и после.

Экран, в котором я живу 4 месяца. Не открываю IDE — всю god crm пишу внутри god crm.

Всё на скрине — строки одной postgres-таблицы. заметка, тикет, агент — одна сущность. поэтому заменило мне ноушн, обсидиан и мессенджер сразу.

Код открыт, mit: github.com/holetron/godcrm

Замена одной кнопки не должна тянуть за собой весь React. В RWC — не тянет.

Каждый компонент RWC — самостоятельный Custom Element. Он не зависит от рантайма хоста и работает внутри React-дерева, Angular-приложения или чистого HTML.

Поэтому старый React-компонент и новая RWC-кнопка живут на одной странице одновременно.

На практике: UI-кит мигрируется покомпонентно, по одному виджету за спринт. Без feature-freeze, без второго рантайма фреймворка и параллельной сборки ради сосуществования версий.

Единица изоляции здесь — сам компонент, а не application runtime.

В Tauri фронтенд дёргает Rust-команды через invoke("get_user", { userId: 42 }) — строка, объект, никакой проверки типов. После очередного вечера, убитого на расхождение snake_case и camelCase, я написал генератор, который превращает Rust-команды и serde-типы в готовые TypeScript-файлы — без аннотаций и правок в коде приложения.

Под катом — почему генерировать надо не то, что написано в коде, а то, что serde реально шлёт по проводу; как я выпустил три релиза за один день, воюя с макросами; и при чём тут юникод-эскейпы в TOML на Windows.

Во многих проектах взаимодействие фронта с бэком до сих пор строится по классике: ручки, fetch, headers, дублирование типов. При таком подходе внушительная часть кода уходит на обслуживание сети, а не на саму бизнес-логику. 

Мы решили эту проблему через Chord — фреймворк сетевого уровня на базе JSON-RPC. Используем его уже более 2 лет. 

Эта статья для фронтенд- и фулстек-разработчиков, работающих с TypeScript и мета-фреймворками вроде SvelteKit, Next или Nuxt. В ней покажу, как мы с помощью Chord вызываем серверные методы как обычные функции и получаем типы с бэка без дублирования. 

Привет!

Это 18 выпуск Frontend Status — дайджеста по фронтенд-разработке.

В этом выпуске:

📺 Экосистема TanStack кажется бесконечной, а browser gaming снова стал серьёзной платформой: Jack Herrington собирает 17 библиотек в одном приложении, а Software Engineering Daily с Эриком Дабилбором из Poki разбирает WebAssembly и WebGL/WebGPU на практике — чтобы увидеть, как устроены и стек, и дистрибуция современных веб-игр.

🤖 Старые приёмы промптинга режут точность reasoning-моделей, а закрытая вкладка не останавливает счёт — токены и GPU крутятся впустую — чтобы перестроить работу с ИИ и не платить за отменённую работу.

🛡️ Next.js с дефолтными настройками уязвим к RCE через Server Actions — даже если «серверных функций у нас нет» — чтобы не жить с иллюзией безопасности.

🎨 Центрирование всё ещё ломает голову, а каскадные анимации плодят сотни :nth-child — честный разбор центрирования и новые sibling-index() / sibling-count() — чтобы понимать, почему код работает, а не подбирать методом тыка.

⚡ Зелёные async-тесты врут, PDF застревает в iframe, геометрия — в sin/cos, DI падает на проде — PDFSlick, Geometric.js, InferDI и разбор ловушек Jest — чтобы ловить ошибки до деплоя, а не в три часа ночи.

⚛️ React-зоопарк, неделя конфигов и ручная мемоизация: карта Robin Wieruch на 2026-й, Rockpack из коробки, TanStack AI без вендорного замка, visx 4.0, RSC в TanStack Start и React Compiler — чтобы собирать стек без споров и вычистить лишний шум из кодбейза.

👁️ TanStack Table почти убил типы и автокомплит во Vue — честный разбор на Habr — чтобы брать библиотеку только под ту боль, которую не решить за час на чистом Vue.

🌎 Chrome подставляет тяжёлые блоки по ходу стрима, Firefox говорит с железом через Web Serial, canvas наконец принимает DOM — чтобы меньше костылей в вёрстке и проще UI поверх графики.

🦮 aria-label на div — ложная доступность, которую скринридер проглатывает — чтобы не тратить время на иллюзию a11y.

📦 Код пишут агенты, а ценность — в суждении: cpojer, автор Jest, о том, что осталось важно инженеру — чтобы направлять систему, а не печатать быстрее.

⚡ Node молча жрёт память, если стримы игнорируют backpressure — чтобы баг не всплыл только на по-настоящему большом датасете.

Реактивность лучше MobX, виртуализация рендеринга «из коробки», типизированные стили на TypeScript, локально-первая модель данных через CRDT — эти идеи Дмитрий Карловский (nin-jin) разрабатывает на своём фреймворке $mol и в проекте $hyoo.

За десять лет накопилось около сотни статей на Хабре и большая документация на mol.hyoo.ru, разбросанная по годам и площадкам — карта потерялась даже у тех, кто читал.

Этот каталог — навигатор по корпусу. 80+ материалов разложены по 12 темам:

с чего начать и для кого это вообще

история фреймворка от тизера 2016-го до обзора 2025-го

реактивность от первого «атома» 2014-го до свежего цикла 2026-го

архитектура: MAM, view.tree, виртуализация, CSS-in-TS

руководство по практике

утилиты: $mol_fetch, $mol_time, $mol_regexp, VaryPack, MarkedText

TypeScript-приёмы и принципы кода

$hyoo и Гипер База — распределённые данные на CRDT

сообщество, бенчмарки, аналитика проекта в цифрах

На каждый материал один абзац о сути и прямая ссылка на оригинал.

Полезно даже тем, кто не будет писать на $mol.

Мы делаем чат-агрегатор, где в одном окне доступны GPT, Claude, Kimi и DeepSeek. Фронтенду нужно отдавать ответ в реальном времени — токен за токеном, как в ChatGPT. Бэкенд при этом ходит к четырём разным API, и стриминг у них устроен по-разному. Расскажу, как мы свели это к единому SSE-потоку наружу, и про две грабли, на которые наступили: рваные UTF-8 символы и парсинг чужих SSE.

Статья будет полезна всем, кто проксирует LLM через свой сервер.

Зачем вообще свой прокси

Фронтенд не должен знать ключи провайдеров и не должен ходить к ним напрямую. Все запросы идут через наш Node.js-бэкенд: он подставляет ключ, дёргает нужный API с stream: true, парсит входящий поток и отдаёт фронту унифицированные события. Плюс на бэкенде живут лимиты, учёт токенов и подмена провайдера.

Задача: «получить поток от провайдера X → распарсить → отдать фронту в едином формате».

Два разных формата стриминга

Провайдеры делятся на два лагеря.

AnkiAI-Cards - мобильное Android приложение с помощью ИИ генерирует карточки по шаблону и отправляет их напрямую в AnkiDroid внутри смартфона. Помогает изучать иностранные слова ассоциируя с контекстом фраз и предложений.

Строим Telegram-бота с RAG-поиском по базе знаний — без векторных БД, без эмбеддингов, без платной инфраструктуры. Поиск по ключевым словам через Jaccard, LLM через Groq, история сессий в Cloudflare KV, деплой одной командой. Стек: TypeScript + Telegraf + Cloudflare Workers.

Статья о том, как превратить TypeScript-схему в единый источник истины для работы с базой данных: из одного определения получить типы строк, имена таблиц и колонок, типизированные запросы, связи, миграции и unit-of-work поверх Knex.

Webnative - фреймворк для разработки нативных приложений на языках веба с использованием нативных webview компонентов.

В августе 2025 года TypeScript впервые возглавил рейтинг GitHub по числу активных контрибьюторов, обойдя Python и JavaScript. Изменился подход к написанию кода: типы стали машиночитаемыми контрактами, фреймворки сделали TS вариантом по умолчанию, а ИИ-инструменты используют типы как ограничения. Разбираемся, какие цифры подтверждают тренд, где он создаёт издержки и как выбирать стек в 2026 году с учётом изменений рынка.

Когда пользователи используют отпечаток пальца или вход по faceid, это часто воспринимается как «моя биометрия отправляется в сервис». На практике все устроено иначе: биометрия остается на устройстве пользователя, а сервис работает только с криптографией, challenge и открытым ключом. Разберем это на реальном коде, как мы подключили WebAuthn на backend, frontend и в auth-виджете в своем проекте.

IWANT - наш собственный fashion-магазин. Несколько лет он жил на InSales: на старте это правильный выбор: быстро, без разработки, всё из коробки. Но в какой-то момент мы уперлись в потолок платформы: каждый нужный модуль - это либо платное приложение, либо «так нельзя». Мы посчитали и решили перевезти магазин на собственный движок.

Это не история «платформы плохие, пишите своё». Это разбор конкретного переезда: что переносили, как устроен ETL из выгрузок InSales, на каком стеке собрали и почему именно на нём, какие модули пришлось писать самим, как прошёл катаут без простоя и кому такой переезд реально нужен, а кому нет.

Около года назад я решил сделать универсальное open-source решение для визуализации списков. В первых версиях я отрабатывал технологию виртуализации с различными параметрами, было много исследований, вопросов, ну и конечно дефектов). Сегодня же состоялся релиз X.12.X версии, которая работает под управлением Angular 14-22. Хочу рассказать на что способен инструмент (ng-virtual-list), какие задачи решает и проведу краткий обзор с демонстрацией примеров.

Все приведенные ниже примеры содержатся в документации с примерами кода.

Инструмент ng-virtual-list это виртуализированные, высокопроизводительные списки с множеством различного функционала, которого нет у стандартных списков.

Небольшой R&D о современных альтернативах Electron для десктоп‑приложений на веб‑технологиях. На одинаковом тестовом приложении (React + TypeScript + Vite) сравниваются ElectroBun, NeutralinoJS и Wails: как устроена их архитектура, каким образом они взаимодействуют с ОС, что происходит под капотом и почему результаты по памяти так сильно отличаются. В статье есть практические наблюдения, замеры потребления ОЗУ, плюсы и минусы каждого подхода, а также рекомендации, в каких сценариях выбирать минималистичный WebView‑подход, полноценный backend на Go или браузерный рантайм с максимально широкой поддержкой Web API и графики.

Привет, Хабр. Это история о том, как я делал ставки 7 лет, потом бросил, а потом написал приложение, которое помогло бы мне бросить раньше. Расскажу и про продуктовые решения, и про техническую часть: React Native + Expo, полностью офлайн-архитектура без бэкенда, шесть языков, и как сейчас выглядит публикация в Google Play для нового индивидуального аккаунта разработчика.