慎用Ext.QuickTip和Ext.QuickTips

因为项目需求，今天特意翻看Ext.QuickTip的源代码：


特意上两段代码：

代码1：

// private 
    initComponent : function(){

// 注意this.target 
        this.target = this.target || Ext.getDoc(); 
        this.targets = this.targets || {}; 
        Ext.QuickTip.superclass.initComponent.call(this); 
    }, 

// 注意this.target 的赋值


代码2：

// private
    onTargetOver : function(e){
        if(this.disabled){
            return;
        }
        this.targetXY = e.getXY();
        var t = e.getTarget();
        if(!t || t.nodeType !== 1 || t == document || t == document.body){
            return;
        }
        if(this.activeTarget && t == this.activeTarget.el){
            this.clearTimer('hide');
            this.show();
            return;
        }
        if(t && this.targets[t.id]){
            this.activeTarget = this.targets[t.id];
            this.activeTarget.el = t;
            this.delayShow();
            return;
        }
        var ttp, et = Ext.fly(t), cfg = this.tagConfig;
        var ns = cfg.namespace;

....
   }

代码1很明确地告诉我们，如果不特定指定target的话，Extjs会默认将Document作为Target，会监听Document发出的mousemove事件

代码2也很明确地告诉我们，如果我们的Javascript中有Ext.QuickTips.init();这一句，那么只要我们在页面随意划一下鼠标，onTargetOver 事件肯定执行很多遍。


天啊，使用Extjs 的朋友们：Ext.QuickTips.init();这种很普遍的使用方式，就变得很恐怖了。只要我们一动鼠标，CPU就会拼命计算，瞬间暴涨。

为什么觉得ExtJS慢，答案就在这。


为了验证想法，我测试一下，CPU瞬间彪起来。




对于Tooltip还是自己改写好吧！

貌似是真的......
测试了一下3.4 和 最新版本ext-4.2.0.663都会出现cpu使用率 狂升.....
chrome ie都是这种情况....
以前都木注意过...

貌似 又不是 他的问题 去掉了 还是 那个样....

呵呵，那是因为页面的Ext控件不多（或者说：没有使用ext.viewport作为页面布局），导致您的测试效果不明显。

var t = e.getTarget();   
        if(!t || t.nodeType !== 1 || t == document || t == document.body){   
            return;   
        }  

注意这段代码。如果您使用ext的布局或者页面大量使用ext控件，那么ext就会给页面增加很多用于布局的div。那么，上面的这段代码就没有什么用处了。

测试 效果貌似很明显 去掉了 cpu也是飙升啊
页面上就一个window 里面放了两个form 几个表单项
不知道有什么软件 能够检测 浏览器 执行javascript的情况

比如我晃了一下鼠标 浏览器 能够检测出来 都执行了什么js代码.....

IE下有一个叫探测器的神器, 开始采样后, 页面上所有的活动都会被探测到, 包括你要的各种事件以及JS代码的执行情况.

目前未发现Chrome和FF有类似的东西, 有知道的请只知会我

在IE下是比较卡