GitHub Copilot optimization with prompt crafting and context setting
This article covers best practices for using GitHub Copilot in Visual Studio Code, so that you make the most of your AI pair programming experience.
Note: "Prompt engineering" or "Prompt crafting" is a common phrase you'll hear when discussing AI and refers to how and what information is packaged and sent to an AI API endpoint. The Copilot extension does this process for you but you can help by providing hints to guide the extension.
Getting the most out of Copilot inline suggestions
The GitHub Copilot extension presents suggestions automatically to help you code more efficiently. There are things you can do to help ("prompt") Copilot to give you the best possible suggestions. And the good news is that you are probably already doing these right now, since they help you and your colleagues understand your code.
Provide context to Copilot
Copilot works best when it has sufficient context to know what you're doing and what you want help with. Just as you would provide a colleague with the context when asking for help with a specific programming task, you can do the same with Copilot.
Copilot looks at the current and open files in your editor to analyze the context and create appropriate suggestions. Having related files open in VS Code while using Copilot helps set this context and lets the Copilot see a bigger picture of your project.
Top level comment
Just as you would give a brief, high-level introduction to a coworker, a top level comment in the file you're working in can help Copilot understand the overall context of the pieces you are creating.
Appropriate includes and references
It's best to manually set the includes or module references you need for your work. Copilot can make suggestions, but you likely know best what dependencies you need to include. This can also help let Copilot know what frameworks, libraries, and their versions you'd like it to use when crafting suggestions.
In the following TypeScript example, we want to log the output of the
addmethod. When we don't have any includes, Copilot suggests using
On the other hand, when you add a reference to
Log4js, Copilot suggests using that framework for logging the output:
Meaningful function names
Just as a method called
fetchData() won't mean much to a coworker (or you after several months),
fetchData() won't help Copilot either. Using meaningful function names helps Copilot provide a body that does what you want.
Specific and well-scoped function comments
A function name can only be so descriptive without being overly long. Function comments can help fill in details that Copilot might need to know.
Prime Copilot with sample code
One trick to get Copilot on the right page, is to copy and paste sample code that is close to what you are looking for into your open editor. Providing a small example can help Copilot generate suggestions that match the language and tasks you want to achieve. Once Copilot begins providing you with the code you want and will actually use, you can delete the sample code from the file. This can be especially helpful to jump start Copilot to a newer library version when it defaults to providing older code suggestions.
Be consistent and keep the quality bar high
Copilot is going to latch on to your code to generate suggestions that follow the existing pattern, so the adage "garbage in, garbage out" applies.
Always keeping a high quality bar can take discipline. Especially when you're coding fast and loose to get something working, you might want to disable Copilot completions while in "hacking" mode. You can temporarily disable completions from the Copilot status menu. Bring up the Copilot status menu dropdown by selecting the Copilot Status bar item.
From the dropdown, you can disable completions entirely, or disable just for the active file type, for example Markdown files.
Getting the most out of Copilot Chat
When you're using chat to interact with GitHub Copilot, there are several things you can do to optimize your experience.
Use agents and slash commands
Agents are designed to collect extra context either about a code base or a specific domain or technology. By using the appropriate agent, Copilot Chat can find and provide better information to send to the Copilot backend. For example, use
@workspace if you want to ask questions about your open project, or
@vscode to know more about VS Code features and APIs.
Slash commands help Copilot Chat understand your intent when you ask a question. Are you learning about a code base (
/explain), do you want help with fixing an issue (
/fix), or are you creating test cases (
/tests)? By letting Copilot Chat know what you're trying to do, it can tune its reply to your task and provide helpful commands, settings, and code snippets.
You could write out your project scope or current task with a natural language query but using agents and slash commands is more concise and explicit.
Use context variables
You can use context variables to provide extra context to your questions in chat by using the
#selection context variable enables you to focus Copilot's suggestions on the specific text you select in the editor.
#file variable lets you reference specific files from your workspace in your chat prompt. This helps make the answers from Copilot Chat more relevant to your code by providing context about the file you are working with. You can ask questions like "Can you suggest improvements to #file:package.json?" or "How do I add an extension in #file:devcontainer.json?". By using the
#file variable, you can get more targeted and accurate responses from Copilot.
#editor context variable, you have control over whether to include the visible code of the active editor in your prompt to Copilot Chat. Previously, this information was automatically included when you hadn't selected text in the editor. Now, you can choose to explicitly add the visible code to the context or omit it for more general questions.
By combining the
#selection variables, you have full control over the context you provide to Copilot Chat, ensuring that you receive the most relevant and helpful answers.
Iterate on your solution
When asking Copilot Chat for help, you aren't stuck with the first response. You can iterate and prompt Copilot to improve the solution. Copilot has both the context of the generated code and also your current conversation.
Here's an example using inline chat to create a function to calculate Fibonacci numbers:
Maybe you prefer a solution that doesn't use recursion:
You can even ask Copilot to follow coding conventions or improve variable names:
Even if you've already accepted a result, you can always ask Copilot to iterate on the code later:
Chat view locations
You can access the Copilot Chat view via the Activity Bar. Like other views in VS Code, you can drag and drop the Chat view anywhere.
For example, you can move it to the Secondary Side Bar, so that you can use other views like the Explorer at the same time:
Another option is to drag and drop the Chat view into the Panel region, for example not to take away screen space for the editor.
If you need a larger display area for Copilot Chat, you can open the Chat view in the editor region. From the Chat view title bar More Actions (
...) menu, select Open Session in Editor.
Just like any open editor, you can move editor-hosted Chat views into separate Editor Groups and use display customizations such as Grid layout to have multiple chat sessions open in the editor region.
To move the Chat view back to the side bar, use the Open Session in Side Bar command in the editor title bar when the Chat view is the active editor.
More resources about prompting for Copilot
If you'd like to learn more about productively using GitHub Copilot, you can follow up with these videos and blog posts: