I've noticed that in certain situations, a spinner won't show up till later than I want, if ever. I've tried a few different set-ups, with similar results, including using spin.js.
For example if I have this HTML:
<div id="spinner" style="display:none"><img src="spinner.gif" /></div>
<textarea id="myInput"></textarea>
Javascript:
var validate = function() {
$('#spinner').show();
var val = $('#myInput').val();
var result = doSomethingModeratelyComplexWith(val);
$('#spinner').hide();
return result;
}
If the amount of data in the textarea is above a certain threshold, the spinner doesn't show. In the past I've sometimes dealt with this by using a timeout of 50-100ms around the "heavy" code, but A) I never liked that solution and B) it makes the validation logic much more complex than it would otherwise be since I can't return the result till the timeout is done.
Any suggestions?
P.S. I'm tempted to use the sleep function mentioned in this question, despite the many protestations that it's evil.