This shall be hidden, after you press the Button before loops

Poor browser rendering

This page shows that the browser rendering engine is quite poor, in my eyes.

What is being done?

The following code is executed

  
	function hide() {
		hideElement("hide-me");		
	
		// do something that just takes some time
		for (var i=0; i<30000; i++) {
			document.getElementById("hide-me"+i);
		}
	}
  							
  			
It is actually programmed to do the following:
  1. Hide the red-outlined div
  2. Do something that takes a long time (here we just try to get a lot of elements by their id)

What really happens

Obviously due to the browser's rendering engine the DOM manipulation (here hiding the red-outlined div) is not done in real time, so to say not blocking. This can be proved visually, you can see the red-outlined div is not hidden right away. It even seems that the loop that comes after it blocks the rendering from taking place and this indicates the rendering engine and the javascript execution are not running asynchronously as one would expect (or better would even be in real time, blocking so to say).