10 трендів, у які JS/TS-розробнику варто вкласти час уже зараз

💡 Усі статті, обговорення, новини про Front-end — в одному місці. Приєднуйтесь до Front-end спільноти!

Сьогодні майже кожна стаття говорить про «агентний штучний інтелект», «агентні скіли» та «vibe coding» — коли людина накидує промпти у Cursor, а нейромережа все дописує й полірує код.

Згоден, для MVP нашвидкоруч це працює. Але спробуймо застосувати такий підхід до серйозного enterprise-клієнта з його legacy-кодом, мільйонними бюджетами та суворими аудитами — і все закінчиться ще на етапі архітектурного рев’ю.

Коротко про себе: Андрій Кучеренко, 24 роки досвіду в розробці програмного забезпечення та JavaScript-екосистемі, автор open-source-інструментів. Chief Software Engineer та архітектор.

Цей матеріал — мій робочий roadmap та особисті архітектурні ставки: напрямки, у які я вкладав би час уже зараз. Тут і глобальні індустріальні стандарти, й інструменти, які я створив, бо готових рішень не знайшов. Разом — 10 трендів, що вже змінюють роботу JS/TS-розробника: вибір технологій, проектування і навіть формат співбесід на Senior+ позиції.

Спойлер: справа не в черговій бібліотеці для промптів і точно не в «agentic whatever».

Справжній тренд № 1: MCP перестав бути експериментом

Anthropic відкрив Model Context Protocol наприкінці 2024 як спосіб під’єднувати AI-агентів до інструментів і даних. Звучало як технічна деталь. За рік MCP став де-факто стандартом, який підтримали OpenAI і Google.

Порівняння з USB-C вже встигло заїздитися по всіх статтях, але точнішого ніхто не вигадав: один роз’єм, через який агент під’єднується до будь-чого — вашої бази, вашого API, вашого dev-tool.

Якщо ваш продукт не вміє говорити мовою MCP, для агентів його просто не існує. А зараз саме агенти все частіше вирішують, який інструмент використати. Наприклад, для одного зі своїх dev-tools я зробив MCP-сервер — і тепер агенти викликають його напряму через MCP, отримуючи компактний звіт під свій контекст. Якщо у вас є dev-tool — подумайте про MCP-обгортку. Це найшвидший шлях зробити його «помітним» для агентів.

Підняти власний MCP-сервер на TypeScript — навичка рівня «вмію писати REST API» зразка 2015-го: базова, очікувана, скоро без неї на серйозний проект складно буде потрапити.

Джерело: modelcontextprotocol.io; anthropic.com/news/model-context-protocol

Справжній тренд № 2: Agent Skills

Через рік після MCP, у 2025-му, Anthropic запустив другий стандарт — Agent Skills, а в грудні 2025 відкрив його специфікацію як open standard — тим самим прийомом, що спрацював з MCP.

Що це означає на практиці:

  • Skill — це просто папка: файл SKILL.md з інструкцією плюс опціональні скрипти.
  • Вона вчить агента, ЯК робити конкретну роботу: як провести код-рев’ю, як згенерувати звіт.
  • Агент підвантажує skill, коли задача збігається з його описом.
  • Працює кросплатформно: Claude Code, Codex, Gemini CLI, Cursor.

Різниця з MCP проста, якщо тримати в голові одну вісь:

  • MCP — це доступ: типізований, керований канал до зовнішньої системи (база, API, внутрішній сервіс).
  • Skill — це процедура: запакований workflow і планка якості, яку агент виконує сам.

MCP відповідає на питання «до чого агент під’єднаний». Skill — «як саме агент робить роботу».

MCP і Skills найкраще працюють у парі, залежно від мети задачі. Потрібен доступ до системи без кастомної інтеграції — MCP. Треба зафіксувати повторюваний процес і стандарт якості — Skill.

З практики: для одного інструмента я зробив і MCP-сервер (дає агенту доступ викликати його напряму), і Agent Skill (пакує сам процес: коли і як запускати перевірку, як читати звіт). Разом вони закривають і «доступ», і «процедуру». Сьогодні тенденція така: Skills навіть популярніші, адже їх простіше створити (це файл, а не сервер) і легше поширити в команді.

Якщо обирати стартову точку — почніть із SKILL.md за гайдлайнами Anthropic (опис, тригер, progressive disclosure, scoped tools). Це швидше за MCP-сервер і дає миттєвий ефект на консистентність агента.

Джерело: документація Agent Skills — docs.anthropic.com

Справжній тренд № 3: TypeScript займає широку нішу в агентних фреймворках

Спочатку трохи контексту. До 2025 побудова агентів майже завжди означала Python-стек: LangChain, LangGraph, CrewAI. У жовтні 2024 троє ex-Gatsby (Sam Bhagwat, Abhi Aiyer, Shane Thomas) запустили Mastra — open-source TypeScript-фреймворк для AI-агентів. У квітні 2026 проект закрив $22M Series A під лідерством Spark Capital, довівши загальне фінансування до $35M.

TypeScript-розробник дедалі частіше стає аудиторією агентних фреймворків. Бо саме TS-екосистема щільно зв’язана з frontend-агентами, MCP-серверами, генеративним UI.

Висновок простий: Python заради AI-агентів вчити не обов’язково. TS-стек тепер не «альтернатива», а повноцінний шлях у production-grade agentic-системи. Візьміть Mastra або Vercel AI SDK, побудуйте свій перший workflow з memory і tool-calling за вихідні — це найшвидший спосіб переключитися з пасивного споживача статей в активного інженера AI-систем.

Джерело: mastra.ai/blog/series-a; сам фреймворк — mastra.ai

Справжній тренд № 4: Vercel будує генеративний UI як новий дефолт

За 2025 рік Vercel зробив серію релізів, які разом читаються як декларація стратегії: AI SDK 5 (липень 2025), а також AI Elements (UI-компоненти під AI) і Streamdown (стрімінг розмітки), і вже AI SDK 6 під кінець 2025.

А в центрі цієї стратегії — Vercel AI SDK (ai-sdk.dev), бібліотека, яка стала однією з де-факто для роботи з LLM у JS/TS: єдиний інтерфейс до OpenAI, Anthropic, Google, стрімінг, tool-calling, генеративний UI з коробки.

CEO Vercel (він же творець Next.js) Guillermo Rauch публічно заявляє: наступна еволюція frontend-розробки — це побудова AI-агентів. Vercel робить ставку на те, що дефолтом для агентних UI стане JS-стек, не Python.

Важливий момент — «ephemeral apps», одноразові застосунки, які агент будує під конкретний запит користувача. v0 від Vercel уже працює саме так.

Що це міняє на практиці: класична схема «дизайнер малює макет, розробник кодить» поступово відходить для значної частини задач. Замість неї агент будує UI під запит, а розробник конструює «генератори UI», задає constraints, описує дизайн-систему як код.

Шлях входу: Vercel AI SDK (ai-sdk.dev) і поняття «generative UI». Документація і приклади там — найкоротший шлях у тему. Дисципліна нова, і конкуренції в ній поки мало.

Джерело: vercel.com/blog/ai-sdk-5, vercel.com/blog/ai-sdk-6; сам SDK — ai-sdk.dev

Справжній тренд № 5: Svelte раптом релевантний — через економіку токенів

Svelte 5 Rich Harris фіналізував із новою системою реактивності — runes ($state, $derived, $effect), compiler-augmented reactivity. Менше runtime, менше boilerplate.

Чому це стало важливо: коли агент читає кодову базу, щоб зрозуміти, як працює UI, він витрачає токени на кожен рядок. Менше коду на ту саму функціональність = менше токенів = дешевша робота агента.

Є і другий бік, не менш практичний: Svelte дає агенту менше простору для помилок. Менше boilerplate, менше рівнозначних шляхів вирішити ту саму задачу, менше пасток на кшталт dependency arrays і мемоізації — менше місць, де агент може щось зламати під час рефакторингу.

Вартість $/token вже впливає на технічні рішення — і питання про те, який стек дешевший для AI-агентів, поступово переходить із теорії в архітектурні рішення та співбесіди. Цю економіку вже рахують у реальних бюджетах.

Як зловити цю хвилю? Подивіться на Svelte 5 з практичного боку, особливо якщо будуєте невеликі агентні застосунки, де кожен токен має ціну. Тут Svelte цікавий передусім як спосіб зменшити рахунок за токени — а вже потім як DX.

Джерело: svelte.dev/blog; незалежний розбір Svelte vs React в агентну еру — zackwebster.com/blog/why-svelte-is-better-than-react-in-the-ai-era

Справжній тренд № 6: TanStack — екосистема для тих, хто хоче більше контролю

Сьогодні TanStack — це не лише Query для data fetching, а ціла екосистема: Router, Start (full-stack), Form, Store, DB та AI. Його автор давно і систематично будує альтернативу Next.js без server-first догми, де в основі модульність, type-safety end-to-end, client-first. Команди, які хочуть більше контролю і менше «магії фреймворка», обирають TanStack Start.

Для junior залишається Next.js, бо там найбільша екосистема і документація. А для досвідчених інженерів TanStack стає серйозним кандидатом на greenfield-проекти, бо у 2026 корпоративні клієнти формулюють запити інакше: «Нам потрібен компонент без Next.js — з повним контролем рендеру під AI-агентів». TanStack будується поверх React як шар контролю й експертизи.

Туторіал по TanStack Router і Start закривається за один вечір. А розуміння client-first архітектури зараз додає до CV більше, ніж чергова UI-бібліотека.

Джерело: tanstack.com

Справжній тренд № 7: Rust став прихованим стандартом тулінгу

Turbopack (Next.js), Bun (runtime + менеджер пакетів), Biome (linter + formatter), oxc (компілятор) — усе це Rust-based тулінг, який дедалі частіше стає вибором за замовчуванням у JavaScript-екосистемі.

JS-розробнику не обов’язково вчити Rust. Треба розуміти, що вибір швидкого тулу здебільшого = вибір Rust-based варіанту. Я ставлю на те, що devex для JS/TS значною мірою переїде на Rust — тести, бандлінг, лінтинг, форматування, package management.

Чому це б’є по гаманцю: пайплайни, які зараз займають 5 хвилин, можуть скорочуватися до ~30 секунд. Для команд, де AI-агент запускає pipeline на кожен PR, це критично — цикл зворотного зв’язку коротшає, витрати токенів падають.

До речі, це не абстракція для мене. Я щойно переписав engine свого jscpd з Node.js на Rust — і той самий скан, що займав 83 секунди на 900 MB кодовій базі, тепер триває 3.4. Startup overhead зник, задіяні всі ядра. Коли інструмент ганяється на кожен PR, ця різниця вирішує: чекати щоразу чи отримати результат миттєво.

Дія на цей тиждень: спробуйте перейти на Bun хоча б у pet-проектах. Biome замість ESLint + Prettier. Думаю, за рік це буде помітно поширеніше, і ті, хто адаптувався раніше, отримають перевагу.

Джерело: bun.sh, biomejs.dev, turbo.build, oxc.rs

Справжній тренд № 8: Сліпа зона сучасних фреймворків, або чому більшість агентів пишуть сміття

Одразу чесно: це найменш зрілий пункт у списку — радше напрямок, ніж готовий індустріальний стандарт. Але я вже бачу, як він економить години на переробці, тож ділюся.

Усі spec-driven фреймворки перевіряють код проти специфікації. Майже жоден не перевіряє саму специфікацію — чи піддали ідею критиці до того, як почали її будувати. Через це агент бездоганно реалізує погану ідею: код чистий, тести зелені, а архітектурно це глухий кут або security-діра, яку видно тільки на проді.

Звідси напрямок, який я вважаю недооціненим — фаза опонентного аналізу (adversarial scrutiny) ще до написання коду. Моя власна реалізація — The Grilling: дебатний раунд, де один агент пропонує рішення, другий зобов’язаний його атакувати (вразливості, regression risks, порушення constitution, межі масштабованості), третій інтегрує валідні заперечення у ревізію. Легітимний результат — не покращити ідею, а відкинути її повністю.

Ключова відмінність від звичайного multi-agent debate — умова зупинки. Дебати тривають не «поки минуло N раундів», а поки атакувальник не вичерпає валідні заперечення. Критерій ближчий до рівноваги, ніж до розкладу.

І ось що я зрозумів, поки це будував: спроектувати такі дебати — ролі, межі раундів, критерії виходу — це окрема інженерна компетенція, не теорія зі статті.

Джерело: розбір підходу — стаття «The Grilling».

Справжній тренд № 9: Специфікація — це Закон

Забудьте про «хаотичні» ітерації, де розробник коментує код у стилі «я так бачу». У світі, де код генерують машини, специфікація — це Закон. І це не метафора, а правило: якщо код розійшовся зі специфікацією — правлять специфікацію, потім код. Ніколи навпаки.

За останній рік навколо цієї ідеї виросла ціла поличка інструментів. Spec Kit і Kiro дисциплінують роботу над окремою фічею — розкладають намір на кроки і ведуть агента по них. OpenSpec заходить у вже існуючий проект і додає структуру, не ламаючи код. BMad веде продукт повним циклом, від ідеї до релізу. Tessl експериментує зі spec-as-source, де згенерований код прямо несе мітку про своє походження.

Куди вкласти час: не шукайте «найкращий» — беріть той, що закриває вашу задачу. Стек тут частіше комбінують, ніж обирають раз і назавжди.

Свій фреймворк, Gangsta Agents, я побудував саме тому, що не знайшов потрібного. Усі інструменти перевіряли код проти специфікації, але жоден не критикував саму ідею до того, як її почнуть будувати — ту сліпу зону з тренду № 8. Тому вбудував обов’язкову фазу опонентних дебатів і пам’ять рішень між сесіями. Ідея проходить допит, перш ніж стати кодом.

Експеримент на тиждень: візьміть наступний pet-проект і введіть одне правило — жодного рядка коду без затвердженої специфікації. Перші дні це дратує, потім входить у звичку. А десь за місяць помічаєш, що фічі більше не доводиться переробляти з нуля: хибна ідея тепер видна ще у специфікації, а не на проді.

Джерело: Spec Kit, Kiro, OpenSpec, BMad, Tessl; Gangsta Agents.

Справжній тренд № 10: Безпека AI-агентів — нова compliance-вимога

На початку 2026 з’явилася окрема категорія інструментів — платформи, що в реальному часі ловлять «тіньових» агентів. Це агенти, яких ніхто офіційно не підключав, але вони вже працюють усередині компанії і мають доступ до даних. Раніше такої загрози майже не існувало — тепер це окремий клас ризику, який служби безпеки ще вчаться закривати.

Сигнал того ж порядку: великі гравці почали вкладати гроші саме в безпеку AI-стеку. Це визнання простого факту — екосистема будується швидше, ніж встигає її захисний шар.

Показовий приклад я отримав на власному інструменті. Прогнав copy-paste detector по 49 репозиторіях, згенерованих AI. 45 із 49 містили дубльований код. Найгірше виглядали бібліотеки скілів для агентів: інструменти, які мають вчити AI писати чисто, самі на третину складалися з повторів. Йдеться про приховані залежності в коді, який ніхто не аудитував і який уже працює у проді.

Як я читаю найближче майбутнє: частина enterprise-замовників уже починає просити AI-security audit як частину compliance. Хто з ваших агентів має доступ до prod-даних. Як логуються їхні дії. Чи можете ви відтворити рішення агента, якщо дійде до розслідування.

Перший практичний крок: додайте audit-trail у свої агентні пайплайни вже зараз. Логуйте кожне рішення агента з контекстом. Це виглядає параноєю рівно до моменту, коли клієнт попросить пояснити, чому агент зробив саме так.

Джерело: дослідження дублювання — kucherenko.github.io/cpd-vibe-coding-report, підхід Anthropic до containment — anthropic.com/engineering/how-we-contain-claude

Резюме: чому вчитися прямо зараз

Якщо ви не хочете опинитися на узбіччі, коли хвиля простого «накидання коду промптами» спаде, ось куди я особисто вкладав би час:

🟢 Spec-First підходи. Жодного рядка коду без затвердженої специфікації.

🟢 MCP. TypeScript SDK, JSON-RPC, як підняти свій сервер.

🟢 Агентний фреймворк. Mastra або Vercel AI SDK. Перший production-ready workflow з memory і tool-calling.

🟢 Adversarial scrutiny. Спроектувати дебати між агентами до написання коду.

🟢 Економіка токенів. Svelte 5 релевантний не через DX, а через $/token.

🟢 Audit-trail. Безпека агентів як окрема дисципліна.

🟢 Rust-based тулінг. Bun, Biome, Turbopack.

Це багато. Але окремої «AI-ролі» під це не з’явиться — це нові базові вимоги до full-stack JS-інженера, які прийшли за останні 6 місяців.

Досить просто писати код. Час проектувати системи, які цим кодом керують.

P.S. Якщо тема відгукнулась — я регулярно розбираю агентні інструменти, спеки та реальні інженерні кейси у своєму Telegram-каналі Math.random(). Туди потрапляє те, що не дотягує до повноцінної статті, але економить години експериментів: свіжі релізи, замітки з практики, результати замірів.

👍ПодобаєтьсяСподобалось39
До обраногоВ обраному31
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

Я заметил что вы не упоминаете Angular.
В тренде про экономику токенов он выглядит как контрпример, и в списке его нет, вы сделали это сознательно?

Честно говоря, параллельно с этой статьей я готовил статью про токеномику со сравнением фреймвоков, и там ангулар показал себя не в самом лучшем свете -t.me/mathrandomcommunity/943. В среднем картина выглядит так:
🟢 Svelte
🟡 React — +25%
🔴 Angular — +38%
Может, поэтому я не включил его в тренды, хотя за angular стоит google и очень вероятно, что они уже что-то планируют делать.

Дякую, про mcp прям відкрив для себе

Spec-First підходи

по прежнему работают очень плохо.
начальство пытается через колено внедрить это повсеместно, но никто не пытается оценить реальное КПД, которое ниже плинутса. ты обрастаешь бесконечными слоп документами и спецификациями, от чтения которых тебя начинает тошнить спустя минуту. и любое требование из которых агент может проигнорировать даже не моргнув глазом. про бесконечную трату токенов на все эти флоу я даже не заикаюсь.

По моему мнению так происходит из-за того, что мало продумывают идею, промты типа «сделай, чтобы было все хорошо и не было плохо» ллм превращает в лапшу спецификаций, от которых тошнит. Классический вопрос — «а не фигню ли я делаю» не отменяется при работе с AI, а наоборот становится еще более актуальным. И тут помочь должна «прожарка» идеи, которую можно делать с AI, можно без (про grilling я в статье тоже писал)

И тут помочь должна «прожарка» идеи

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

Вот тут не соглашусь, давно и последовательно практикую TDD и привык думать о том, что пишу до написания кода, во время написания тестов — это говорит о том, что думать и писать код можно раздельно.

+1, поки не прикрутять увагу моделей до спеки, немає сенсу туди вкладатись.

Claude Code навіть часто не заглядає у власну пам’ять, що вже казати про спеки. LLM ще не готові повноцінно вирішувати задачі без постійного підштовхування.

На даний момент найбільш цікаве і корисне, що читав по ШІ для розробників

Супер , Після фрази з

«накидання коду
промптами»

тепер в мене ’ не закритий Гельштад’ )

Гештальт!
Гельштад скоріше назва якогось німецького округу))

А .. точно .. з смартфону набирав мабуть автокорекція )

Корисно та цікаво, дякую за статтю!

Підписатись на коментарі