pmdartus/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>WPT async processing</title>
  </head>
  <body>
    <script>
      /* Simulate synchronous processing */
      function sleep(duration) {
        const endTime = performance.now() + duration;
        while (performance.now() < endTime) {}
      }

      /* Mark web page test waterfall by sending a request. */
      function markWaterfall(name) {
        return fetch(`/?step=${name}`);
      }

      function doWork(name) {
        performance.mark(`${name}::start`);
        sleep(500);
        performance.mark(`${name}::end`);

        const { duration, startTime } = performance.measure(name, {
          start: `${name}::start`,
          end: `${name}::end`
        });

        console.log(`[${name}] duration: ${duration}, start: ${startTime}`);
      }

      doWork('sync');

      Promise.resolve().then(() => {
        doWork('microtask');
      });

      setTimeout(() => {
        doWork('timeout');
      })

      fetch('/').then(() => {
        doWork('fetch');
      });
    </script>
  </body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<title>WPT async processing</title>
	</head>
	<body>
	<script>
	/* Simulate synchronous processing */
	function sleep(duration) {
	const endTime = performance.now() + duration;
	while (performance.now() < endTime) {}
	}

	/* Mark web page test waterfall by sending a request. */
	function markWaterfall(name) {
	return fetch(`/?step=${name}`);
	}

	function doWork(name) {
	performance.mark(`${name}::start`);
	sleep(500);
	performance.mark(`${name}::end`);

	const { duration, startTime } = performance.measure(name, {
	start: `${name}::start`,
	end: `${name}::end`
	});

	console.log(`[${name}] duration: ${duration}, start: ${startTime}`);
	}

	doWork('sync');

	Promise.resolve().then(() => {
	doWork('microtask');
	});

	setTimeout(() => {
	doWork('timeout');
	})

	fetch('/').then(() => {
	doWork('fetch');
	});
	</script>
	</body>
	</html>