TypeScript *

Если вы делали AI-фичу на Vue, то, скорее всего, сталкивались с одним и тем же: большинство готовых инструментов для LLM-интерфейсов написаны с прицелом на React, а во Vue их приходится адаптировать или писать стриминг, tool calling и состояние чата вручную. Я сделал vue-llm — open-source библиотеку, которая закрывает это для Vue 3, Nuxt и даже Vue 2.7.

Сразу ссылки, чтобы можно было пощупать:

• Песочница без API-ключа (модель скачивается и работает прямо в браузере на WebGPU): https://vue-llm.js.org/ru/playground

• Документация на русском: https://vue-llm.js.org/ru/

• GitHub: https://github.com/dadashi44/vue-llm

• npm: npm i vue-llm

WYSIWYG-редактор в Next.js App Router затрагивает несколько слоев приложения. Quill работает с DOM и browser API, поэтому сам редактор живет на клиенте. Контент нужно хранить отдельно от экземпляра Quill, передавать в компонент при смене сущности, сохранять на сервер и затем показывать без toolbar и режима редактирования.
Если хранить результат Quill как HTML, редактор и viewer могут работать с одной строкой contentHtml. Editor меняет HTML через onChange. Autosave отправляет новую версию после паузы во вводе. Viewer получает сохраненный HTML и отдельно обрабатывает элементы, которые Quill использует для code blocks. Для подсветки кода добавляется highlight.js.

Если вам нужно дать постороннему человеку войти в админку работающего интернет-магазина на Next.js, а данные покупателей не показывать, копия базы не единственный путь. Можно открыть живую панель с ролью только для чтения и закрыть утечки на трёх уровнях: запросы, поля и разделы. Расскажу, как это устроено у нас и где оно уже протекало.

Нас двое. Один недавно искал работу и ходил по собеседованиям, второй сам собеседует кандидатов и раз за разом видит, как люди спотыкаются на одних и тех же задачах: debounce, глубокое сравнение объектов, форма с валидацией.

Готовиться к таким задачам на русском оказалось почти негде, особенно если вы пишете на JS или TS не только во фронте, но и на бэке. Поэтому мы сделали ПаровоJSик. Под катом рассказываем, что внутри, как тесты запускаются прямо в браузере и что будет дальше.

Мы делаем учебную игру: человек пишет цель своими словами («таблица умножения», «дроби за 5 класс», «английский для поездки»), а игра строит под неё путь из локаций. В каждой локации — порция из пяти заданий. Готовых курсов нет: тема может быть любой, поэтому задания пишет языковая модель (Claude от Anthropic) — под цель, уровень и последние ответы игрока.

Придумывает задания модель хорошо, а считает плохо. В октябре мы разобрали 68 жалоб «Задание с ошибкой?» — игроки отправляют их кнопкой прямо из урока. Типичные случаи:

Convex – это новый, но набирающий популярность фреймворк для реактивных веб-приложений, который позволяет писать транзакционные квери (queries) и мутации (mutations) на TypeScript с гарантиями консистентности.

Вся статья ниже относится к self-hosted версии Convex: convex-backend, а точнее, к моей пропатченной версии оного, так как “официальная” версия не пригодна к работе в продакшене и вряд ли тестировалась на сколь-нибудь нагруженном кейсе. Моя версия работает на виртуальном сервере с 32 ядрами и 64Гб памяти и обрабатывает до 15 тысяч Convex-кверей и мутаций в минуту.

Я навайбкодил convex-wasm-compiler, который компилирует Convex-квери и мутации в WebAssembly, и соответствующий патч для convex-backend, позволяющий выполнять скомпилированные в Wasm Convex-функции на файберах Wasmtime прямо в Tokio рантайме convex-backend.

TLDR: квери и мутации в среднем работают в 2 раза быстрее, хвосты задержек сократились втрое. Объём памяти, который сервер удерживает под готовые к выполнению окружения (V8-контексты или Wasm-окружения), уменьшился на 80%.

Четыре месяца в одиночку пишу космическую MMO во вкладке браузера. Авторитетный сервер на Colyseus, детерминированные орбиты без синка координат, «ленивые» комнаты — и история про баг, из-за которого живой мир молча замолчал на трое суток.

Миниигры - это соль и перец текстовых квестов “Космических рейнджеров”. Хороший квест должен содержать миниигру или должен быть построен на основе её механики. Миниигры - это очень трудоёмко. Это было трудоёмко, пока не появился QMS.

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

Обычно у меня открыто десять-пятнадцать сессий Claude Code. У каждой свои субагенты и MCP-серверы, где-то поднят vite, где-то крутится pytest. Какое-то время это работало, а потом 64-гигабайтная машина начала задумываться над каждым переключением окна.

Я открыл диспетчер задач и увидел стену одинаковых node и claude. Сколько они едят, видно. Чьи они, не видно совсем.

Так появился claude-load, мод для Claude Code, который раскладывает нагрузку машины по сессиям. Первый же запуск показал 15 живых сессий, которые вместе держали 10,8 ГБ. Рассказываю, как мод узнаёт, чей процесс, почему кнопка «завершить» оказалась самой опасной частью проекта и обо что я споткнулся в новых модах Claude Code.

Привет! На связи Дмитрий Чепайкин, старший Angular-разработчик в команде Klecks — платформы для разметки данных AI Центра Т-Банка.

Долгое время unit-тесты фронтенда у нас крутились на Karma + Jasmine. Схема работала, пайплайн зеленый, переписывать «ради моды» не хотелось. Но в какой-то момент Karma официально признали deprecated, а корректная отгрузка отчетов в Allure перестала быть чем-то, на что можно положиться. Расскажу, как мы выбирали замену, почему сначала смотрели на Jest, а в итоге приняли Vitest — и как устроен итоговый сетап.

Если у вас стек целиком на TypeScript, Kafka или вы уже читаете через @platformatic/kafka или KafkaJS, и захотелось Kafka Streams - это для вас. Состояние по ключу (счетчики, агрегаты, окна) обычно живет в Redis или Postgres, и при падении консьюмера посреди батча получаете дубли или потерянные обновления. В Java для этого есть Kafka Streams. В Node.js аналога нет, а поднимать отдельный JVM-сервис ради этого дорого.

kstreams-ts переносит модель Kafka Streams в Node.js, поверх @platformatic/kafka. Состояние живет рядом с обработкой и переживает падения и ребалансы, а в режиме exactly-once каждая запись учитывается ровно один раз.

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

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

Мы — небольшая команда, делаем Зархолд: карточную MMORPG в браузере. Каждый бой в ней — пошаговая дуэль колодами, а режимов много: дуэли, арена от 1×1 до 5×5, поле боя 5×5, подземелья на троих, рейды и мировые боссы на пятерых, бои в открытом мире. Сервер — TypeScript, Fastify и node-postgres, база — PostgreSQL за pgBouncer, файлы — Cloudflare R2.

До «Хроник» у каждого режима был свой итог в своей таблице — шесть разных мест. Нам захотелось одного открытого архива всех боёв: отчёт любого боя с числами по ходам, картам и целям, топы по каждому боссу с оценкой от 0 до 100, доля побед по классам и веткам талантов в PvP. Смотреть может кто угодно, без входа (золото, почта, учётки и адреса не отдаются никогда). Так появились «Хроники сражений». Расскажу, как они устроены и какие места оказались неочевидными.

Введение

Представьте, что вам нужно отрендерить в React-приложении таблицу с 100 000 объектов, которые непрерывно обновляются в реальном времени через WebSocket. Каждые 50 мс прилетает батч из 5000 дельт (изменений).

Стандартный подход с useState или классическим Redux (с Immer) убивает браузер за несколько секунд:

Спустя полгода адаптации к OpenSource выпускаю еще две библиотеки из моего рабочего контура в одном npm-пакете - ARFA Generator и api-contract-check. В этой статье расскажу про первый инструмент, а второй презентую в рамках отдельной статьи.

Когда-то давно я уже писал статью про удобство использования файловых генераторов, интегрированных в долгоживущий процесс dev-сборки, однако за несколько лет развития и обкатки в реальных проектах концепт существенно расширился. Удобнее всего оказалось сместить бандлер с центрального места в один из сайд-эффектов после стабилизации кодовой базы, а разнородные инструменты проверки качества объединить в единый пайплайн с инкрементальным watch-режимом.

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

Вторая часть про скоринг email-адресов.

В первой я обучил CatBoost отличать живые адреса вроде ivan.ivanov@gmail.com от сгенерированного мусора. Теперь подключаю модель к Node.js-бэкенду, без отдельного Python-сервиса.

Сама модель в ONNX запускается быстро, но основная работа в другом - переписать все признаки на TypeScript так, чтобы они совпадали с Python до последнего бита. Пришлось разбираться с длиной строк в UTF-16, \d в регулярках и прототипами у JS-объектов.

▎ Может он и быстр, только экосистема нулевая. Ну и ещё система модулей кастомная, что полностью убивает любые готовые инструменты. Так что $mol — по сути одной ногой в могиле.
▎ Был у меня сложный компонент, допустим weather_widget. И вот в 20 местах на него наложили оверрайды. А потом я пересобрал этот widget. Что произойдёт с оверрайдами, которые знают внутреннюю структуру зависимости? Правильно, всё пойдёт крахом.

▎ Вот вы реально готовы поставить свой доход на вот это?

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

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

Хотел бы поделиться с сообществом удобным расширением браузера для организации множества закладок через двухпанельный интерфейс