Video Notes

The “March 2024” release of Visual Studio Code was released on April 4th (their release names are always a month behind). You can see a list of their key highlights here, but in this guide I focus on three of my favorite updates they introduced.

Feature 1) Distinguish between editors with same file names

This new feature allows you to fine tune the labels you see for your files in the tab bar. Example:

Find this feature by searching your settings for "workbench.editor.customLabels.patterns".

In the video I create the following Item which makes it so that any file found in routes/ will display as "${filename} routes (${dirname(1)}) in the tab bar:

Here’s the JSON for that setting:

"workbench.editor.customLabels.patterns": {
  "routes/**": "${filename} routes (${dirname(1)})"
},

Feature 2) Add markers to the mini-map

This next features makes the mini-map much more useful because you can create markers for different parts of your file. To do this, just prefix a comment with MARK:.

For example, in the video I added a marker before all my PHP-related settings in my VSCode settings.json file:

// MARK: PHP Settings
"php-cs-fixer.lastDownload": 1712157367623,
"php.suggest.basic": false,
"php.validate.enable": false,
"php-cs-fixer.executablePath": "${extensionPath}/php-cs-fixer.phar",
"php-cs-fixer.onsave": true,
"php-cs-fixer.formatHtml": true,

I did the same thing for my JavaScript-related settings.

The end result in the mini-map:

Feature 3) Extension updates without reloading VSCode

Now when you update extensions, you have the option to reload just that extension instead of having to restart VSCode. It's a simple improvement but handy when you’re in the flow and just want to quickly update an extension and get back to work.