慎用Ext.QuickTip和Ext.QuickTips

最新推荐文章于 2018-01-24 12:30:38 发布

daniel514

最新推荐文章于 2018-01-24 12:30:38 发布

阅读量347

点赞数

文章标签： extjs JavaScript ViewUI

本文链接：https://blog.csdn.net/daniel514/article/details/84408107

版权

因为项目需求，今天特意翻看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事件

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

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

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

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

[img]http://dl.iteye.com/upload/attachment/0081/6655/6d376234-5da0-3a58-b01b-3f580b2952f8.jpg[/img]

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