p-pavel/a.html

## a.html
<html>
    <head>
        <script>
            let counter = 0;
            let lastCounter = counter;
            let lastTime = Date.now();

            function showFPS()  {
                const elem = document.getElementById("FPS");
                const currentTime = Date.now();
                const currentCounter = counter;
                elem.innerText = 1000 * (currentCounter - lastCounter) / (currentTime - lastTime);
                lastCounter = currentCounter;
                lastTime = currentTime;
            }

            function setUp() {
                window.setInterval(showFPS,1000);
                update();
            }
            function update() {
                const elem = document.getElementById("counter");
                elem.innerText = ++counter;
                window.requestAnimationFrame(update);
            }

        </script>
    </head>
    <body onload="setUp()">
        <p>Testing browser update performance. Below there's a counter to make browser really update screen (unlike FE)</p>
        <p id="counter"></p>
        <p>Here's FPS counter:</p>
        <p id="FPS">Not available</p>

    </body>
</html>
	<html>
	<head>
	<script>
	let counter = 0;
	let lastCounter = counter;
	let lastTime = Date.now();

	function showFPS() {
	const elem = document.getElementById("FPS");
	const currentTime = Date.now();
	const currentCounter = counter;
	elem.innerText = 1000 * (currentCounter - lastCounter) / (currentTime - lastTime);
	lastCounter = currentCounter;
	lastTime = currentTime;
	}

	function setUp() {
	window.setInterval(showFPS,1000);
	update();
	}
	function update() {
	const elem = document.getElementById("counter");
	elem.innerText = ++counter;
	window.requestAnimationFrame(update);
	}

	</script>
	</head>
	<body onload="setUp()">
	<p>Testing browser update performance. Below there's a counter to make browser really update screen (unlike FE)</p>
	<p id="counter"></p>
	<p>Here's FPS counter:</p>
	<p id="FPS">Not available</p>

	</body>
	</html>