JavaScript *

Знакомая ситуация: вечер, вы вдвоём или компанией хотите посмотреть кино — и следующие сорок минут листаете каталоги стримингов. Рекомендации «по вашим просмотрам» тут не помогают: смотрит-то компания, а не один человек.

Разбираем архитектуру KINO PARTY (partykino.com) — каталога фильмов и сериалов на 900 000 тайтлов с рекомендациями без нейросетей и ML-инфраструктуры: разрежённые векторы, косинусное сходство, инвертированный индекс, real-time комнаты кино-свайпера на SSE и честное SEO.

Хотим поделиться с вами своим небольшим опытом работы с IDE DroidScript, средой разработки под Android, которая была обнаружена на просторах Google Play, как инструмент, с которым можно работать непосредственно на смартфоне, т.к. в первую очередь, появилась необходимость программировать в дороге или просто не дома, например, в электричке или на улице. Ноутбук носить с собой не всегда хочется и "можется" - всё-таки лишняя тяжесть, да и время, пока достанешь и запустишь его, а тем более, прогрузится, например, Android Studio - среда, с которой мы работали ранее, тоже пройдёт не маленькое.

Введение

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

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

Изначально отдали GPT полный контроль: вот тебе страница магазина, вот список промокодов, разбирайся. На демо это выглядело хорошо. Ровно до того дня, когда он зашел на страницу оформления, увидел заполненную форму, прикинул, что задача выглядит примерно так, и двинулся нажимать кнопку покупки. Формально он выполнял инструкцию. Фактически мы в этот момент поняли, что полный контроль над чужим браузером LLM давать нельзя. Да и в релизе это было дорого, нестабильно и оказалось местами опасно.

Почти каждая деталь этой системы появилась после того, как что-то сломалось на проде. Так что дальше в основном собраны истории провалов. Предлагаю вашему вниманию разбор в деталях и наши выводы про работу с LLM в Web разработке и про построение AI-native продуктов. Будет полезно! -->

Поиск узкопрофильных вакансий (например, n8n‑инженер или специалист по интеграциям) через RSS‑ленты превращается в борьбу с шумом. Простые текстовые фильтры по ключевым словам «автоматизация» или «API» дают массу ложных срабатываний: от «менеджеров по автоматизации продаж» до «руководителей API‑команд».

В этой статье я разберу архитектуру end‑to‑end пайплайна на n8n, который использует LLM (Groq API) для жесткого семантического скоринга каждой вакансии. Мы не просто ищем совпадения, а заставляем ИИ работать строгим техническим рекрутером, отсеивая 90% мусора на входе.

Особое внимание уделим «граблям»: как бороться с Rate Limit бесплатного тарифа Groq, почему парсинг JSON от LLM падает с ошибкой и как настроить дедупликацию через Data Table, чтобы бот не спамил одно и то же каждый час.

Если у вас Mac и электронная подпись на Рутокене, вы наверняка знаете ритуал: чтобы войти на Госуслуги по ЭЦП, отчитаться в личном кабинете ФНС или подписать документ в Диадоке, нужно открыть Chrome. Госплагин, Контур.Плагин и КриптоПро ЭЦП Browser plug‑in официально работают только в Chromium‑браузерах и Firefox. У КриптоПро есть старое Safari App Extension, но в актуальных версиях Safari оно даже не появляется в настройках.

Я захотел, чтобы всё это работало в Safari, и в итоге получилось три небольших приложения для macOS с открытым кодом: Gosplugin Safari (Госуслуги/ЕСИА), Kontur Safari (Диадок и сервисы Контура) и CryptoPro Safari (nalog.ru, торговые площадки и всё, что работает через cadesplugin). Ниже — как это устроено и на какие грабли Safari я наступил по дороге.

Представьте ситуацию: человек полчаса собирал важный отчёт в веб-таблице или подбирал сложную комбинацию фильтров, нажимает «Сохранить» или «Применить» — и страница намертво замирает. Курсор превращается в колесико, меню не открывается, скролл не работает. В голове пользователя сразу паника: «Всё зависло? Мои данные пропали? Нажать ещё раз? Перезагрузить страницу?!»

Ему абсолютно всё равно, что под капотом в этот момент браузер пересчитывает 500 000 записей. Если страница не реагирует на клик — приложение кажется сломанным.

Почему так происходит? Однопоточный Main Thread наглухо заблокирован вычислениями. Но как дать браузеру возможность реагировать на действия человека, не останавливая сам расчёт?

Мы собрали бенчмарк и на реальных профилях из DevTools сравнили современные подходы для освобождения main thread. Внутри — результаты замеров, трассировки Event Loop и ответ на вопрос, как сохранить полную отзывчивость интерфейса при различных нагрузках.

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

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

Или история о том, как 5408 байт обфусцированного JavaScript, прилетающих в HTTP-заголовке, превращаются в свободный доступ к GPT, Claude, Mistral и генерации картинок если построить браузерный манекен на чистом JS.

Я тут посмотрел на свои заметки и понял, что они как каша из терминов. А как бы я объяснил это своей бабушке? Вот, к примеру, векторные мультики на JavaScript / HTML, которые нейронки сейчас делают со скоростью 1 к 30 (за полчаса — минута анимации) и копеечной стоимостью. Как бы я объяснил, почему у меня радости полные штаны?

Привет, бабушка, я тут научился делать мультики на нейронке. Нееет, это не те, как кино со Штирлицем и котиками, которые разговаривают и ходят на задних лапах. Там специальные нейронки, они круто рисуют, но стоят дорого, понимаешь? Разориться можно, чтобы самому рисовать.

А тут я открываю и на своем компьютере набираю — сделай мне мультик как для детей. Не реалистичный, да, рисованный. Но делает она это очень дешево — вот я вчера делал минутные ролики на Claude Opus 5.5, а потом на ChatGPT Sol 6.1 — вышло копейки, по полчаса работы. Недельный лимит не потрачен практически, у Opus максимум 10 процентов ушло.

Вот пример — Котенок Фырфыр — не путать с котенком по имени Гав.

Шлюз проверил JSON и пропустил запрос, а сервис за ним выдал пользователю права администратора. Оба компонента отработали корректно, но по-разному интерпретировали одни и те же данные. Разбираемся, почему JSON-парсеры расходятся в обработке ключей и чисел, к каким ошибкам это приводит и как защитить от них API.

Недавно на одном сайте пропали превью ссылок в Telegram. Разметка на месте, сайт открывается, ошибок нет, а в логах сервера за десять дней ни одного запроса от Telegram. Это самый неприятный вид поломки: сайт вроде бы работает, а что-то важное тихо сломано. Разбираем, как сделать бесплатный мониторинг WordPress-сайтов на Cloudflare Workers и во что упираешься в лимитах бесплатного тарифа.

В Gravity Defied я ни разу не играл, но решил собрать её заново — в браузере и без единой библиотеки. Получилась история о том, как из пружин и пары формул собрать мотоцикл, на котором хочется сделать ещё одну попытку.

Всё началось с того, что мы с другом сели за PS5, и он запустил Trials Rising. После сотни попыток на одной трассе мне стало интересно, откуда у этого жанра растут ноги. Сам я рос на Hill Climb Racing на iPod, так что идея была знакомой, а вот первоисточник — нет. Ответ нашёлся быстро. Gravity Defied когда-то помещалась в память кнопочного телефона и держалась на одной простой мысли: мотоцикл нужно чувствовать, а любая неточность в наклоне заканчивается ударом головой о землю.

Пять видимых символов в нике могут превратиться в 10, 15 или 32 — смотря какой язык программирования их считает. Из‑за этой разницы пользователь получает ошибку валидации, теряет часть эмодзи или сталкивается с проблемой при сохранении данных. Разбираемся, почему JavaScript, Python, Go и другие языки по‑разному измеряют длину строк и как правильно задавать ограничения, чтобы данные не терялись.

Недавно команда Telegram выкатила решение, которое закрывает все эти вопросы разом — нативную платформу Serverless (beta) прямо внутри @BotFather. Теперь запускать серверную логику бота на JavaScript, хранить данные в реляционной БД и раздавать фронтенд для Mini App можно непосредственно в облаке Telegram без собственного сервера.

В этой статье разберём, как устроен tgcloud изнутри, почему его документация идеально заточена под разработку с помощью ИИ-агентов, и посмотрим на реальный кейс: как я поднял на этом стеке игру Wordle (wordslebot) с единым стейтом для чата и Mini App, системой друзей, лобби, мультиплеерными комнатами и внутриигровым чатом.

У меня Kapsula началась с таймера рабочего дня. Один HTML-файл, который написал ИИ. Открываешь, нажимаешь кнопку, он отсчитывает время. Потом гаснет экран телефона — и выясняется, что с напоминанием всё сложнее, чем казалось в браузере.

Про будильники и устройство оболочки я уже рассказывал. С тех пор приложение дошло до версии 0.5, и задача немного сдвинулась. Теперь в нём можно запускать отдельные JavaScript- и TypeScript-файлы, редактировать сохранённый код и возвращаться к своим данным после изменений.

Хочу показать, что получилось, на простом трекере тренировок. Добавить подход, закрыть приложение, открыть завтра, попросить ИИ что-нибудь поменять. Довольно обычные действия. Вот на них и становится видно, насколько полезна вся эта история с «приложением из чата».

Обычно браузер представляют так: у каждой вкладки свой поток и свой event loop, а промис срабатывает раньше таймера, потому что микрозадачи приоритетнее макрозадач. На практике этого хватает, но в стандарте HTML всё устроено иначе. Вот три примера:

Зависшая вкладка может подвесить соседнюю, например ту, которая открыла её через window.open().

Один и тот же код может выдать разный порядок вывода, и всё зависит от того, кто его вызвал.

Слова «макрозадача», которое звучит на каждом собеседовании, в стандарте нет: то, что им называют, - просто обычная task.

Я делаю Blocturne, головоломку с блоками для Telegram. Механика знакомая по Block Blast: поле 8×8, три фигуры в лотке, собираешь ряды и столбцы. Сверху прикручен подсчёт как в Balatro: фишки умножаются на множитель, между раундами лавка с предметами. Но рассказать хочу про звук, потому что с ним я провозился дольше, чем со всем остальным.

На примере панели профиля вынесем логику и подготовку данных в useSetup[Component], а в компоненте оставим разметку. Затем отдельно проверим setup-хук, компонент через Shallowly и взаимодействие через React Testing Library. В конце — полный пример с Vitest, который можно забрать и запустить.

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

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