Find out what is taking hard drive space in your web development computer

As web developers, we mainly write text in the form of HTML, CSS, and JavaScript.

These files are small, usually a few kilobytes, at most a few megabytes.

So how come our web development machines use gigabytes of hard drive space?

In this article, I'm going to list a few areas to look into and ways to save space.

Docker images and containers

In order to solve the "it works on my machine" issue, we use Virtual Machines to recreate production environments in our development machines.

But this means we now have multiple machines taking space in our machine.

I use Vagrant with VirtualBox or Parallels, but I simply move the virtual hard drives outside of my main drive so they are not really an issue.

However, instead of creating a VM for each of my projects, I use docker, which uses one VM and containerizes (that's a word right?) processes, so I can assign processes per project instead of whole Virtual Machines.

And this saves some space. But docker still takes a few gigabytes.

So I just make sure to set the docker container storage to the lowest it can be.

There are more things you can do to save space when using docker, like moving the docker image to an external drive, but I have not needed to do this.

Check out How docker utilizes space in Mac to get more ideas.

Node_modules folders

Ahh, node_modules. The densest objects in the universe.

They are tiny but big at the same time.

Get the size of a node_modules folder and it may be just a few megabytes. Now get the number of files in it… 😱

Now if you have a few projects each with a node_modules folder in it, well, they'll gravitate toward each other to become a supermassive black hole, the most destructive force in the universe.

I found out the hard way when trying to restore my MacBook using Time Machine and it took 3 days, even though I was using an M1 Mac and an external Thunderbolt SSD drive.

Why did it take so long?

Try moving the folder where you keep multiple JavaScript projects that use NPM to an external drive. Yep, that measly 1GB transfer will take hours to transfer. And even worse, if you transfer it to an 8GB USB drive, it may not even fit. Whaaaat! 🤯

Why are they so big? They gobble up many inodes (or hard drive blocks).

So even though their apparent size is tiny, they take significantly more space in the file system.

The best I've come up with is deleting the node_modules folders from projects I'm not actively working on.

In order not to make a mistake when deleting files, i use npx npkill

Xcode

I don't use XCode as my IDE, even though I program apps for iOS.

I develop hybrid apps using ionic or React Native.

So to save space, I simply use XCode Command Line tools.

I also use the DevCleaner app to clean up any leftovers from using XCode.

Android Studio

With Android Studio, the only thing to watch out for is to remove unnecessary SDKs.

I pretty much only use the SDK for whatever the latest mainstream android version is at the moment.

So just open Android Studio and remove SDKs you are not using.

Useful terminal commands

Here are some commands I use to find the number of files and the size taken by them in a directory.

Use this command to find the size of specific folders:

find . -name node_modules -type d -not -path "*/node_modules/*/node_modules*" -exec du -cs {} + | sort -n

Install coreutils to be able to run gdu and gnumfmt du is macOS implementation, but gdu implementation offers more options

brew install coreutils

Use this command to show total file count in a directory including its subdirectories recursively:

find . -type f | wc -l

Use these commands to list file counts for directories in a directory:

du -a | cut -d/ -f2 | sort | uniq -c | sort -nr 

or

find . | cut -d/ -f2 | sort | uniq -c | sort -nr 

or

find . -type f | cut -d/ -f2 | sort | uniq -c | sort -nr

Useful software

While creating and running commands is useful, sometimes having a graphical representation provides a faster way to figure out what is going on with your storage.

I used the following software when trying to figure out which directories had a large number of files:

• DaisyDisk
• Grandperspective

I also used CleanMyMac X to find out the total storage taken by Applications, not just in the Applications folder, but also cache and Library (Application Support and Containers).