Gulp should compare with grunt, their difference I will not say, say the use of it. Gulp/grunt is a tool that optimizes the front end workflow. For example, automatically refresh the page, combo, compression css, JS, compile less and so on. Simply put, you can use Gulp/grunt and then configure the plugin you need to do what you need to do manually before.
When it comes to Browserify/webpack, it's also about Seajs/requirejs. These four are JS modular scheme. Where Seajs/require is a type, Browserify/webpack is another type.
Seajs/require: is an online "compile" module that is equivalent to loading a CMD/AMD interpreter on the page. In this way the browser knows define, exports, module these things. Modularity is also achieved.
Browserify/webpack: is a pre-compiled module scheme, which is more intelligent than above. Use Browserify, here take Webpack for example. First, it is precompiled and does not need to load the interpreter in the browser. In addition, you write in the local JS, regardless of the amd/cmd/es6 style of modularity, it can be recognized, and compiled into the browser to understand the JS.
This will know that Gulp is a tool, and webpack and so on are modular solutions. Gulp can also configure Seajs, Requirejs, and even webpack plugins.
The difference between Webpack and gulp