Новости ChatGPT

Frontend Status: свежий дайджест фронтенда и AI — 04.02.2026

Привет!

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

В этом выпуске — 30+ ссылок: разбираем, почему Angular живёт в банках и корпорациях, AGENTS.md vs skills в Next.js. Плюс CSS, который заменяет десятки строк JS, React Compiler от А до Я, Vue-слоты и Regle, вайбкодинг-исповедь «я сдался», WebGL-галерея на GSAP + Three.js, и ещё много всего интересного!

Видео

AI

CSS

JS / TS

  • jаvascript-фреймворки: тренды и будущее 2026 - В 2026 году jаvascript-фреймворки эволюционируют в сторону AI-first подхода, изоморфных архитектур и асинхронности как основы, где Remix 3 выделяется как радикальный перезапуск full-stack разработки с упором на простоту и генерацию кода ИИ, а SvelteKit, SolidStart и TanStack Start продвигают мощные изоморфные паттерны, в то время как React стабилизируется, но сталкивается с конкуренцией от более лёгких и производительных альтернатив.

React

  • AGENTS.md vs skills на примере Next.js - Jude Gao из Vercel: 8 КБ файл AGENTS.md даёт ИИ-агентам 100% успеха на Next.js, в отличие от skills, котороы часто вообще игнорируются.

  • Паттерн Focus Trap в доступности интерфейсов A11y - Focus-trap-react — React компонент, который запирает фокус клавиатуры внутри модального окна, диалога или любого оверлея, делая интерфейс по-настоящему доступным для людей, управляющих только Tab и клавиатурой.

  • Гайд с практическим примером по Cache Components в Next.js 16 показывает, как смешивать статический и динамический контент на одной странице, избегая полной перезагрузки, и показывает прогрес от медленного рендеринга к мгновенному отображению контента страницы с прогрессивной подгрузкой.

  • Полный гайд по React Compiler: как, когда использовать, плюсы и минусы, от А до Я.

Vue js

  • useSlots() во Vue - зачем и кому - что такое useSlots, когда и как использовать слоты, а также практические примеры для разъяснения назначения useSlots.

  • Валидация форм с Regle - следующая ступень в воспросах валидации после Vuelidate. Если вы когда-либо создавали формы и писали повторяющуюся логику валидации, сталкивались со сложными состояниями, ошибками или потерей типобезопасности, Regle — неплохое решение.

A11y

  • Доступность вложенных интерактивных элементов -Современный CSS позволяет имитировать вложенные интерактивные элементы, расширяя область клика главной кнопки по всему контейнеру без реальной вложенности в DOM, чтобы сохранить полную доступность и удобство для всех пользователей.

Разное

  • 2 года Вайбкодинга — и я сдался: вернулся к нормальному коду - Два года вибекодил на ИИ — и понял: это чистый слоп, который выглядит круто в PR, но рушит весь проект, поэтому вернулся писать код руками — и стал быстрее, точнее и креативнее

  • Библиотека Travels - Быстрая, независимая от фреймворков библиотека для отмены/повтора действий (undo/redo). Эти функции важны для текстовых редакторов, графических приложений, конструкторов форм и любых интерактивных приложений. В отличие от традиционных систем отмены, которые копируют целые объекты состояния для каждого изменения, Travels хранит только различия, что делает его в 10 раз быстрее и более эффективной с точки зрения использования памяти.

  • JSbenchmarks - новая попытка провести сравнительный анализ производительности нескольких популярных jаvascript-фреймворков.

  • Как выбирать иконки для сайта? - существует множество бесплатных и платных библиотек иконок, настолько много, что можно утонуть в море вариантов. Брать детализированные картинки или уйти в абстракцию? Разноцветные или монохром? Как сочетать разные иконки на сайте?

  • Chrome DevTools MCP + Gemini разбирает performance trace и даёт точные фиксы за секунды - В статье показывают, как Chrome DevTools MCP сервер позволяет Gemini/Claude запускать Chrome, записывать performance trace, анализировать Core Web Vitals (LCP, CLS, TBT) и предлагать реальные оптимизации — от preload изображений до defer скриптов — прямо в чате, ускоряя дебаг в разы даже на локалхосте.

  • OpenClaw Skill для фронтенда - Этот скилл OpenClaw творит настоящую магию: генерит уникальные, production-ready фронтенд-интерфейсы с топовым дизайном, которые выглядят как работа крутого дизайнера + разработчика. Просишь компонент, страницу или целое приложение — получаешь креативный, отточенный код без шаблонной эстетики ИИ.

  • Проект заметки "Использование криптографии в веб-стандартах" опубликовала группа по вопросам безопасности W3C. По сути данный документ представляет собой руководство по криптографическим алгоритмам и их применению в ряде сценариев.

  • Что за стандарт JPEG XL, его особенности и перспективы разобрал Аарон Грог в блоге DebugBear. В статье утверждается, что это лучший формат для изображений, но пользоваться пока не стоит :)

  • Cloudflare публикует статью о несправедливом преимуществе Google в AI благодаря единому краулеру Googlebot, который используется как для индексации поиска, так и для обучения и генерации AI-контента (например, AI Overviews). Из-за доминирования Google в поиске (90% рынка в UK) издатели не могут заблокировать Googlebot без потери трафика, что позволяет Google бесплатно собирать контент для AI, в то время как конкуренты (ClaudeBot, GPTBot и др.) получают в 2–1700 раз меньше данных.

  • Как создать многостраничную WebGL-галерею изображений с эффектами раскрытия по скроллу через шейдеры рассказано в статье Creative Hub Codrops. Автор использует интересную связку технологий для современного веб-проекта: GSAP (с ScrollTrigger) для анимаций, Three.js для WebGL-рендера, Astro как фреймворк для сборки и Barba.js для SPA-подобных переходов без перезагрузки.

  • Любите рекламу? Тогда воспользуйтесь расширением, добавляющим рекламу даже на те сайты, где её нет!

  • Красивая визуализация геномов бактериофагов (т.е. вирусов, пожирающих бактерии), доступна прямо в браузере. Основная цель проекта — позволить интерактивно просматривать, анализировать и изучать структуру фагового генома прямо в браузере, без необходимости скачивать сложные программы или иметь навыки программирования. Симпатично, но мало чего понятно.

  • Ориентация карточек в интерфейсе — не просто визуальный стиль, а фундаментальное решение, которое влияет на восприятие, сканирование, плотность информации, адаптивность и пользовательское взаимодействие. Полезно не только дизайнерам, но и разработчикам, заботящимся о пользователях.

  • Если вы забыли про хэш-деревья, то можно по одной статье восстановить или получить знания. Статья с юмором даёт полный гайд о применении их в реальной жизни.

  • Вышел новый DSL язык программирования для создания музыки. Предлагаем новую парадигму программирования, пока не запантентовано: Emotion-Rhytm Paradigm!

Статья подготовлена при поддержке @CosyFrontend, @alexbraun и @DreamShaded.