diff -r 000000000000 -r 40c8f766c9b8 src/cm/media/js/lib/yui/yui3.0.0/examples/profiler/profiler-object-example.html --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/cm/media/js/lib/yui/yui3.0.0/examples/profiler/profiler-object-example.html Mon Nov 23 15:14:29 2009 +0100 @@ -0,0 +1,258 @@ + + + + + YUI Library Examples: Profiler: Object Profiling Example + + + + + + + + + + + + + + +
+
+
+

+ + YUI 3.x Home - + +

+
+ + +
+ + + +
+
+
+
+

YUI Library Examples: Profiler: Object Profiling Example

+
+
+ + +
+
+
+
+ +

Profiler: Object Profiling Example

+ +
+
+

This example shows using the Profiler on all methods in an object. It uses the Y.DOM object +as the object to be profiled.

+ +
+
+ + + + +
div class="bar"
+
div class="bar-baz"
+
div class="bar "
+
div class=" bar "
+
div class=" bar baz"
+
div class=" bar2 baz"
+
div class="foo"
+
div class="foo" id="bar"
+
div class="foo bar baz"
+

p class="bar"

+ + + + + + +
+
+
+ +

Object Profiling Example

+

To illustrate using the Profiler on objects, the Y.DOM and Y.Node objects are registered for profiling. This means +that all of the methods on these objects are being profiled. To +illustrate their use, a number of demo elements are added to the markup:

+
  1. <div class="bar">div class="bar"</div>
  2. <div class="bar-baz">div class="bar-baz"</div>
  3. <div class="bar ">div class="bar "</div>
  4. <div class=" bar ">div class=" bar "</div>
  5. <div class="bar baz">div class=" bar baz"</div>
  6. <div class="bar2 baz">div class=" bar2 baz"</div>
  7. <div class="foo">div class="foo"</div>
  8. <div class="foo" id="bar">div class="foo" id="bar"</div>
  9. <div class="foo bar baz">div class="foo bar baz"</div>
  10. <p class="bar">p class="bar"</p>
  11. <button id="demo-run">run</button>
<div class="bar">div class="bar"</div>
+<div class="bar-baz">div class="bar-baz"</div>
+<div class="bar ">div class="bar "</div>
+<div class=" bar ">div class=" bar "</div>
+<div class="bar baz">div class=" bar baz"</div>
+<div class="bar2 baz">div class=" bar2 baz"</div>
+<div class="foo">div class="foo"</div>
+<div class="foo" id="bar">div class="foo" id="bar"</div>
+<div class="foo bar baz">div class="foo bar baz"</div>
+<p class="bar">p class="bar"</p>
+<button id="demo-run">run</button>

The button is used to run the example. The function being called when the button is clicked is assigned by first + retrieving a Node instance for the button and then using the on method:

+
  1. <script type="text/javascript">
  2. YUI({base:"../../build/", timeout: 10000, filter:"debug", logInclude: {profiler:true, example:true}}).use(("node", "profiler"), function (Y) {
  3.  
  4. Y.Node.get('#demo-run').on('click', function(){
  5. Y.Profiler.registerObject("Y.Node", Y.Node);
  6. Y.Profiler.registerObject("Y.DOM", Y.DOM);
  7.  
  8. var results = Y.Node.all('.bar');
  9. results.addClass("newclass");
  10.  
  11. var report = Y.Profiler.getFullReport(function(data){
  12. return data.calls > 0;
  13. });
  14.  
  15. Y.Profiler.unregisterObject("Y.Node");
  16. Y.Profiler.unregisterObject("Y.DOM");
  17.  
  18. //output results
  19. var msg = "";
  20. for (var func in report){
  21. msg += (func + "(): Called " + report[func].calls + " times. Avg: " +
  22. report[func].avg + ", Min: " + report[func].min + ", Max: " + report[func].max) + "
  23. ";
  24. }
  25. alert(msg);
  26. });
  27. });
  28. </script>
<script type="text/javascript">
+YUI({base:"../../build/", timeout: 10000, filter:"debug", logInclude: {profiler:true, example:true}}).use(("node", "profiler"), function (Y) {
+ 
+    Y.Node.get('#demo-run').on('click', function(){
+        Y.Profiler.registerObject("Y.Node", Y.Node);
+        Y.Profiler.registerObject("Y.DOM", Y.DOM);
+ 
+        var results = Y.Node.all('.bar');
+        results.addClass("newclass");
+ 
+        var report = Y.Profiler.getFullReport(function(data){
+            return data.calls > 0;
+        });
+ 
+        Y.Profiler.unregisterObject("Y.Node");
+        Y.Profiler.unregisterObject("Y.DOM");
+ 
+        //output results
+        var msg = "";
+        for (var func in report){
+            msg += (func + "(): Called " + report[func].calls + " times. Avg: " +
+                report[func].avg + ", Min: " + report[func].min + ", Max: " + report[func].max) + "
+";
+        }
+        alert(msg);
+    });
+});
+</script>

The function begins be registering Y.DOM and Y.Node with the Profiler. Note that since these objects don't + exist in the global scope, the second argument is necessary for registerObject(). Then, the Y.Node.all() + method is called to retrieve nodes for each element with a class of bar. The result of this operation is a NodeList + object, on which the addClass() method is called. After that, the full report is returned and the objects are unregistered. The last + step is to output all of the information that was collected. Even though there's only two methods called explicitly in this example, + the profiled data indicates that several other methods on Y.DOM and Y.Node were called internally to accomplish the + tasks.

+ +
+ +
+
+ + + +
+ +
+

Copyright © 2009 Yahoo! Inc. All rights reserved.

+

Privacy Policy - + Terms of Service - + Copyright Policy - + Job Openings

+
+
+ + + + + +