В прошлой заметке я выложил Micra.js — маленький реактивный фреймворк для server-rendered страниц. Дальше пошли две недели, за которые я выпустил несколько версий.
Добавил в Micra кросс-библиотечный бенчмарк. Постарался сделать честную страницу, где Micra, Alpine, petite-vue, Stimulus и голый ванильный JS гоняют одни и те же сценарии в соседних фреймах.
Цифры оказались приятно-неприличными. Обновить 5 строк в списке из 1000:
— Micra — 0 мс
— Alpine.js — 919 мс
— petite-vue — 1005 мс
Там, где Alpine и petite-vue перерисовывают весь список, Micra трогает только изменившиеся узлы. Первый рендер 1000 строк — 11 мс против 948 у Alpine. Mount тысячи компонентов — 19 мс против 47.
Параллельно появилась нормальная типизация: тип состояния и набор методов теперь выводятся прямо из объекта, который ты передаёшь в define. И типобезопасная шина событий — объявляешь свои события один раз, и emit/on проверяют payload на этапе компиляции.
Под капотом за эти две недели сменилось почти всё, что отвечает за рендер. Был рефактор, который собрал десяток обходов DOM в один проход TreeWalker — mount ускорился примерно вдвое. Планировщик перешёл с Promise.resolve().then() на queueMicrotask — одна микрозадача на батч вместо аллокации промиса. Списки без data-key перестали перерисовываться целиком и стали переиспользовать узлы по позиции. В процессе еще удалил немного кода.
Добавил рецепты:
— мост с htmx (server-driven свопы + реактивные островки на одной странице),
— интеграцию с Rails (importmap, CSRF, Turbo), контракт гидратации для SSR.
Гем micra-rails догнал свежую версию. На домашней странице добавил секции про скорость и про то, как затащить Micra в Claude artifacts или ChatGPT canvas. Теперь достаточно просто скопировать промпт.
Теперь у Micra теперь два читателя. Человек, который открывает доки, смотрит примеры, ставит через npm или cdn. И языковая модель, которая генерирует код за человека. И у модели свои требования, не всегда очевидные. Например, она по умолчанию пишет на React. Если попросить Claude Code сделать форму, то в результате получишь React-компонент, потому что так в обучающих данных. Чтобы вышла Micra, надо явно сказать: делай HTML-артефакт, не React.
Кроме того, тот же Claude Code тянет скрипт с того CDN, который вспомнит первым. Если модель вспомнила про unpkg, то скрипт не грузится, потому что unpkg заблокирован Content-Security-Policy в Claude и ChatGPT. В результате вместо нормального артефакта получается пустая страница.
Так что эту неделю я занимался тем, что делал библиотеку читаемой для моделей:
— завёл PROMPT.md для копипаста в LLM. Собрал список анти-паттернов
— опубликовал llms.txt и llms-full.txt прямо на сайте
— добавил библиотеку в Context7
— сделал репозиторий совместимым со стандартом Open Plugins, чтобы каталоги вроде cursor.directory подхватывали правила автоматически.
В качестве эксперимента заменил весь js на сайте и в админке. Теперь тут используется Micra.js. Раньше из десяти сгенерированных моделью компонентов рабочими были два-три. Сейчас — восемь, и оставшиеся чинятся одной правкой.
Что в итоге
За две недели Micra прошла путь от 2.1 до 2.3.1: быстрее рендер, типобезопасная шина, переиспользование узлов, минус мёртвый код. Плюс рецепты, бенчмарки и целый слой работы над тем, чтобы библиотеку находили — и люди, и инструменты.