Frontend по-флотски 👨💻
Открыть в Telegram
Новости, идеи и знания из мира разработки интерфейсов Контакт: @qmzik
Больше4 404
Подписчики
-224 часа
-367 дней
-2130 день
Архив постов
Stack Overflow запустили платформу для AI-агентов 😐
Stack Overflow представил Stack Overflow for Agents — отдельную площадку, где нейросети и вайбкодеры могут обмениваться техническими знаниями, накопленным опытом и проверенными решениями
😎 Зачем это нужно?
Современные ИИ-агенты пишут код быстро, но часто лажают: используют устаревшие библиотеки, забивают на безопасность и не знают про свежие изменения в API. Более того, один агент может потратить кучу токенов на решение бага, а после закрытия сессии этот опыт просто испаряется. Новая платформа призвана создать общую базу знаний, к которой ИИ-агенты смогут обращаться напрямую
😮 Что внутри? На платформе есть 3 формата публикаций:
— Вопросы — если агент застрял, он может описать проблему, прикрепить логи и рассказать, что уже пробовал
— TIL (Today I Learned) — быстрые разборы багов, неожиданных ошибок и неочевидных фиксов
— Blueprint — переиспользуемые архитектурные или инженерные паттерны для типовых задач
🪞 Защита от галлюцинаций и спама:
Чтобы иишки не заспамили платформу выдуманным бредом, каждого агента жестко привязывают к реальному человеку через SSO. Более того, вклад и точность иишки напрямую влияют на репутацию его владельца. Если твой бот генерирует чушь, а ты аппрувишь это в продакшн платформы — страдать будет твой личный аккаунт на Stack Overflow
Платформа уже вышла в публичную бету 🚶♂️
https://agents.stackoverflow.com/
Будущее наступает слишком быстро...
AI тулзы для быстрой и качественной разработки фронтенда 🍽
Модель
Сейчас самые популярные это Codex (gpt-5.5) и Claude Code (Opus и Fable), также, судя по code arena ещё можно уверенно использовать kimi-k2.6, minimax-m3 и glm-5.1
MCP
Figma MCP — мастхэв для точной вёрстки макетов (нужен devseat)
Playwright MCP — благодаря нему нейронка сама сможет тестить UI, делать скриншоты и анализировать их
Chrome Devtools MCP — доступ к чтению вкладок в девтулзах: анализ консоли, нетворка, делать аудиты перфоманса и т.д.
Sentry MCP — фиксим баги с нейронкой скармливая весь контекст из сентри
Скиллы
Modern Web Guidance — набор скиллов от гугла, чтобы ИИшка использовала современные технологии и бест практисы при разработке веба и экстеншенов
Context7 — актуальная документация по Next.js, React, Tailwind, Supabase, Cloudflare и т. д. Очень полезно, чтобы AI не писал код по устаревшим API
UI UX Pro Max — круто если билдишь свой пет проект и не хочешь заморачиваться по поводу дизайна
FSD — официальный скилл комьюнити для тех кто билдит по FSD, нейронка самостоятельно следует всем принципам из документации
Vercel react best practices или Vue — оптимизация React/Vue приложений
Вышел Claude Fable 5 и Claude Mythos 5: новый уровень ИИ-автономности от Anthropic 🍽
Anthropic представили новое поколение моделей под общим классом Mythos. По словам разработчиков, их возможности превосходят всё, что компания когда-либо выпускала в открытый доступ. Модели демонстрируют огромный отрыв от предшественников на сложных, долгосрочных задачах, буквально «думая» как автономные агенты.
Что завезли:
🔹 Революция в разработке (Software Engineering) Модель способна в одиночку закрывать задачи, на которые раньше уходили месяцы командной работы. В рамках тестов для компании Stripe Claude Fable 5 всего за один день выполнил масштабную миграцию в Ruby-кодовой базе на 50 миллионов строк — вручную целая команда инженеров делала бы это больше двух месяцев. На бенчмарке FrontierCode модель набрала высший балл среди всех конкурентов.
🔹 Продвинутая аналитика (Knowledge Work) Показаны лучшие результаты на финансовом бенчмарке Hebbia для задач уровня Senior-аналитика. Модель безупречно справляется с анализом документов, интерпретацией сложных графиков, поиском первопричин (root-cause analysis) и расчетом ожидаемой стоимости.
🔹 Прокачанное зрение (Vision) Новый state-of-the-art в распознавании изображений. Fable 5 может вытягивать точные цифры из перегруженных научных графиков и воссоздавать исходный код веб-приложений по одному лишь скриншоту. В качестве демонстрации: модель полностью прошла игру Pokémon FireRed, используя только сырые скриншоты экрана, без карт и вспомогательных инструментов.
🔹 Память и долгосрочный контекст Fable 5 удерживает фокус на протяжении миллионов токенов и умеет улучшать свои ответы, опираясь на собственные заметки. При подключении постоянной файловой памяти в игре Slay the Spire модель показала перформанс в 3 раза выше, чем Claude Opus 4.8.
🔹 Глубокая наука и биология В рамках закрытых тестов модель Claude Mythos 5 использовалась для проектирования белков и создания лекарств, ускорив процесс почти в 10 раз и работая на уровне профессионального ученого. Кроме того, Mythos 5 стал первой моделью, способной стабильно генерировать принципиально новые и жизнеспособные научные гипотезы в молекулярной биологии.
Безопасность и архитектурные изменения:
Поскольку модели класса Mythos обладают огромной силой (в том числе в сфере кибератак и вирусологии), Anthropic подошли к релизу осторожно:
Claude Fable 5 — версия для всех. Она оснащена жесткой системой ИИ-классификаторов безопасности. Если ваш запрос касается кибербезопасности, dual-use биологии или попыток дистилляции (копирования) модели, система плавно переключит сессию на Claude Opus 4.8. В обычных сценариях (более 95% сессий) fallback не срабатывает.
Claude Mythos 5 — точно такая же базовая модель, но с полностью снятыми ограничениями в сфере кибербеза и биологии. Доступ к ней строго ограничен правительственными программами США (Project Glasswing), ИБ-защитниками и проверенными био-лабораториями.
Новая политика данных: Для защиты от сложных многошаговых джейлбрейков вводится обязательное 30-дневное хранение логов для бизнес-клиентов (без использования этих данных для обучения).
Это дайджест этой статьи и да, я сделал его через AI (не осуждай 🙄)👇
https://www.anthropic.com/news/claude-fable-5-mythos-5
Конференция Figma config 2026 | 23-25 июня 👨💻
Что там может быть полезного?
— Каково заниматься разработкой в 2026
— AI изменит ваш процесс к лучшему
— Будущее за простыми технологиями: уроки начала 2000-х
— Дизайн приложений будущего
— Дизайн денег: как построить бренд, вызывающий доверие в эпоху AI
— Система, созданная для понимания AI
Бесплатный онлайн билет можно получить тут👇
https://config.figma.com/
VK стал современным 😃
Прикиньте новость, VK перенесли свой фронт на SPA и компонентный подход, теперь флексят этим 🍸
После перехода показатели производительности улучшились: первая отрисовка страницы ускорилась на 25%, а среднее время перехода между разделами уменьшилось в 3,5 раза. Новая архитектура позволила командам выпускать веб-обновления быстрее: время деплоя фронтенда сократилось до 20 секунд.По такому поводу решил зайти и потестить VK 🚶♂️ https://habr.com/ru/companies/vk/news/1043220/
День сурка frontend-разработчика
Зарплата стоит, скучные задачи день за днем, календарь забит созвонами, которые не влияют вообще ни на что.
Откликаешься на вакансии, а в ответ тишина либо какие-то мутные конторы. На собесах вместо нормальной оценки навыков цирк с алгоритмами на скорость, как будто ты на олимпиаде, а не работу ищешь.
И самое неприятное, пока ты варишься в этом болоте, кто-то спокойно проходит собесы и уходит в Яндекс, VK или на хорошую Валютную удаленку без лишней драмы.
Есть классные проекты и сильные команды, где разработчиков действительно ценят, дают расти, поддерживают развитие и платят достойно и ты можешь туда попасть!👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке. Также из учеников я собираю комьюнити, где уже более 220 frontend-разработчиков🫂 А в своем канале: 👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения 👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться 👉На примерах объясняю, как проходить собеседования, включая техничку 👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров А еще регулярно публикую полезные материалы: ▪️Задачи, на которых валяться кандидаты ▪️База по микрофронтам ▪️Подборка из 100+ каналов с вакансиями для разработчиков ▪️100 вопросов, которые точно помогут тебе на собеседовании ▪️Чек лист проверки своего резюме А еще у меня множество успешных кейсов и отзывов, найти их можно в канале. Реклама, erid: 2W5zFGjD7nR ИП Галактионов Тихон Витальевич, ИНН 771618975809
Ну что, кто всегда мечтал кодить с мобилки и голосом? 🙂
Я точно мечтал, планирую скоро затестить 🚀
Anthropic выкатили Claude Opus 4.8 😃
Что там нового?
1. Модель стала в 4 раза реже пропускать баги в коде по сравнению с версией 4.7. Она теперь лучше видит свои косяки, умеет «сомневаться» и реже выдает галлюцинации
2. Добавили Dynamic Workflows для масштабной автоматизации. Теперь Claude прямо в сессии может запускать сотни параллельных субагентов для решения огромных задач
3. В интерфейсе появилась переключашка, позволяющая регулировать, сколько ресурсов модель тратит на задачу
4. Fast mode теперь оптимизировали по ресурсам и сделали в 3 раза дешевле, чем раньше и выдает ответы в 2.5 раза быстрее
В тестах на кодинг (SWE-Bench Pro) Opus 4.8 набрал 69.2%, обогнав GPT-5.5 (58.6%).
gpt-5.5 остался лидером в терминальных запросах (Terminal-Bench 2.1) модель от OpenAI всё еще удерживает лидерство (78.2% против 74.6% у Claude)
https://www.anthropic.com/news/claude-opus-4-8
Вышла Antigravity 2.0 👨💻
По-любому ты слышал про неприметную IDE Antigravity от гугла, которая выглядела как VS Code с плагином на боковую панельку с AI
Они поняли направления тренда и превратили её в аналог Codex/ClaudeCode для управления агентами, которые пишут код для/за тебя. Из плюсов для нас — это встроенные MCP девтулзов от Chrome и если есть подписка PRO гугла (а её можно оформить за 300-400 рублей на год), то тебе в подарок достаётся моделька опус и соннет, помимо гугловских gemini и лимиты приятно удивляют, а не сгорают за пару промптов
Остальное всё примерно как и у конкурентов, считаю догнали. Если судить по Code Arena, то gemini-3.5-flash обогнала gpt-5.5-xhigh, но ещё позади соннет и опуса
https://antigravity.google/
Приглашаем на Frontend Mix — бесплатный митап ЮMoney для всех, кто интересуется фронтенд-разработкой 🤩
🔔 28 мая, четверг, 19:00 (мск) — приходите на митап в Санкт-Петербурге или подключайтесь онлайн.
Спикеры из ЮMoney поделятся, как работают над задачами и улучшают процессы в команде.
Вот о чём будут рассказывать:
🟣 Как спят вкладки в браузере. На живом примере разберём, как браузер усыпляет вкладки, почему из-за этого ломается real-time и какие приёмы дебага и resync помогают находить и чинить их в продакшене.
🟣 Как построить Spec-Driven платформу для генерации писем. Используя OpenAPI как единый источник правды, покажем, как описывать контракты электронных писем через спецификацию и автоматически генерировать консистентный HTML.
🟣 Подключение модуля шумоподавления в рабочее место оператора. Рассмотрим инструменты React, WebSockets, WebRTC, а также архитектуру и логику работы модуля шумоподавления.
🟣 Круглый стол — AI во фронтенде: вызовы и реальность. Обсудим влияние нейросетей на фронтенд с трёх позиций: рынка, разработки и образования.
Чтобы попасть на митап, нужна регистрация. Все подробности — на сайте Frontend Mix 👈
CSS shape-outside — плавучий текст 🏖️
Если тебе надо, чтобы текст обтекал по какой-то странной форме, которую задумал дизайнер, то сразу вспоминай про shape-outside.
Он может так:
shape-outside: circle(50%);
shape-outside: ellipse(130px 140px at 20% 20%);
shape-outside: polygon(10px 10px, 20px 20px, 30px 30px);
shape-outside: linear-gradient(45deg, white 150px, red 150px);
И даже так:
shape-outside: url("image.png");
А в Chrome 149+ (пока в бете) вообще вот так (пример из видоса):
shape-outside: shape(from 0px 0px, line to 100px 0px, curve to 150px 100px with 100px 40px / 150px 60px, curve to 100px 200px with 150px 140px / 100px 160px, curve to 50px 300px with 100px 240px / 50px 260px, curve to 100px 400px with 50px 340px / 100px 360px, line to 0px 400px, close);
CodePen поигарться (Chrome 149+)
MDN документацияTanStack попал под атаку 😬
Команда Socket нашла компрометацию 84 npm-пакетов в
@tanstack. Внутрь залетел вредонос Mini Shai-Hulud, который пытался вытаскивать секреты из CI/CD, особенно из GitHub Actions
Самое неприятное — запускался он автоматически через npm lifecycle hooks. То есть ты просто ставишь зависимость, а где-то в фоне уже начинается весёлый квест по поиску GITHUB_*, AWS, Vault и Kubernetes токенов 💩
Среди затронутых пакетов был даже @tanstack/react-router, у которого больше 12 млн загрузок в неделю. Так что это не «ну кто-то там поставил левый пакет», а прям нормальный удар по supply chain.
Как пролезли:
— через GitHub Actions
— pull_request_target
— отравление кеша между fork и base
— вытаскивание OIDC-токена из runner’а
— публикация пакетов в npm через доверенную OIDC-связку
TanStack говорит, что npm-токены не украли, а сам workflow публикации не был скомпрометирован. Но звучит всё равно так, будто CI опять оказался дырой в борту корабля 🫠
Что делать, если юзал @tanstack/*:
— проверить lock-файлы и версии пакетов
— поискать подозрительный router_init.js
— ротировать секреты, если ставил заражённые версии
— пройтись по GitHub Actions, OIDC, npm publish workflow
— не тащить pull_request_target, если не до конца понимаешь, зачем он тебе нужен
Supply chain атаки становятся всё жирнее. Уже мало просто смотреть на код в своём репозитории — теперь надо ещё понимать, что происходит в CI, npm hooks и правах публикации пакетов 🫡Адатив `<img>` стал чуточку проще 👀
Если ты когда-нибудь писал
sizes для картинок, то знаешь эту боль:
CSS живёт отдельно, srcset отдельно, брейкпоинты отдельно, а потом браузер такой: «держи 1600px картинку в карточку на 320px» 💩
Теперь для lazy-loaded картинок можно использовать sizes="auto":
<img
loading="lazy"
width="1600"
height="900"
sizes="auto, 100vw"
srcset="
image-400.jpg 400w,
image-800.jpg 800w,
image-1600.jpg 1600w
"
src="image-800.jpg"
alt="..."
/>
Браузер сам смотрит на реальный layout-размер картинки и выбирает подходящий файл из srcset, без ручного дублирования брейкпоинтов в HTML 🤤
Что важно:
— работает только вместе с loading="lazy"
— srcset должен быть с w-дескрипторами
— width и height всё ещё лучше оставлять, чтобы не ловить сдвиги соседних элементов
— 100vw после auto — это fallback для браузеров без поддержки
Небольшой облом: Chrome / Edge / Firefox уже умеют, а Safari пока в пролёте, так что это именно прогрессивное улучшение, а не призыв к рефакторингу всех sizes
Но направление кайфовое: меньше ручных брейкпоинтов, меньше копипасты CSS-логики в HTML, больше работы на стороне браузера 🏖️Как устроены агенты и RAG под капотом
Большинство разработчиков собирают RAG и агентов по туториалам или вместе с агентом, не понимая, как всё работает внутри. Из-за этого сложно дебажить проект, масштабировать его или чинить, когда система начинает вести себя не так, как ожидаешь.
Чтобы разобраться в устройстве, а не просто копировать чужой пайплайн, приходите на онлайн-лекцию от Тимура Фатыхова — инженера, который руководил DL-командой в KoronaPay. Он разберёт агентов и RAG изнутри и покажет, как собрать первые рабочие версии в n8n.
На лекции вы узнаете:
— как агенты принимают решения: инструменты, MCP, память
— из каких частей состоит RAG и как улучшить его работу
— как собрать агента и RAG в n8n
— как настроить личного агента на базе Claude Code
🔔 Лекция бесплатная и пройдёт онлайн в четверг, 7 мая, в 18:00 МСК
Регистрируйтесь по ссылке и приходите!
Реклама. ИП Фатыхов Тимур Маратович, ИНН 540132430312, Erid 2Vtzqxgqxyd
Программа JavaScript-конференции HolyJS собрана на 100% — показываем то, что лучше не пропускать
📍 14–15 мая, Москва
Узнайте, как AI автоматизирует рабочие процессы (вместе с багами 😈), меняет UI и заставляет перерабатывать фронтенд для агентов. Может, и главным языком программирования становится… английский?
Агенты делают разработку проще, но остаются задачи, которые инженер может решить только сам. Поговорим про ускорение без JS, поиск утечек памяти в Chrome, искусство Vue-компонентов, DDoS-атаки на Node.js, модульный Backend-for-Frontend и даже способы сэкономить на оперативной памяти.
На воркшопах будем писать полезные модульные тесты веб-интерфейса, сделаем «расклад на качество» и предскажем появление багов, порисуем в 4D. А еще задебажим резюме, чтобы работа находилась быстрее.
Полное расписание и подробности докладов — на сайте HolyJS.
Купить персональный билет со скидкой 15% можно по промокоду
FRONTENDPASTA
Реклама. ООО «Джуг Ру Груп». ИНН 7801341446OpenAI выкатили GPT‑5.5 🤯
OpenAI представили новую модель GPT‑5.5, и это всё больше и больше похоже на старый добрый кодинг в паре 🫠
Основной упор сделали на агентную работу: модель лучше держит контекст, сама планирует шаги, юзает тулзы, проверяет результат и не отваливается после первой же ошибки.
Для фронтенда самое интересное:
Кодинг стал жирнее
GPT‑5.5 лучше справляется с реальными задачами в кодовой базе: имплементация, рефакторинг, дебаг, тесты, проверка гипотез и вот это всё, что обычно превращает «маленькую правочку» в 12 диффов 😄
Codex стал полезнее
В Codex модель может работать с большими проектами, понимать, где именно что сломалось, и тащить задачу через несколько файлов, а не просто генерить красивый кусок кода в вакууме.
Контекст до 400K в Codex
То есть можно скормить приличный кусок проекта и не объяснять каждый раз, что Button — это не просто кнопка, а священный компонент дизайн-системы 🙃
API тоже завезли
gpt-5.5 и gpt-5.5-pro уже доступны в API. У обычной версии контекст до 1M токенов, но прайс, конечно, не для «потыкать ради интереса»: $5 за 1M input и $30 за 1M output токенов.
По бенчам тоже выглядит хорошо, что бы они не значили: Terminal-Bench 2.0 — 82.7%, SWE-Bench Pro — 58.6%, OSWorld-Verified — 78.7%.
Заменит фронтендеров? Нет, но тех, кто не умеет им пользоваться, может подвинуть 😈
Почитать подробнее 👇
https://openai.com/index/introducing-gpt-5-5/
Как frontend-разработчику вырасти в ЗП?
День сурка frontend-разработчика выглядит так
Зарплата замерла, задачи — бесконечный повтор, растет только кол-во бессмысленных созвонов
Откликаешься на вакансии — отвечают только ноунеймы, на собесах закидывают странными алгоритмами «на скорость».
И самое бесящее — пока буксуешь, кто-то вокруг спокойно забирает офферы в Яндекс и VK...
Ты тоже можешь получить оффер в компанию, в которой тебя будут ценить и хорошо платить.👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке. В своем канале: 👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения 👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться 👉На примерах объясняю как проходить собеседования, включая техничку 👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров А еще регулярно публикую полезные материалы: ▪️Задачи, на которых валяться кандидаты ▪️База по микрофронтам ▪️Подборка из 100+ каналов с вакансиями для разработчиков ▪️100 вопросов, которые точно помогут тебе на собеседовании ▪️Чек лист проверки своего резюме А еще у меня множество успешных кейсов и трогательных отзывов, найти их можно в канале. Реклама, erid: 2W5zFHVpnjK ИП Галактионов Тихон Витальевич, ИНН 771618975809
Вышел Claude Opus 4.7: что там нового? 👨💻
Релиз сфокусирован на автономном кодинге, многошаговых задачах и решении сложных проблем. По словам разработчиков, модель теперь не просто пишет код, но и думает как полноценный тиммейт
Что завезли:
— Прокачанный кодинг и автономность — модель сама ловит свои логические баги еще на этапе планирования, тащит длинные CI/CD флоу и не стопается при падении тулзов
— Зрение x3 — теперь переваривает картинки до 2576px по длине (~3.75 мегапикселей). Идеально для pixel-perfect верстки по плотным макетам и анализа сложных схем
— Новый extra high уровень — между high и max для тонкой настройки баланса между качеством раздумий и скоростью. В Claude Code он теперь стоит по дефолту
— Фичи для разработчиков — завезли Task Budgets в API (beta), чтобы лимитировать траты на долгих задачах, и команду
/ultrareview в Claude Code для дотошного код-ревью архитектуры
В чем подвох:
— Расход токенов вырос — новый токенизатор ест в 1.0–1.35 раза больше токенов на тот же промпт. Плюс модель стала больше "думать" (особенно на высоких уровнях), что тоже раздувает аутпут
— Буквальность — Opus 4.7 перестал додумывать. Если раньше модель прощала расхлябанные инструкции, теперь она выполняет всё строго буквально. Старые промпты придется переписать.
— Жесткие сейфгарды — вшили автоматическую блокировку потенциально опасных запросов по кибербезопасности
Анонс 👇
https://www.anthropic.com/news/claude-opus-4-7Бесплатный воркшоп по Claude Code 🤖
21 апреля у Frontend Masters будет бесплатный онлайн-воркшоп по Claude Code, а вести его будет Lydia Hallie из Anthropic.
Программа:
— Что такое Claude Code на самом деле
— Как правильно настраивать CLAUDE.md
— Как работать с план модом и пермишенами
— Как собирать скиллы под свои сценарии
— Как написать свой MCP сервер с нуля и продвинутое использование клода
Регистрация 👇
https://frontendmasters.com/workshops/advanced-claude-code/
Уже доступно! Исследование Telegram 2025 — ключевые инсайты года 
