YUI recommends YUI3.
YUI 2 has been deprecated since 2011. This site acts as an archive for files and documentation.
This documentation is no longer maintained.
The YUI Profiler is a simple, non-visual code profiler for JavaScript. Unlike most code profilers, this one allows you to specify exactly what parts of your application to profile. You can also programmatically retrieve profiling information as the application is running, allowing you to create performance tests YUI Test or other unit testing frameworks.
To use the Profiler, include the following source files in your web page:
<!-- Dependencies --> <script src="http://yui.yahooapis.com/2.9.0/build/yahoo/yahoo.js"></script> <!-- Source File --> <script src="http://yui.yahooapis.com/2.9.0/build/profiler/profiler-min.js"></script>
<!-- Dependencies --> <script src="http://yui.yahooapis.com/2.9.0/build/yahoo/yahoo.js"></script> <!-- Source File --> <script src="http://yui.yahooapis.com/2.9.0/build/profiler/profiler-min.js"></script>
Instead of copying and pasting the filepaths above, try letting the YUI dependency Configurator determine the optimal file list for your desired components; the Configurator uses YUI Loader to write out the full HTML for including the precise files you need for your implementation.
Note: If you wish to include this component via the YUI Loader, its module name is profiler
. (Click here for the full list of module names for YUI Loader.)
Where these files come from: The files included using the text above will be served from Yahoo! servers. JavaScript files are minified, meaning that comments and white space have been removed to make them more efficient to download. To use the full, commented versions or the -debug
versions of YUI JavaScript files, please download the library distribution and host the files on your own server.
Order matters: As is the case generally with JavaScript and CSS, order matters; these files should be included in the order specified above. If you include files in the wrong order, errors may result.
The simplest way to use is Profiler is to register a single function for profiling using the registerFunction()
method. In order to register a function, it must exist on an object. Since global functions exist on the window
object, they can be profiled; functions declared within other functions cannot be profiled unless assigned onto an
object. If the function exists globally, then you can just pass in the fully-qualified name of the function:
//global function function sayHi(){ alert("hi"); } var myObject = { getName : function(){ return "MyObject"; } }; //register the global function for profiling - pass in window to indicate a global function YAHOO.tool.Profiler.registerFunction("sayHi", window); //register method on a global object - no second argument needed YAHOO.tool.Profiler.registerFunction("myObject.getName"); //alternate - providing second argument doesn't hurt YAHOO.tool.Profiler.registerFunction("myObject.getName", myObject);
//global function function sayHi(){ alert("hi"); } var myObject = { getName : function(){ return "MyObject"; } }; //register the global function for profiling - pass in window to indicate a global function YAHOO.tool.Profiler.registerFunction("sayHi", window); //register method on a global object - no second argument needed YAHOO.tool.Profiler.registerFunction("myObject.getName"); //alternate - providing second argument doesn't hurt YAHOO.tool.Profiler.registerFunction("myObject.getName", myObject);
In this example, there is a global function sayHi()
and a global object myObject
. These
can both be profiled by calling the registerFunction()
method. For sayHi()
, the first
argument is the name of the function and the second argument is the owner object, window
. For the
myObject.getName()
method, the second argument is not necessary because the first argument contains
the fully-qualified name of method. Since myObject
exists globally, this string can be evaluated to
get all of the information that the Profiler needs.
Once a function is registered for profiling, it can be called as usual. The Profiler can then be queried to retrieve information about any of the functions it is profiling. To retrieve information about a particular function, use any of the following methods:
getAverage(name)
- returns the average amount of time (in milliseconds) that the function takes to complete.getCallCount(name)
- returns the number of times that the given function was called.getMax(name)
- returns the minimum amount of time (in milliseconds) that the function takes to complete.getMin(name)
- returns the maximum amount of time (in milliseconds) that the function takes to complete.getFunctionReport(name)
- returns an object containing all of the profiling information for the function.Each of these methods accepts a single argument: the name of the function. This is the fully-qualified name
that was used with registerFunction()
. For example:
//get the average amount of time it took sayHi() to run var average = YAHOO.tool.Profiler.getAverage("sayHi"); //get the number of times myObject.getName() was called var callCount = YAHOO.tool.Profiler.getCallCount("myObject.getName"); //get the full report for sayHi() var report = YAHOO.tool.Profiler.getFunctionReport("sayHi");
//get the average amount of time it took sayHi() to run var average = YAHOO.tool.Profiler.getAverage("sayHi"); //get the number of times myObject.getName() was called var callCount = YAHOO.tool.Profiler.getCallCount("myObject.getName"); //get the full report for sayHi() var report = YAHOO.tool.Profiler.getFunctionReport("sayHi");
When you are done profiling, you can unregister the functions by using unregisterFunction()
, which
undoes all of the profiling instrumentation and deletes all profiling data about the given function. Always make
sure to retrieve the profiling data for functions before calling unregisterFunction()
. To unregister
a function, just pass in the same name that was passed into registerFunction()
; no other information
is necessary.
//unregister sayHi YAHOO.tool.Profiler.unregisterFunction("sayHi"); //unregister myObject.getName YAHOO.tool.Profiler.unregisterFunction("myObject.getName");
//unregister sayHi YAHOO.tool.Profiler.unregisterFunction("sayHi"); //unregister myObject.getName YAHOO.tool.Profiler.unregisterFunction("myObject.getName");
Profiling constructors is very similar to profiling functions, with the sole exception being the registration of all methods on the prototype for profiling as well. Registering a constructor means that all object instances created via that constructor are being profiled and the results are being aggregated into a single record. For example:
//constructor function MyObject(name){ this.name = name; } MyObject.prototype.getName = function(){ return this.name; }; MyObject.prototype.setName = function(name){ this.name = name; }; //register the constructor YAHOO.tool.Profiler.registerConstructor("MyObject", window); //create some instances var o1 = new MyObject("Instance 1"); var o2 = new MyObject("Instance 2"); var o3 = new MyObject("Instance 3"); //make some calls var name = o1.getName(); o2.setName("Another name"); o1.setName("And another name"); //get the information var constructorCalls = YAHOO.tool.Profiler.getCallCount("MyObject"); //3 var getNameCalls = YAHOO.tool.Profiler.getCallCount("MyObject.prototype.getName"); //1 var setNameCalls = YAHOO.tool.Profiler.getCallCount("MyObject.prototype.setName"); //2
//constructor function MyObject(name){ this.name = name; } MyObject.prototype.getName = function(){ return this.name; }; MyObject.prototype.setName = function(name){ this.name = name; }; //register the constructor YAHOO.tool.Profiler.registerConstructor("MyObject", window); //create some instances var o1 = new MyObject("Instance 1"); var o2 = new MyObject("Instance 2"); var o3 = new MyObject("Instance 3"); //make some calls var name = o1.getName(); o2.setName("Another name"); o1.setName("And another name"); //get the information var constructorCalls = YAHOO.tool.Profiler.getCallCount("MyObject"); //3 var getNameCalls = YAHOO.tool.Profiler.getCallCount("MyObject.prototype.getName"); //1 var setNameCalls = YAHOO.tool.Profiler.getCallCount("MyObject.prototype.setName"); //2
In this example, there is a global constructor MyObject
that has two methods on its
prototype. By registering the constructor, three entries are made in profiler, one for MyObject
,
one for MyObject.prototype.getName
and one for MyObject.prototype.setName
. When
the constructor is used to create new object instances, the profiler automatically takes note and aggregates
that information. Even though methods are called on individual instances, the data is still collected into one
location.
Note: The Profiler cannot profile methods that are defined inside of the constructor. If
you create objects that have methods defined in the constructor, it is better to create the instance and
then use registerObject()
on the instance.
When you are done profiling, you can unregister the constructor by using unregisterConstructor()
, which
undoes all of the profiling instrumentation and deletes all profiling data about the given constructor and all
of its methods. To unregister a constructor, just pass in the same name that was passed into registerConstructor()
; no other information
is necessary.
//unregister MyObject YAHOO.tool.Profiler.unregisterConstructor("MyObject");
//unregister MyObject YAHOO.tool.Profiler.unregisterConstructor("MyObject");
When an object exists with multiple methods to be profiled, it may be faster to call registerObject()
,
which registers every method found on the object. This can be especially useful in the case of object literals and
inheritance done without using prototypes. The first argument is the name of the object (its name in the profiler)
while the second argument is the actual object. Each method is registered as objectName.methodName
in
the profiler. Example:
//object var obj = { add : function (num1, num2) { return num1 + num2; }, subtract : function (num1, num2){ return num1 - num2; } }; //register the object YAHOO.tool.Profiler.registerObject("obj", obj); //use the methods var sum = obj.add(5, 10); var diff = obj.subtract(20, 12); var sum2 = obj.add(10, 40); //get the information var addCalls = YAHOO.tool.Profiler.getCallCount("obj.add"); //2 var subtractCalls = YAHOO.tool.Profiler.getCallCount("obj.subtract"); //1
//object var obj = { add : function (num1, num2) { return num1 + num2; }, subtract : function (num1, num2){ return num1 - num2; } }; //register the object YAHOO.tool.Profiler.registerObject("obj", obj); //use the methods var sum = obj.add(5, 10); var diff = obj.subtract(20, 12); var sum2 = obj.add(10, 40); //get the information var addCalls = YAHOO.tool.Profiler.getCallCount("obj.add"); //2 var subtractCalls = YAHOO.tool.Profiler.getCallCount("obj.subtract"); //1
In this example, an object obj
contains two methods, add()
and subtract()
. Both
methods are registered when obj
is passed into the registerObject()
method. Information about
the methods is then returned via getCallCount()
by passing in the complete method names of obj.add
and obj.subtract
.
When you are done profiling, you can unregister the object by using unregisterObject()
, which
undoes all of the profiling instrumentation and deletes all profiling data about the given object and all
of its methods. To unregister an object, just pass in the same name that was passed into registerObject()
; no other information
is necessary.
//unregister MyObject YAHOO.tool.Profiler.unregisterObject("obj");
//unregister MyObject YAHOO.tool.Profiler.unregisterObject("obj");
If you'd like to get the results of all profiling, the getFullReport()
method can be called. This method
returns an object containing all of the profiling information for every registered function (the data for each function
is destroyed when it's unregistered, so this method should be called before unregistering all functions). The
getFullReport()
method returns an object in the following format:
{ "function_name1": { calls : 0, avg : 0, max: 0, min: 0, points : [] }, "function_name2": { calls : 0, avg : 0, max: 0, min: 0, points : [] }, "function_name3": { calls : 0, avg : 0, max: 0, min: 0, points : [] } }
{ "function_name1": { calls : 0, avg : 0, max: 0, min: 0, points : [] }, "function_name2": { calls : 0, avg : 0, max: 0, min: 0, points : [] }, "function_name3": { calls : 0, avg : 0, max: 0, min: 0, points : [] } }
If you'd like to only return profiling information based on certain criteria, you can pass in an optional filter
function to getFullReport()
. This filter function receives a single argument, which is the report
for an individual function. You can use this data to determine which data to include. The function should return
true to include the data and false to ignore it. For example, to get a report for functions that were called at
least once, the following can be used:
//get report var report = YAHOO.tool.Profiler.getFullReport(function(report){ return (report.calls > 0); });
//get report var report = YAHOO.tool.Profiler.getFullReport(function(report){ return (report.calls > 0); });
Using a filter produces an object in the same format as when the filter is not provided; the only difference is the set of functions included in the report.
Since the Profiler works from within JavaScript, there are some limitations:
arguments.callee
will not be profiled correctly. If possible, avoid
using arguments.callee
in favor of the fully-qualified function name.YAHOO.lang.extend()
to be profiled correctly, both the superclass constructor
and the subclass constructor must be registered with the Profiler prior to the call.About this Section: YUI generally works well with mobile browsers that are based on A-Grade browser foundations. For example, Nokia's N-series phones, including the N95, use a browser based on Webkit — the same foundation shared by Apple's Safari browser, which is found on the iPhone. The fundamental challenges in developing for this emerging class of full, A-Grade-derived browsers on handheld devices are:
There are other considerations, many of them device/browser specific (for example, current versions of the iPhone's Safari browser do not support Flash). The goal of these sections on YUI User's Guides is to provide you some preliminary insights about how specific components perform on this emerging class of mobile devices. Although we have not done exhaustive testing, and although these browsers are revving quickly and present a moving target, our goal is to provide some early, provisional advice to help you get started as you contemplate how your YUI-based application will render in the mobile world.
More Information:
The YUI Profiler works without any major issues on the Nokia N95 and Apple iPhone default browsers and we'd expect similar behavior on other A-Grade-based mobile browsers.
The YUI Library and related topics are discussed on the on the YUILibrary.com forums.
Also be sure to check out YUIBlog for updates and articles about the YUI Library written by the library's developers.
The YUI Library's public bug tracking and feature request repositories are located on the YUILibrary.com site. Before filing new feature requests or bug reports, please review our reporting guidelines.
All YUI 2.x users should review the YUI 2.8.2 security bulletin, which discusses a vulnerability present in YUI 2.4.0-2.8.1.
Copyright © 2013 Yahoo! Inc. All rights reserved.