StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>jQuery's <code>.show()</code> does nothing else than performing a change in the <code>display</code> css property (alongside some magic on previous states). </p> <p>However, everything happens in <em>syncronized</em> code. Its virtually impossible that your <code>calculate()</code> method is called first here.</p> <hr> <p>Its much more likely that your <code>calculate()</code> method is doing some heavy synronized, blocking operations and that the browser batches the two code segements together. It happens to be that in browsers, Javascript code, CSS Rendering and general "UI repaints and reflows", are processed in the same <em>queue</em> and therefore in the same thread. I'm talking about the such called "<em>UI Queue</em>" here.</p> <p>In short words, you need to make your <code>calculate()</code> function "faster", decouple it into smaller chunks. The worst option would be to entirely <em>defer</em> the calling of <code>calculate()</code> by invoking a <code>setTimeout</code>. That latter would solve your immediate problem, but it would still block the browser and the UI queue afterwards.</p> <p>Example: <a href="http://jsfiddle.net/5E2bn/1/" rel="nofollow">http://jsfiddle.net/5E2bn/1/</a></p> <p>As I already stated, you don't really want to do that, its just an example to make the point clear. In any real-world scenario you should go back to the drawing board and think about what <code>calculate()</code> does here and how you can split it up into smaller chunks.</p> <p>One very convenient way to decouple long-running processes in Javascript is the usage of <em>Run-away script timers</em>, which basically chunk a sync loop into multiple asyncronous loops to give the UI queue and the browser time to breath in between code executions.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload