CSS и JS:
К примеру, у вас имеется большое количество (Х штук)
css или
js файлов, которое вы подключаете на своих страницах посредством тэгов
<link> и
<src>.
При загрузке страницы, браузер клиента будет отправлять X запросов к вашему серверу, а ваш сервер должен будет ответить на X запросов.
Это:
- Тормозит загрузку страницы - будете ждать ответа от сервера
- Загружает ваш сервер
С помощью сборщиков фронтэнда вы можете "склеить" все файлы в один - main.css и main.js, которые будут отдаваться 2 запросами с сервера. Также, вы сможете минифицировать CSS и JS. Под минификацией подразумевается уменьшение размеров файла на диске. Естественно, более легкий файлы будет быстрее прогружаться + минимальное количество запросов к серверу.
IMG:
К примеру, у вас имеется Х изображений размером 700 Кбайт. Клиенту надо будет загрузить 700 * X Кбайт. Если вы пропустите свои изображения через
Gulp, то вы получите изображения с меньшим размером на диске и такого же качества, т.е. клиенту придется прогрузить примерно (500-600) * X Кбайт.