Category : javascript

javascript
Микрофронтенды. Стабильная интеграция нескольких SPA-приложений. Часть 2

Привет! В первой части бы поговорили о нашем подходе к мирофронтендам, модульной федерации и о том, как устроены интеграции. В этой, как и обещал, про шаринг и изоляцию библиотек, ленивую загрузку, а также немного советов и рекомендаций.Делимся веб-компонентамиПриложения у нас самодостаточные, так что друг о друге они не знают. Нам необходимо каким-то образом поделиться веб-компонентами. Есть два способа.У нас есть модульная федерация и блок Exposes. С его помощью мы можем описывать различные к…

  • среда, 1 июля 2026 г. в 00:00:10
javascript
Flappy Bird: делаем игру сложнее и добавляем автопилот на чистой математике

ВведениеНачнём с предыстории. Когда я опубликовал первую статью про клон Flappy Bird, я хотел получить результат, который был бы мне приятен, но вместо этого получил всего понемногу. Поучил физику, посмотрел, как лучше работать с рендерингом, узнал, почему птица стала такой популярной игрой, но один комментарий заставил задуматься: Один читатель написал: «Году так в 2004 у меня в кнопочном телефоне от LG была предустановлена ровно такая же игра, только вместо птицы там подводная лодка была. Так…

  • среда, 1 июля 2026 г. в 00:00:09
javascript
Попросили Claude создать WCAG-доступный DatePicker на React и потратили 3 дня на доработки

ВведениеКазалось, что DatePicker от Cloude сразу был готов в prod, но:Я запустил NVDA, переключился клавишей Tab по нашему новому DatePicker'у, и фокус выскочил за пределы диалогового окна. В Storybook все работало нормально. Календарь открывался, даты менялись, состояние выбора срабатывало, и Claude написал приличную структуру на React, но как только в дело вмешался пользователь со screen reader'ом, все это перестало казаться готовым в prod.Привет, коллеги!Меня зовут Илья, я технически…

  • вторник, 30 июня 2026 г. в 00:00:19
javascript
Два способа создания доступного DatePicker'а с помощью AI: 80/20 в пользу AI или системное проектир…

ВведениеЯ открыл демо-версию DatePicker'а, и она выглядела вполне обычно. Поле ввода, кнопка, всплывающий календарь, keyboard navigation, метки для screen reader'ов, макеты для настольных компьютеров и мобильных устройств.С внешней стороны ничего особенного. Интересным был не сам компонент, а то, как мы его создали.Привет, коллеги!Меня зовут Илья, я технический директор компании «Исходный код». Наша frontend-команда последние шесть месяцев занималась улучшением доступности компонентов R…

  • вторник, 30 июня 2026 г. в 00:00:17
javascript
Как мы ускорили разработку Frontend в 10х TSGO, Oxlint, Rsbuild, React Compiler & CodeGen

О СебеЗанимаюсь разработкой уже более 10 лет. За это время побывал на разных позициях начиная от рядового разработчика до руководителя Frontend департамента.До этого несколько лет в финтехе: проекты для Visa, p2p exchanger, Europe banking, crypto exchanges. Там углублялся в требования к скорости feature delivery и надёжности и именно оттуда пришло понимание, насколько критичен DX при высокой скорости разработки. Также были кейсы другого масштаба где была платформа на базе Module Federation, кот…

  • вторник, 30 июня 2026 г. в 00:00:16
javascript
Дайджест JS/TS: новинки ES2026, гонка рантаймов и EAP

Пока фронтенд-инженеры продолжают пересобирать свои проекты на новых сборщиках, JavaScript как язык становится всё более зрелым, быстрым и безопасным. Мы собрали самые интересные новости из мира JS и TS за последние месяцы, мимо которых нельзя пройти.Встречаем ES2026: что нового в стандарте?Комитет TC39 согласовал список фич, которые официально войдут в стандарт ECMAScript 2026. Язык продолжает избавляться от старых болей:Explicit Resource Management (оператор using). Фича, которая долго обкаты…

  • вторник, 30 июня 2026 г. в 00:00:15
javascript
TeamPCP: как команда хакеров-любителей «Дюны» закинула в наши Node.js-пакеты червей Shai-Hulud

Спасибо Фрэнку Герберту, что воспитал поколение хакеровnpm install — такая привычная многим из читателей команда, но за последние пару месяцев она обернулась сущим кошмаром для инженеров по безопасности. И ладно бы всё сводилось к проверке 5 пакетов из package.json, но у каждой зависимости по 10 своих зависимостей, а у тех ещё по 10. В итоге мы тянем 2000, а не 5 пакетов, и тут, кажется, уже руками не проверишь. И именно на этой боли всех безопасников, поддерживающих JS-проекты, сыграла команда…

  • вторник, 30 июня 2026 г. в 00:00:13
javascript
Canvas или SVG для карты офиса: как мы выбрали и справились с неочевидными граблями

Если к вам придут с задачей внедрения интерактивной карты офиса, какой рендер вы выберете? Canvas или SVG? Верхнеуровневый обзор скажет, что Canvas хорош для частых перерисовок (географические карты, игры), а SVG — когда важна работа с отдельными элементами, которые естественным образом присутствуют в DOM.Мы выбрали SVG. В этой статье не будет глубокого анализа, это живая история о том, почему мы отказались от идеи использовать Canvas, как строили карту с нуля, какие инструменты использовали, к…

  • вторник, 30 июня 2026 г. в 00:00:12
javascript
Кнопка «К началу ответа» для ChatGPT, Qwen, DeepSeek, Claude, Gemini, Grok и Perplexity: как я побе…

Спойлер: коды готовы — вставьте и пользуйтесь.Пример кнопки. Логотипы являются товарными знаками компаний.Знаете, что меня расстраивало больше всего в чатах с нейросетями? Сидишь, читаешь длинный ответ в момент генерации. Дошёл до середины, понял, что упустил какую-то деталь в начале, крутишь скролл вверх. А бот в этот момент дописывает новый абзац, и весь текст уезжает обратно вниз.Штатная стрелочка “наверх” тут не спасает. Она кидает к шапке сайта, а не к началу конкретного сообщения ассистен…

  • вторник, 30 июня 2026 г. в 00:00:11