speed/css.html

   1 <!doctype html>
   2 <html>
   3 <head>
   4         <title>Test Event Handling Performance</title>
   5         <script src="benchmark.js"></script>
   6         <script src="jquery-basis.js"></script>
   7         <script>var old = jQuery.noConflict(true);</script>
   8         <script src="../dist/jquery.js"></script>
   9         <script>
  10         var events = [], num = 400, exec = false;
  11
  12         jQuery(function(){
  13                 var p = old("p");
  14                 var s = (new Date).getTime();
  15
  16                 for ( var n = 0; n < 5; n++ ) {
  17                         for ( var i = 0; i < num; i++ ) {
  18                                 p.css("position");
  19                                 p.css("top");
  20                                 p.css("left");
  21                                 p.css("display");
  22                         }
  23                 }
  24
  25                 var oldNum = (new Date).getTime() - s;
  26
  27                 p = jQuery("p");
  28                 s = (new Date).getTime();
  29
  30                 for ( var n = 0; n < 5; n++ ) {
  31                         for ( var i = 0; i < num; i++ ) {
  32                                 p.css("position");
  33                                 p.css("top");
  34                                 p.css("left");
  35                                 p.css("display");
  36                         }
  37                 }
  38
  39                 var curNum = (new Date).getTime() - s;
  40
  41                 jQuery("#num").text( old.fn.jquery + ": " + oldNum + " " + jQuery.fn.jquery + ": " + curNum );
  42         });
  43         </script>
  44         <style>p { position: absolute; top: 5px; left: 5px; }</style>
  45 </head>
  46 <body>
  47         <p id="num">Hello there!</p>
  48 </body>
  49 </html>