前端代码优化
1.在总路由配置上判断管理员、教师、学生三种身份,通过TemplateUrl判断进入哪个身份的页面
2.传播比监视好,依靠服务和对象引用,在scope之间传播对象的变化。如果必须创建一个监听,尽可能地早点解除绑定(通过调用由$watch返回的解绑函数来解除一个watcher)
3.与ng-show/ng-hide相比,ng-if可阻止渲染。Angular应用缓慢的常见来源是在ng-if或ng-switch上不正确使用ng-hide和ng-show。
ng-hide和ng-show简单地切换CSS display属性。在实践中这意味着任何显示或隐藏仍将在页面上,尽管看不见。任何scope将存在,所有$$watchers将触发。
Ng-if和ng-switch实际上完全删除或添加Dom。使用用ng-if删除的东西不在scope中。性能优势明显,但也有考究。具体来说,切换show/hide相对便宜,但切换if/switch相对昂贵。((1).越频繁变化,使用ng-if越糟糕;(2).scope越大,越是使用ng-if)
4.重视controllerAs语法。
$scope常常被用于将某个模型分配至某个控制器对象。这时候注入scope一般不是理想的处理方式,选择controllerAs可以实现这一目标。controllerAs也能改善结果混乱的状况,特别是在需要处理大量嵌套scope的情况下
5.减少事件的传播,使用双向绑定或者共享服务等方法来代替。$broadcast会遍历scope和它的子scope,而不是只通知注册了该事件的子scope。一个优化方式是使用$emit
6.优化ng-repeat:(1).限制列表个数(无线滚动)(2).使用track by,按需加载
7.压缩CSS。将共有的css提取出来。将插件中之前用的模板css分布到所用的模块下,用bower加载出font-awesome
8.一些不必要的操作,放到$timeout里面执行。如果不涉及数据变更,还可以加上第三个参数false,避免调用$apply。
directive中执行的$evalAsync,会在angular操作DOM之后,浏览器渲染之前执行。Controller中执行的$evalAsync,会在angular操作DOM之前执行,一般不这么用,而使用$timeout,会在浏览器渲染之后执行。
9.Console.log也耗时,发布时记得去掉它
10.将引用插件的js不打包到一起,引用bootCDN
关于性能优化链接:
http://web.jobbole.com/82060/
http://www.csdn.net/article/2013-09-18/2816972-AngularJS-performance-tuning-for-long-list
https://segmentfault.com/a/1190000000502981
http://blog.csdn.net/grandpang/article/details/51329289
用谷歌的面板来比对时间:
http://www.cnblogs.com/LibraThinker/p/5981346.html


浙公网安备 33010602011771号