hliyan/post-message.html

## post-message.html
<html>

<body>
    <div>
        <button onClick="onButton()">Hello</button>
    </div>
    <script>
        // credit: https://dbaron.org/log/20100309-faster-timeouts
        const eventQueue = [];

        const postEvent = (fn) => {
            if (typeof fn != "function") {
                throw Error("postEvent: not a string");
            }
            eventQueue.push(fn);
            window.postMessage("custom-event", "*");
        };

        const onEvent = (event) => {
            if (event.source != window || event.data != "custom-event")
                return;
            event.stopPropagation();
            if (eventQueue.length == 0)
                return;
            const fn = eventQueue.shift();
            fn();
        };

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

        const onButton = () => {
            //for (let i = 0; i < 100; i++) { // if you want to check perf
            postEvent(() => {
                console.log("hello" + i);
            });
            //}
        };
    </script>
</body>

</html>
	<html>

	<body>
	<div>
	<button onClick="onButton()">Hello</button>
	</div>
	<script>
	// credit: https://dbaron.org/log/20100309-faster-timeouts
	const eventQueue = [];

	const postEvent = (fn) => {
	if (typeof fn != "function") {
	throw Error("postEvent: not a string");
	}
	eventQueue.push(fn);
	window.postMessage("custom-event", "*");
	};

	const onEvent = (event) => {
	if (event.source != window \|\| event.data != "custom-event")
	return;
	event.stopPropagation();
	if (eventQueue.length == 0)
	return;
	const fn = eventQueue.shift();
	fn();
	};

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

	const onButton = () => {
	//for (let i = 0; i < 100; i++) { // if you want to check perf
	postEvent(() => {
	console.log("hello" + i);
	});
	//}
	};
	</script>
	</body>

	</html>