Big files take longer to load. However, as projects get bigger and more complex, they require a lot of code. We could try to write code using as few characters as possible, but this can make it very hard to read. Can we write code that is easy to read but fast to download?
Build tools allow us to do just that. We can improve source code readability with functions, comments, and more. Webpack will remove much of this when creating the content served to the end-user. We can write easy-to-read code, run Webpack on it, and give the processed version to users. Both versions display the same content, and the user wouldn’t know the difference.
Take a look at the code in index.js.
Then, run the
build command we defined in the previous lesson.
There’s still going to be a warning about the mode, we will fix that in Exercise 5.
Check out the output in dist/main.js. Notice that there is less code than in the source file.
Click “Run” when ready to proceed.