开发者

Add console.profile statements to JavaScript/jQuery code on the fly

We have a thick client app using jQuery heavily and want to profile the performance of the code using firebug's console.profile API. The problem is, I don't want to change the code to write the profile statements. Take this example:

var search=function(){
    this.init=function(){
        console.log('init');
    }
    this.ajax=function(){
        console.log('ajax');
        //make ajax call using $.ajax and do some DOM manipulations here..
    }
    this.cache=function(){
        console.log('cache');
    }
}
var instance=new search();
instance.ajax();

I want to profile my instance.ajax method, but I dont want to add profile statements in the code, as that makes it difficult to maintain the code.

I'm trying to override the methods using closures, like this: http://www.novogeek.com/post/2010/02/27/Overriding-jQueryJavaScript-functions-using-closures.aspx but am not very sure how I can achieve. Any pointers on this? I think this would help many big projects to profile the code easily without a big change in code.

Here is the idea. Just run the below code in firebug console, to know what I'm trying to achieve.

var search=function(){
    this.init=function(){
        console.log('init');
    }
    this.ajax=function(){
        console.log('ajax');
        //make ajax call using $.ajax and do some DOM manipulations here..
    }
    this.cache=function(){
        console.log('cache');
    }
}
var instance=new search();

$.each(instance, function(functionName, functionBody){
    (function(){
        var dup=functionBody
        functionBody=function(){
            console.log('modifying the old function: ',functionName);
            console.profile(functionName);
            dup.apply(this,arguments);
            console.profileEnd(functionName);
        }
    })();
    console.log(functionName, '::', functionBody());
});

Now what I need is, if i say instance.ajax(), I want the new ajax() method to be called, along开发者_如何学JAVA with the console.profile statements. Hope I'm clear with the requirement. Please improvise the above code.

Regards, Krishna, http://www.novogeek.com


If you only want to modify the single instance of "search" then this should work:

$.each(instance, function(name, method){
    if (typeof method !== 'function') return;
    instance[name] = function() {
        console.profile(name);
        var ret = method.apply(this, arguments);
        console.profileEnd(name);
        return ret;
    };
});


I know this is from a long time ago but I wanted to add this in case other people find this answer. You can make anonymous/private functions work by adding a name to each one. The other comments mention doing it manually bit I wanted to explain how to:

$('.stuff').each(function() { ... });

to

$('.stuff').each(function workOnStuff() { ... });

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜