移动前端优化，应该找对干爹！

个人目录

1：webpack文章推荐

2：叶小钗文章推荐

3：个人项目优化

 

1>> 若是说前端构建的嗲是grunt，那么干爹就是gulp，以及新干爹（webpack）：

Webpack可以和 grunt、gulp、karma 等已有工具很好地集成。而Webpack本身并不提供模块的下载，但它能够和已有的包管理器很好的配合，咱们依然能够用npm、Bower、component等来管理你的Web开发资源，同时在Webpack中加载它们。

文章推荐以下：

 Webpack 为Web开发而生的模块管理器 ：http://hanjianwei.com/2014/09/10/webpack-package-manager-for-web/

 

2>> 前端有太多的优化手段值得考虑以及深思，以前看过叶哥前端的最佳实践，以为很受启发，文章推荐以下：

 浅谈移动前端的最佳实践：http://www.cnblogs.com/yexiaochai/p/4219523.html

 

3>>我就讲我在个人spa项目中，针对项目优化的一个点进行介绍:  针对请求作优化，作好模块化的工做

若是说MVVM的亲爹是knockout,那么它的干爹估计就是 Angular、Avalon 、Vue、React 等等，选择好一个好的mvvm框架对于项目优化维护也是很重要的，这里小菜我就不针对各个框架的好坏进行说明，孰优孰劣我以为实践+适合的场景是最好的检验方法，我项目里选用的框架是Vue + Webpack，本身一直很关注它，以为它很专一。

webpack.config.js 文件配置以下：

 

webpack.config.js 的命令:

• webpack 来执行一次开发的编译
• webpack -p for building once for production (minification)
• webpack -p 来针对发布环境编译(压缩代码)
• webpack --watch 来进行开发过程持续的增量编译(飞快地!)
• webpack -d 来生成 SourceMaps

我以为移动优化中，其中最值得去作的优化是，针对请求作优化，那么就必须得针对项目作好模块化了。

好比说:开发的时候是这个样子：

index.css
index.js
template.html

最终发布是这个样子：
build1.js

由3个请求,合并成1个，这个优化是最明显的。

截图如图1:

    

截图如图2：