angular的性能分析 -随记
$watch 的实现原理和性能分析
- 只有双向绑定的
scope才会被加入$watch队列,或者手动绑定$watch的$scope - 所有放在
$scope中的变量或函数都被加入到了$watch队列当中,每次只要$scope中的一个变量的值发生变化,Angular就会自动调用$apply或者$digest来把所有在$watch队列中的变量或函数都执行一遍,然后把当前值和上一次的值就行比较,如果有变化,就会在执行一遍(一直循环,最多11次),知道没有变化就会停止 - 任何
事件如果调用Angular的context中的函数之后,都会对$watch队列进行对比执行,不管有没有对$scope进行改变,
例如:
ng-click执行了一个函数$scope.say = function(){ \nothing }, 在这个函数里面没有任何操作,但还是会执行$watch队列
ng-repeat 的原理和性能问题
- 在
ng-repeat循环中的每一个item都会建立一个单独的scope并对每个scope中的model进行$watch. - 这样的话如果有200条数据,每条数据中5个属性要被
$watch, 那么就是200 * 5次,又因为每次脏数据检测至少都需要执行两次来保证所有变化都被应用,那么就是200 * 5 * 2, 在加上单独的ng-repeat一个和其他的model为n个,就是200 * 5 * 2 + 1 + n, 如果这个数据超过2500的话页面就会变得很慢了 - 所以如果
ng-repeat的数据只是用来展示不需要对其进行操作的话就可以取消$watch绑定,可以使用一个Angular的第三方directive: Bindonce.
angular的性能分析 -随记的更多相关文章
- 记一次docker问题定位(perf,iostat等性能分析)
背景 最近参与的项目是基于 OpenStack 提供容器管理能力,丰富公司 IaaS 平台的能力.日常主要工作就是在开源的 novadocker 项目(开源社区已停止开发)基础上进行增强,与公司的其他 ...
- angular源码分析:angular中脏活累活承担者之$parse
我们在上一期中讲 $rootscope时,看到$rootscope是依赖$prase,其实不止是$rootscope,翻看angular的源码随便翻翻就可以发现很多地方是依赖于$parse的.而$pa ...
- 转 Linux日志文件系统及性能分析
日志文件系统可以在系统发生断电或者其它系统故障时保证整体数据的完整性,Linux是目前支持日志文件系统最多的操作系统之一,本文重点研究了Linux常用的日志文件系统:EXT3.ReiserFS.XFS ...
- ------ 新春第一炮:阶乘算法性能分析与 double fault 蓝屏故障排查 Part I ------
-------------------------------------------------------------------------- 春节期间闲来无事想研究下算法,上机测试代码却遇到了 ...
- ABP给WebApi添加性能分析组件Miniprofiler
在ABP的WebApi中,对其性能进行分析监测是很有必要的.而悲剧的是,MVC项目中可以使用的MiniProfiler或Glimpse等,这些都不支持WebApi项目,而且WebApi项目通常也没有界 ...
- MySQL性能分析(转)
第一步:检查系统的状态 通过操作系统的一些工具检查系统的状态,比如CPU.内存.交换.磁盘的利用率.IO.网络,根据经验或与系统正常时的状态相比对,有时系统表面上看起来看空闲,这也可能不是一个正常的状 ...
- [Oracle]关于Oracle分页写法的性能分析及ROWNUM说明
关于分页写法的性能分析及ROWNUM的补充说明 分页写法 一.测试前数据准备 SQL> SELECT COUNT(*) FROM BPM_PROCVAR; COUNT(*) ---------- ...
- linux系统——日志文件系统及性能分析
Linux日志文件系统及性能分析 日志文件系统可以在系统发生断电或者其它系统故障时保证整体数据的完整性,Linux是目前支持日志文件系统最多的操作系统之一,本文重点研究了Linux常用的日志文件系统: ...
- MySQL索引性能分析
为什么要做性能分析 你有没有这样的情况. 面对一个你没怎么写过的.复杂的业务,你构思了很久,终于开始敲下了第一段代码. 写的过程迷迷糊糊,有的时候还能把自己搞晕了. 但你还是终于把它写完了. 但是点击 ...
随机推荐
- find_in_set 函数的语法
find_in_set 函数的语法: FIND_IN_SET(str,strList) str 要查询的字符串 strList 字段名,参数以“,”分隔,如(1,2,6,8) 查询字段(strList ...
- Train Problem II (卡特兰数+大数问题)
卡特兰数: Catalan数 原理: 令h(1)=1,h(0)=1,catalan数满足递归式: h(n)= h(1)*h(n-1) + h(2)*h(n-2) + ... + h(n-1)h(1) ...
- LVS+Keepalived 配置
LVS+Keepalived配置 环境准备 LVS1:192.168.1.1 LVS2:192.168.1.2 MySQL Server1:192.168.1.13 MySQL Server2:192 ...
- Android 粘合剂'Binder'
背景知识 要详细掌握Android 的Binder通信机制需要先提前了解一些通信原理与Linux系统的基础知识. RPC RPC(Remote Procedure Call),即远程过程调用,也被称为 ...
- appium使用相对坐标定位元素
最近在用appium做自动化时发现,有一些元素无法通过uiautomatorviewer进行定位,这样就只能通过相对坐标来进行定位了.但是,问题又来了:如何获取元素的坐标呢? 在网上找了半天也没找到相 ...
- 选题在线提交系统(html+JS+php)
前言: 作为学习委员还是有挺多的事情要忙的,比如经常统计同学们的课设题目选择结果.如果老师的要求少一点,我还可以轻松一点.但是当老师对选题有种种限制的时候,自己就估计不会那么好办了.这 ...
- C++走向远洋——30(六周,项目一1.0)
*/ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:fenshu.cpp * 作者:常轩 * 微信公众号:World ...
- 深度解析互联网大厂面试难题自定义@EnableXX系列
深度解析互联网大厂面试难题自定义@EnableXX系列 其实是一个@Import的设计技巧 创建注解@EnableXX(任何名称注解都行,只是这个名字好一些) XXConfiguration类不能 ...
- 一步步打造自己的纯CSS单标签图标库
图标作为网页设计中的一部分,其在凸显网页重要元素特性,视觉交互.引导以及网页装饰等充当的角色作用举足轻重.由于图标普遍具有尺寸小的特点,在项目实践时不宜将每个图标作为单个图片元素进行加载,这会增加Ht ...
- 简单说 通过CSS实现 文字渐变色 的两种方式
说明 这次的重点就在于两个属性, background 属性 mask 属性 这两个属性分别是两种实现方式的关键. 解释 方式一 效果图 代码 <!DOCTYPE html> <ht ...