More information about the Underscore mailing list

[_] fat javascript and flckering

speed wolf speedwolf at gmail.com
Thu Dec 3 11:21:18 GMT 2009

So non JS users don't get to see the list of work at all?

Pete



On Thu, Dec 3, 2009 at 11:19 AM, Oliver Humpage <oliver at watershed.co.uk> wrote:
>
> On 3 Dec 2009, at 11:01, Marek Wawro wrote:
>
>>    <body style="display:none;">
>>        <noscript>
>>        <style type="text/css">
>>        body {display:block !important;}
>>        </style>
>>    </noscript>
>>        <script type="text/javascript">
>>            $(document).ready(function() { $("body").show(); }
>> );
>>        </script>
>
> We had some problems with dshed.net flickering (non-JS users get a
> list view of work, JS users get an icon gridview by default, and
> sometimes JS users would see the flicker of listview first. In fact,
> that version is still live, you might see it now).
>
> We investigated using noscript tags, but 1. it's nasty, 2. they're not
> valid in some doctypes and 3. It doesn't always fix the problem of the
> delay between running the JS and the browser applying it.
>
> What we found worked was to set the div to be invisible as soon as it
> was rendered in the page using non-jQuery stuff, then use a looping
> function to check when the jQuery had taken effect (e.g. by measuring
> the dimensions of some element that should have changed) and then show
> the div again.
>
> So:
>
> <div id="changeMeForJS">
> blah...
> </div>
> <script>
> document.getElementById('changeMeForJS').style.visibility = "hidden";
> </script>
>
>
> Then in jQuery:
>
> document.ready(function(){
>        doStuffToDiv();
>        makeDivVisible(1);
> });
> function makeDivVisible(i) {
>        while ([test for whether doStuffToDiv has taken effect] && i<50) {
>                setTimeout('makeDivVisible('+(i+1)+')', 50);
>        }
> }
>
>
> It's a bit long winded, but it avoids the need for noscript tags, and
> also makes sure the div is only shown when the browser really has
> applied the changes to the canvas.
>
> Oliver.
>
>
> --
> underscore_ list info/archive -> http://www.under-score.org.uk/mailman/listinfo/underscore
>