DDR爱好者之家

AngularJS 整理一些优化的小技巧
站长资源 2024/11/28 佚名
4 1538
DDR爱好者之家 Design By 杰米

关于优化ng的手段网上已经有很多了,核心都是从$$watchers这个作用域内部属性说起的,今天我来说点别的,本质还是不变的,因为这是ng的硬伤,不过我相信只要运用合适的手法,这些问题还是可以避免的.

ng简介

angularjs简称ng,是google出品的mvvm框架,此在提高前端项目开发效率(实践中来看确实很能提高开发效率),以控制器,指令,服务来围绕整个项目,内部以独有的DI来解决三层之前的调用问题.更多的详情信息可以参考我之前写的ng源码分析.

ng的硬伤

说到硬伤就要先说下它的简单的数据绑定原理

ng里每个页面上定义的model其实都会在当前作用域下添加一个监听器,内部容器就是$$wachers数组,只要页面任何一个model发生变化了,就会触发作用域内部$digest方法,它会依次查找当前作用域树里的所有model,是保证页面上的模型能得到数据同步,所以这个是非常消耗程序时间的,官方的说法就是当页面上出现2000个监听器时,页面性能就会明显下降.所以要提高ng的性能,就要从这方面入手了.

tip1: 一次绑定

其实这个网上别人已经说过了,这里说下新的用法,ng的1.3.0+的版本已经内置提供了一个语法来支持模型只绑定一次的情况,看下面的例子

old code

hello

new code

hello

 可以看到新的语法就是在model前面加上::,相信这个语法要比网上用的第三方插件要方便的多了.

tip2: $scope.$digest vs $scope.$apply

相信很多人对$apply方法不陌生,它一般用在,当不在ng的环境里执行代码的时候,为了保证页面的数据同步,在代码执行完成之后调用$apply方法会触发内部$digest来检查作用域里所有的模型,其实在它的内部是这样调用的,下面只写出一些代码片段

...
...
$rootScope.$digest
...
...

 所有它其实是调用$rootScope根作用域下的$digest,那么不同作用域下的$digest有什么区别呢"color: #0000ff">$filter('filter')(array, expression, comparator);

总结

上面都是些提高ng项目性能的一些小技巧,虽然ng很强大,但是不规范的代码也会破坏它的性能,所以在写代码之前最好构思下哪些地方是不需要监听器的.

以上就是对AngularJS 优化方面的资料整理后续继续补充相关资料，谢谢大家对本站的支持！

DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

P70系列延期，华为新旗舰将在下月发布

3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。

而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？

根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米