bohde · March 25, 2011 01:28
diff --git a/setZeroTimeout.html b/setZeroTimeout.html

 <!DOCTYPE HTML> 
 <!-- zero-timeout.html, L. David Baron <[email protected]>, 2010-03-07, 2010-03-09 --> 
 <!--
 
 Copyright (c) 2010, The Mozilla Foundation
 All rights reserved.
 
 Redistribution and use in source and binary forms, with or without
 modification, are permitted provided that the following conditions are
 met:
 
    * Redistributions of source code must retain the above copyright
      notice, this list of conditions and the following disclaimer.
    * Redistributions in binary form must reproduce the above copyright
      notice, this list of conditions and the following disclaimer in
      the documentation and/or other materials provided with the
      distribution.
 
 THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS
 IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED
 TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
 PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
 HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
 SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
 TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
 PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
 LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
 NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
 SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 
  --> 
 <html lang="en-US"> 
 <head> 
    <title>Demo: Using postMessage to do setTimeout with a real zero timeout</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <script type="text/javascript"> 
 
    // BEGIN implementation of setZeroTimeout
 
    // Only add setZeroTimeout to the window object, and hide everything
    // else in a closure.
    (function() {
        var timeouts = [];
        var messageName = "zero-timeout-message";
 
        // Like setTimeout, but only takes a function argument.  There's
        // no time argument (always zero) and no arguments (you have to
        // use a closure).
        function setZeroTimeout(fn) {
            timeouts.push(fn);
            window.postMessage(messageName, "*");
        }
 
        function handleMessage(event) {
            if (event.source == window && event.data == messageName) {
                event.stopPropagation();
                if (timeouts.length > 0) {
                    var fn = timeouts.shift();
                    fn();
                }
            }
        }
 
        window.addEventListener("message", handleMessage, true);
 
        // Add the one thing we want added to the window object.
        window.setZeroTimeout = setZeroTimeout;
    })();
 
    // END implementation of setZeroTimeout
 
 
    // BEGIN demo that uses setZeroTimeout
 
    function runtest() {
        var output = document.getElementById("output");
        var outputText = document.createTextNode("");
        output.appendChild(outputText);
        function printOutput(line) {
            outputText.data += line + "\n";
        }
 
        var i = 0;
        var startTime = Date.now();
        function test1() {
            if (++i == 100) {
                var endTime = Date.now();
                printOutput("100 iterations of setZeroTimeout took " +
                            (endTime - startTime) + " milliseconds.");
                i = 0;
                startTime = Date.now();
                setTimeout(test2, 0);
            } else {
                setZeroTimeout(test1);
            }
        }
 
        setZeroTimeout(test1);
 
        function test2() {
            if (++i == 100) {
                var endTime = Date.now();
                printOutput("100 iterations of setTimeout(0) took " +
                            (endTime - startTime) + " milliseconds.");
            } else {
                setTimeout(test2, 0);
            }
        }
    }
 
    // END demo that uses setZeroTimeout
 
    </script> 
 </head> 
 <body onload="runtest()"> 
 
 <h1>Demo: Using postMessage to do setTimeout with a real zero timeout</h1> 
 
 <pre id="output"></pre> 
 </body> 
 </html>

	<!DOCTYPE HTML>
	<!-- zero-timeout.html, L. David Baron <[email protected]>, 2010-03-07, 2010-03-09 -->
	<!--

	Copyright (c) 2010, The Mozilla Foundation
	All rights reserved.

	Redistribution and use in source and binary forms, with or without
	modification, are permitted provided that the following conditions are
	met:

	* Redistributions of source code must retain the above copyright
	notice, this list of conditions and the following disclaimer.
	* Redistributions in binary form must reproduce the above copyright
	notice, this list of conditions and the following disclaimer in
	the documentation and/or other materials provided with the
	distribution.

	THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS
	IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED
	TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
	PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
	HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
	SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
	TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
	PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
	LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
	NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
	SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

	-->
	<html lang="en-US">
	<head>
	<title>Demo: Using postMessage to do setTimeout with a real zero timeout</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<script type="text/javascript">

	// BEGIN implementation of setZeroTimeout

	// Only add setZeroTimeout to the window object, and hide everything
	// else in a closure.
	(function() {
	var timeouts = [];
	var messageName = "zero-timeout-message";

	// Like setTimeout, but only takes a function argument. There's
	// no time argument (always zero) and no arguments (you have to
	// use a closure).
	function setZeroTimeout(fn) {
	timeouts.push(fn);
	window.postMessage(messageName, "*");
	}

	function handleMessage(event) {
	if (event.source == window && event.data == messageName) {
	event.stopPropagation();
	if (timeouts.length > 0) {
	var fn = timeouts.shift();
	fn();
	}
	}
	}

	window.addEventListener("message", handleMessage, true);

	// Add the one thing we want added to the window object.
	window.setZeroTimeout = setZeroTimeout;
	})();

	// END implementation of setZeroTimeout


	// BEGIN demo that uses setZeroTimeout

	function runtest() {
	var output = document.getElementById("output");
	var outputText = document.createTextNode("");
	output.appendChild(outputText);
	function printOutput(line) {
	outputText.data += line + "\n";
	}

	var i = 0;
	var startTime = Date.now();
	function test1() {
	if (++i == 100) {
	var endTime = Date.now();
	printOutput("100 iterations of setZeroTimeout took " +
	(endTime - startTime) + " milliseconds.");
	i = 0;
	startTime = Date.now();
	setTimeout(test2, 0);
	} else {
	setZeroTimeout(test1);
	}
	}

	setZeroTimeout(test1);

	function test2() {
	if (++i == 100) {
	var endTime = Date.now();
	printOutput("100 iterations of setTimeout(0) took " +
	(endTime - startTime) + " milliseconds.");
	} else {
	setTimeout(test2, 0);
	}
	}
	}

	// END demo that uses setZeroTimeout

	</script>
	</head>
	<body onload="runtest()">

	<h1>Demo: Using postMessage to do setTimeout with a real zero timeout</h1>

	<pre id="output"></pre>
	</body>
	</html>