📱

Get Our Mobile App

Take your business learning on the go!

Download on the App StoreGet it on Google Play

Level Up Your VS Code Productivity (Mastering AI Workflows)

Burke Holland20:36

Transcription

Долгое время я задавался вопросом, в чем разница между файлами промптов, пользовательскими инструкциями и пользовательскими агентами в Visual Studio Code. И это вопрос, который я часто слышу. Итак, в этом видео мы погрузимся в это. Мы рассмотрим все эти вещи, как они работают вместе, чтобы полностью понять, когда и где их использовать. Вы готовы? Поехали. Прежде чем мы фактически рассмотрим пользовательские инструкции, файлы промптов или пользовательские агенты, очень важно, чтобы вы поняли, как работает система промптов агента в Visual Studio Code. И это важно, потому что вам нужно будет знать, куда, по сути, эти инструкции вставляются в этот промпт. Итак, давайте быстро пройдемся по этому. Итак, если бы мы ввели какое-то сообщение, просто скажем здесь "hello world" и отправили его в чат, оно будет отправлено. Но давайте посмотрим, что на самом деле происходит за кулисами. За кулисами Copilot составляет промпт, и он начинается с системного промпта, подобного этому. И системный промпт начинается с некоторой основной идентичности и глобальных правил. И это просто очень общий материал. На самом деле, я думаю, там всего две или три строки. Это вроде как "вы — интеллектуальный ИИ-ассистент по программированию". Как бы эта общая идентичность. А затем под этим идут общие инструкции. И эти инструкции могут различаться в зависимости от модели, потому что у моделей есть различные особенности. Например, если модель очень агрессивно относится к написанию кода в чат, когда ей следует просто писать его в файл, может быть инструкция "никогда не выводить блоки кода с изменениями файлов". А затем под этим идут инструкции по использованию инструментов. И это инструкции для модели о том, как использовать инструменты, которые включены в Copilot, такие как инструмент редактирования, инструмент терминала или инструмент списка дел, любые встроенные инструменты. А затем под этим идут некоторые инструкции по форматированию вывода, которые просто говорят агенту, как форматировать вывод для токенизации в чате, чтобы такие вещи, как маленькие файлы-таблетки, которые вы увидите в Visual Studio Code, отображались правильно. Теперь следующее, что происходит, это пользовательский промпт добавляется к сообщению, которое отправляется модели. Оно еще не отправлено. Пользовательское сообщение содержит информацию об окружении. Так, информацию об операционной системе пользователя и т. д. И оно также включает информацию о рабочей области. И это буквально выглядит так. Это как бы структура вашего проекта в текстовом формате. Название проекта, папки, файлы. А затем еще один пользовательский промпт добавляется к сообщению, которое еще не было отправлено, и оно содержит информацию о контексте, такую как текущая дата и время, список открытых терминалов, которые у вас есть. Оно также содержит любые файлы, которые вы добавили в чат. Теперь, в нашем случае, мы не добавляли никаких файлов к сообщению, но если бы мы добавили файлы, как это, то они бы появились здесь, прямо здесь, в этом контексте редактора. И затем, наконец, у нас есть "hello world". И затем все это отправляется модели, и модель отвечает сообщением ассистента. И все эти вещи вместе составляют контекстное окно. Так что контекстное окно просто строится здесь. У нас есть одно, затем добавляется другое, затем добавляется еще одно, а затем все это отправляется, и затем приходит ответ, и затем это добавляется, и теперь это все контекстное окно здесь, верно, все это. И если бы мы добавили еще одно пользовательское сообщение, оно просто добавилось бы сюда и стало бы частью контекста. Хорошо, теперь вы понимаете, что на самом деле происходит, когда вы отправляете промпт. Теперь вопрос в том, что такое пользовательские инструкции, файлы промптов и пользовательские агенты, и куда они на самом деле попадают в этот промпт? Итак, давайте посмотрим на это. Вероятно, лучше всего начать с чего-то вроде пользовательских инструкций. Так что наиболее каноническое использование пользовательских инструкций — это содержать высокоуровневую информацию о вашем проекте, которая может помочь модели лучше отвечать на ваши вопросы. Например, в Visual Studio Code, если вы нажмете на шестеренку здесь, мы можем сгенерировать инструкции для чата, и это сделает именно то, что я только что сказал. Он создаст файл инструкций, содержащий высокоуровневую информацию о вашей архитектуре проекта, любые шаблоны, которые вы можете использовать. Вы можете фактически перейти и прочитать этот промпт здесь, чтобы увидеть, что именно его просят написать. Но мы рекомендуем это для каждого проекта. И это, вероятно, самый распространенный сценарий использования пользовательских инструкций. После того, как мы сгенерировали эти пользовательские инструкции, если бы мы отправили еще одно сообщение, вы увидите, когда мы это сделаем, пользовательские инструкции автоматически передаются прямо туда. Вот они. Так что этот файл передается как часть контекста. Итак, вопрос в том, где именно это отображается в промпте? Итак, на нашей диаграмме пользовательские инструкции должны отображаться прямо здесь, в системном промпте, и они фактически добавляются прямо здесь. Так что они являются последним элементом в системном промпте агента. И следует отметить, что инструкции Copilot всегда будут последним элементом в системном промпте агента, потому что вы можете создавать столько файлов инструкций, сколько захотите. Итак, позвольте мне привести пример. Этот сайт называется Awesome Copilot, и он полон файлов промптов, пользовательских инструкций и пользовательских агентов, предоставленных сообществом. Это сокровищница пользовательских инструкций, на которые вы можете посмотреть для вдохновения. Итак, мы могли бы пойти сюда и найти некоторые инструкции, которые нам нравятся. Итак, здесь таблица всех различных доступных. Итак, давайте спустимся сюда и выберем, возможно, лучшие практики NextJS для LLM. Итак, если мы нажмем "установить", это установит файл в Visual Studio Code. Мы можем продолжить и принять его. Он спрашивает нас, куда мы хотим его поместить. Мы можем поместить его в папку пользовательских данных, что сделает его глобально доступным, или мы можем поместить его в папку github/instructions, что означает, что он будет доступен только в этом проекте, что именно я и собираюсь сделать. И теперь, если вы посмотрите, мы увидим папку инструкций и файл next.js instructions внутри. И если бы мы передали еще один промпт здесь, вы, вероятно, догадаетесь, что произойдет. Оба этих файла фактически передаются. И просто для ясности, помните, что инструкции nextjs всегда будут идти перед файлом инструкций Copilot. Он всегда идет последним. Итак, в общих чертах, это пользовательские инструкции. Теперь давайте поговорим о файлах промптов. Файлы промптов — это многоразовые промпты, которые вы можете определить, а затем использовать прямо в чате. Теперь, зачем бы вы это делали? Ну, позвольте мне привести пример. Если мы хотим определить файл промпта, мы можем перейти к настройке файлов промптов. И вы можете видеть, что у меня есть куча разных файлов промптов здесь. Итак, давайте посмотрим на этот здесь, который называется "remember". Итак, я посмотрю на промпт "remember". И в промпте "remember", это промпт, который я использую для создания файла памяти. Так что я могу в любое время сказать ИИ, чтобы он просто запомнил что-то, и он это сделает. Теперь вы можете видеть здесь, в передней части, что я могу указать агент внизу. Мы просто останемся с агентом. Но затем мы также можем добавить описание. Но затем другая очень мощная вещь здесь заключается в том, что мы также можем добавить модель. И вы можете видеть, что мы получаем IntelliSense для всех доступных нам моделей. Многие из них находятся на Open Router. Некоторые из них встроены. Я буду использовать небольшую модель для этого, чтобы не тратить премиум-запросы. И это означает, что когда я использую этот файл промпта, он автоматически переключит нас на правильную модель. Итак, позвольте мне показать, что я имею в виду. Итак, скажем, модель постоянно допускает одну и ту же ошибку, пытаясь использовать useEffect в серверных компонентах, чего нельзя делать в Nex.js, и поэтому мы просто хотим, чтобы она помнила не делать этого. Итак, мы можем использовать этот файл промпта, просто набрав здесь слэш, а затем вставив наше сообщение. И когда мы отправим это, вы заметите, что мы используем Claude Opus 45, который является премиум-моделью с множителем 3x. Но когда мы отправляем его, он фактически отправляется с GPT41, потому что именно это мы указали в файле промпта прямо здесь, gpt41. И теперь он создал для нас файл инструкций. И этот файл инструкций будет автоматически добавляться к каждому запросу. Итак, вы можете видеть здесь, как я начинаю создавать рабочие процессы, используя фактически как файлы промптов, так и пользовательские инструкции. Теперь давайте вернемся к нашей диаграмме и посмотрим, где именно в системном промпте отображаются эти файлы промптов. Итак, ответ таков: они не отображаются в системном промпте. Они фактически отображаются здесь, в пользовательском промпте. Итак, в пользовательском промпте происходит следующее: содержимое этих файлов промптов добавляется прямо здесь, в самом начале. Так что даже перед информацией о контексте у нас будут файлы промптов. А затем у нас будет просто содержимое файла промпта, который был использован. А затем, ниже в этом сообщении, говорится "следуйте инструкциям в" и затем указывает обратно на содержимое этого файла промпта, но фактически использует специальный синтаксис для этого. Это как бы указывает на него по имени, хотя он фактически включен в пользовательский промпт. А затем после этого идет ваше системное сообщение, которое будет "useEffect может использоваться только в клиентских компонентах". Правильно. Вот где используются файлы промптов. И поэтому, если у нас много сообщений, они могут быть очень-очень далеко в списке, верно? Может быть, где-то там. Каждый раз, когда мы используем файл промпта, он становится частью пользовательского промпта, а не частью системного промпта. Теперь вопрос, который вы зададите, имеет ли значение размещение промпта в иерархии сообщений? И ответ таков: я не знаю. Однако "контекстное гниение" — это реальная вещь. И основная идея здесь заключается в том, что по мере роста и удлинения контекстного окна производительность модели снижается. Теперь это улучшилось со временем. Как подробно описано в статье, оно улучшилось. Но вы все равно можете видеть здесь, что по мере роста контекстного окна, например, 32 000 токенов, точность резко падает. Даже Claude 35 Sonnet снижает точность с 88% до 30%. Так что важно помнить, что по мере роста вашего промпта здесь. Итак, если у нас есть системный промпт и пользовательский промпт, и пользователь, а затем сообщение ассистента, а затем пользовательский промпт, а затем у нас есть еще одно сообщение ассистента, потому что мы не начали новый чат. Так что мы просто продолжаем и продолжаем. На самом деле не имеет значения, используете ли вы пользовательские инструкции или файлы промптов. Производительность или точность модели просто снизится. И это одна из причин, по которой окна токенов или контекстные окна в VS Code ограничены определенным моментом, и это сделано для поддержания производительности. Так что трудно ответить на вопрос, будет ли точнее передавать ваши инструкции в виде файла промпта или пользовательской инструкции. Лучшее, что можно сделать, — это вместо того, чтобы беспокоиться о позиционировании, просто использовать их так, как они предназначены, то есть для помощи вам в составлении рабочих процессов и не беспокоиться об их положении в промпте. Теперь давайте поговорим о последнем, и это пользовательские агенты. Пользовательские агенты раньше назывались пользовательскими режимами, и я создал один некоторое время назад, который назывался "beast mode", который был разработан для улучшения работы GPT4.1. И идея здесь в том, что вы можете передавать инструкции для переопределения или дополнения поведения агента по умолчанию. Итак, давайте посмотрим на них. Я хочу посмотреть на один из тех, которые мы сейчас поставляем в Visual Studio Code, а именно на режим планирования. Итак, вы можете нажать "настроить пользовательские агенты" и посмотреть на наш встроенный режим планирования здесь. Итак, давайте посмотрим на режим планирования. Вы можете видеть, что это имя и описание, а затем есть эти инструменты, а затем есть эти вещи, называемые "handoffs", к которым мы перейдем через секунду. А затем вы можете видеть, что это очень похоже на написание промпта агента. Это сильно отличается от пользовательских инструкций, верно? Если мы посмотрим на пользовательские инструкции, это отличается. Это просто дает ему информацию. Это дает ему идентичность. Так что это очень похоже на системный промпт агента. А затем он пройдет через рабочий процесс, чтобы начать процесс планирования с пользователем. Первый шаг — собрать контекст и провести исследование, затем представить краткий план для итерации, а затем обработать обратную связь пользователя. А затем он даст вам возможность либо реализовать план, либо записать план в редактор, и он делает это через "handoffs". Итак, давайте фактически запустим это и посмотрим, как это выглядит в действии. Итак, я выберу модель, которая немного лучше справляется с планированием. Я использую наш встроенный режим планирования. Итак, давайте сделаем то, что всегда делается в этих демонстрациях. Мы просто добавим темный режим в приложение. Я не знаю, почему это всегда используемый промпт, но это потому, что он визуальный, и это то, что мы можем видеть. Итак, мы позволим Haiku пройти и проработать этот план. Вы можете увидеть это, а затем мы вернемся и поговорим о том, что на самом деле происходит. Хорошо, мы используем этот новый агент планирования, и мы отправили этот промпт. Что на самом деле происходит за кулисами? Давайте вернемся и посмотрим на нашу диаграмму. Итак, что происходит, когда вы используете пользовательский агент, это следующее. Он фактически добавляется в системный промпт здесь. Итак, давайте освободим место. И пользовательский агент всегда добавляется здесь, под вашими пользовательскими инструкциями. Так что это порядок в системном промпте. Пользовательские инструкции будут добавлены в конец системного промпта, а затем инструкции пользовательского агента будут добавлены в конец системного промпта. Они являются последним элементом в системном промпте агента. Итак, теперь давайте посмотрим, как мы можем использовать пользовательские инструкции, файлы промптов и пользовательские агенты для составления агентских рабочих процессов, потому что это то, чем они являются. На самом деле нет правильного или неправильного способа их использования. Это просто строительные блоки для составления ваших собственных рабочих процессов, но это не имеет особого смысла в абстракции. Это поможет вам, если вы увидите, как это сделал кто-то другой. Итак, что я хочу сделать сейчас, это показать вам, как я составляю рабочие процессы. Итак, я собираюсь использовать файл промпта для планирования. У меня есть пользовательский файл промпта для планирования, а затем я попрошу его переработать пользовательский интерфейс этого приложения, чтобы он стал более чистым и современным. И вы заметите, что первое, что он делает, это переключает нас на Opus45, потому что именно это я определил в файле промпта. Мы можем фактически посмотреть на это. Если мы пойдем сюда, вот мой файл промпта. Вы можете видеть, что я определил модель, а затем мой файл промпта для планирования очень похож на встроенный агент, но мой файл промпта фактически инструктирует агент работать в концепции ветки. Так что план на самом деле определяет один PR или одну ветку, и он просто определяет высокоуровневые шаги. Так что он будет делать то, что делает встроенный агент планирования, например, исследовать кодовую базу и задавать мне вопросы, но формат плана, который он выдает, немного отличается, потому что это всего лишь один из строительных блоков, и это станет более понятным через секунду. Хорошо, режим планирования завершен, и у нас есть один файл, который был создан, и я автоматически создаю файл. У него есть некоторые вопросы, но они незначительные. Ничего, что мне действительно нужно решать. Но вы можете видеть, что он просто разбивает вещи на шаги. Шаг первый, сделайте это. Шаг второй, сделайте это. Идея в том, что каждый из этих шагов — это коммит. И коммиты должны быть маленькими и тестируемыми. И коммиты будут накапливаться и создавать один PR, который мы затем можем отправить. Однако у нас нет кода. Так что следующий шаг — получить код. Итак, давайте продолжим и сохраним это. И поскольку мы не хотим контекстного гниения, давайте начнем новую сессию чата. Очистим контекст. Теперь я собираюсь сделать кое-что уникальное. Вместо того, чтобы фактически реализовывать план, я попрошу его сгенерировать документ на основе этого плана. А затем я просто передам файл плана здесь. Итак, в этом случае я использую промпт "generate" и передаю план, который мы только что создали. И я объясню, что он делает. Так что промпт "generate" берет план, а затем пишет весь код, необходимый для реализации этого плана, но он не пишет этот код в проекте. Он фактически пишет его в файле markdown шаг за шагом. И причина, по которой я это делаю, заключается в том, что я пытаюсь максимально использовать использование премиум-модели. Я уже дважды использовал Claude Opus 45. Это множитель 3x. Шесть премиум-запросов. Я хочу убедиться, что получаю максимальную отдачу от своих денег. Так что я собираюсь использовать меньшую модель для реализации и большую модель для написания кода. Меньшая модель будет реализовывать его, но большая модель будет его писать. Итак, через секунду мы посмотрим на этот план реализации, и вы увидите, как именно это работает. Это не сложно. План реализации, который генерируется, длинный. Он очень длинный. Этот почти на 2000 строк, но вы можете видеть, что каждый отдельный фрагмент кода, необходимый для выполнения этой задачи, фактически находится в этом файле. Но что более важно здесь, так это то, что все они разбиты на шаги. И каждый шаг имеет здесь флажок. Итак, теперь, когда у нас есть это, мы снова очистим контекстное окно, максимально используя наш контекст. И теперь мы будем использовать пользовательский агент, который просто называется "implement". И все, что нам нужно сделать, это передать план реализации здесь, вот так, и дать ему простой промпт, а затем мы просто отправляем его. И вы можете видеть, что он автоматически переключается на VS Code Prime или Raptor Prime, который является вариантом с пятью мини, и это модель, которую я люблю использовать для реализации. Итак, мы продолжим и отправим его. Теперь, пока эта меньшая модель работает с этим документом, она будет реализовывать то, что находится в документе, дословно. Она фактически не пишет никакого кода. Она просто реализует код, написанный большой моделью. И эта стратегия позволяет вам как бы одним выстрелом использовать огромную модель, а затем реализовывать и итерировать с небольшой бесплатной моделью. И эта модель будет продолжать работать до тех пор, пока не завершит любой шаг, на котором она находится в плане реализации. А затем она остановится и вернет управление мне, чтобы я мог протестировать, убедиться, что мне это нравится, а затем я просто подготовлю и закоммичу. А затем я просто повторю то, что сделал. Использую агент "implement", передам документ реализации, и он просто продолжит с шага второго и далее. И я буду итерировать с ним таким образом, пока мы не дойдем до конца реализации и все не заработает. И тогда у меня будет пул-реквест, которым я буду очень доволен. Хорошо. Теперь у вас есть действительно хорошее понимание того, что происходит за кулисами агента в VS Code. Вы понимаете системный промпт агента и как добавляются пользовательские промпты, а также куда на самом деле попадают пользовательские инструкции и файлы промптов в этот промпт. Идите и создавайте ИИ-рабочие процессы, которые работают для вас. Я размещу ссылки на свои ниже и проверьте репозиторий Awesome Copilot, где вы найдете мои рабочие процессы, а также множество других файлов промптов, инструкций и пользовательских агентов, которые вы можете использовать сегодня. И, как всегда, счастливого кодирования.