Most of my work involves updating old code, and moving it from ancient desktop applications to web-based applications. So I regularly have to read through lots of dusty cobweb-covered 🕸️ code.

Recently I opened one of these old code files in VS Code, and discovered, or perhaps re-discovered something very useful. I say re-discovered because I had a vague memory of this trick, but had long since abandoned its use.

I'm talking about regions in code.

What are Regions?

A region is a simple code comment that marks a section of code as a region of code and allows the editor to know that the region can be collapsed. Now, you might be thinking, that I can collapse a function in any modern editor/IDE anyway, and you are right, but stick with me a little while longer.

Here is some simple code, viewed in VS Code.

Next, we are going to add a region code comment on line 9.

Notice the mini-map of the code in the top right, it shows the region name, making it very easy to find areas of code.

Personally, I found this very handy, and at that point reached out to some of my fellow developers, most of them knew about regions and code collapsing, but, as we mentioned, people thought it was pointless because you can collapse functions anyway. What none of them knew about was this nice highlighting functionality in VS Code. So I thought if I know a lot of people who don't know about it, it might be worth posting about.

So, let's have a look at that whole, 'you can collapse functions anyway' issue.

Here we have added a region around the interface we are using for the function properties. Again, we can see the highlighting in the mini-map, but what is the point of doing that? If we collapse the function, then we probably don't want to see the interface either right?

So here we have wrapped both the interface and the function in one region.

The result is that now when we collapse that region, we collapse everything, making code much easier to read and navigate through. Without using a region you would have to collapse the function, and the interface, rather than everything all at once.

Final Thoughts 🧠

For some people adding regions to the code would just be an extra step that adds nothing to the functionality of the product, so why do it?

To others, it is a useful way to hide chunks of code and to help you navigate in the mini-map. I spoke previously about working with people who maintain that old code, well one of the issues they always seem to have if having to work on something a little more modern is navigating around the code, they are used to their VB6 editor. This really helps them find their way around.

Personally, I prefer to break my code into smaller chunks that are in separate files, so I ideally don't have large files that would need lots of regions, but I do see the benefits if you do have larger file sizes.

The ability to quickly navigate in the mini-map is really cool.

There are some VS Code extensions that also add more to the functionality of regions, they might be worth checking out if it is something you use.