10 Best VS Code Extensions to Boost Coding Speed

Zenon J October 16, 2023
VS Code Extensions


10 VS Code Extensions that make your coding Better

Are you an amateur programmer? Or do you have a good knowledge of programming? This article is for you. Use your best performance with VS Code. After reading this article you will thank me.

1. Prettier

This extension will help you format the code. You can configure this as needed, which gives the code a professional look.

2. Material Icons

This uses a special theme to uniquely identify the various files contained within your distribution. This gives a better look at the Visual Studio Code

VS Code Extension Marketplace Interface - Part 2

3. Live Share

Use this to allow another team member or other person to view and develop your code. What makes it special is that it can be performed live on the familiar Visual Studio platform.


4. Bracket Pair Colorizer 2

Brackets are used to write code in many languages. Sometimes it can be difficult to manage without you recognizing each other. Many developers use this extension to avoid this. This shows the starting bracket and the last bracket in one color.

VS Code Extension Marketplace Interface - Part 3
Bracket Pair Colorizer 2

5. Javascript Code Snippets

This is a great time saver for any JavaScript developer. You can retrieve the required code without having to re-type it.

6. Css Peek

This goes directly to the definition of CSS Class and Id

VS Code Extension Marketplace Interface - Part 4

7. Auto Close Tags

Closing a tag after opening in languages such as HTML and XML is a busy process. This is the best solution for you to avoid this

8. Auto Rename tags

The tag is renamed to make it easier to maintain the code when you are working with a large project. This extension is used to do this efficiently

VS Code Extension Marketplace Interface - Part 5

9. Better Comments

The best experience when writing code is to comment. This will make it easier for other members of your distribution and yourself to re-study the code. This extension is used to make this attractive and effective

VS Code Extension Marketplace Interface - Part 6



10. Live Server

If you are a web developer then this extension is a must. When working with an HTML file, you need to save the HTML code and reload the web browser to see the changes. But by using this extension you can see the changes you are making Live in the web browser.

VS Code Extension Marketplace Interface - Part 7



Pro Tips for Managing VS Code Extensions

Having too many extensions active simultaneously can slow down your editor startup time. Here are best practices for maintaining optimal editor performance:

  • Use Workspace Recommended Extensions: Create a .vscode/extensions.json file in your repository to recommend project-specific extensions without bloating your global configuration.
  • Disable Extensions Universally, Enable per Workspace: For specialized languages like Dart, Unity, or Docker, disable them globally and only enable them inside their respective project workspaces.
  • Automate Formatting on Save: Open your VS Code Settings (Ctrl + ,), search for Format On Save, and check the box to let Prettier and Black format your files automatically every time you press save.

Post a Comment

0 Comments