Grunt学习——简化静态资源

注：此篇文章是《JavaScript Web应用开发》的学习笔记！

---

简化的目的和拼接类似，都是为了减轻网络连接的负担。但是不同的是，简化只是通过删除空白，缩短变量名，以及优化代码的句法树来缩减文件大小。要付出的代价便是简化后的代码几乎没有可读性。

还有一种是在服务器端做GZip压缩。这个我没试过，不过书上说，简化静态资源的效果较之更明显。

需要注意的是，虽然把代码弄乱了，但是别人仔细研究的话还是可以看明白的，所以不要把敏感代码放在前端。简化和拼接比较适合在发布的时候给最终用户使用，开发的话可能会影响效率哦。

使用grunt-contrib-uglify包简化JS文件。

---

如果想进一步提升系统性能，可以先拼接后简化。这里介绍一下任务别名这个好用的函数。每当运行Grunt时, 你可以为其指定一个或多个任务, 这些任务用于告诉Grunt你想要它做什么事情。

grunt.registerTask(taskName, [description, ] taskList)

创建别名时可以提供描述信息，执行grunt –help命令时会显示这个信息。在taskList 中指定的每个任务都会按照其出现的顺序依次执行。taskList参数必须是一个任务数组。

这里只介绍普通的用法，深入了解请参考《Grunt中文文档 》。
http://www.kancloud.cn/manual/grunt/71452

需要注意的是，创建了任务别名后，配置任务时需将tasklist的任务都配置在同一个initConfig方法中配置。

grunt.initConfig({
      concat:{
          js:{
               files:{
                     'src/js/bundle.js':'src/js/**/*.js'
                     }
             }
      },

      uglify:{
          bundle:{
              files:{
                    'build/js/bundle.min.js':'src/js/bundle.js'
                    }
                 }
            }
      });