XF 1.2 Flickering

R

RoyalRumble

Active member
Hi,

Please excuse the vague title, I couldn't think how else to describe this...

When there is a page load - there is 'a flicker' effect.

An example.

The forum home initially loads as "Latest: Jan 19 2014 at 8:07PM" before changing to "Latest: 28 minutes ago"

This happens within forums too, and the navbar loads without Home/Resources/Members before eventually appearing.

It's really off-putting. I've attached examples below and the test forum here - any advice very welcome

Mobile;
To view this content we will need your consent to set third party cookies.
For more detailed information, see our cookies page.

Desktop (I click forum twice in succession, hence the two 'flickers')
To view this content we will need your consent to set third party cookies.
For more detailed information, see our cookies page.

List of Add Ons (this error occurs will all disabled)

Screen Shot 2014-01-19 at 20.39.50.webp
 
Sort by date Sort by votes
That is actually how the page is loading. It's the JS that changes it on load. To some degree, it can be expected, though there may be differences based on how browsers render. That said, are you seeing it here? If not, the first thing I would do is check on the default style and then disable add-ons to see if that appears to make a difference.
 
Upvote 0 Downvote
Mike said:
That is actually how the page is loading. It's the JS that changes it on load. To some degree, it can be expected, though there may be differences based on how browsers render. That said, are you seeing it here? If not, the first thing I would do is check on the default style and then disable add-ons to see if that appears to make a difference.
Click to expand...

Thanks Mike, appreciate the reply.

I tested on here and two other XenForo forums and didn't have the problem.

I listed by Add Ons in the OP (at the bottom) I don't have many and the problem persists with all disabled.

I also reverted all JS templates (I edited very slightly to include AdBlock Detection)

Hoping I can resolve as I couldn't go live with the forum risking causing seizures
 
Upvote 0 Downvote
Sorry, missed that.

FWIW, I did notice it on the first view, but generally didn't notice it beyond that, certainly not consistently (Chrome). I didn't see it at all in Firefox.

I would check on a bog standard style. It's possible that it could be related to the ads?
 
Upvote 0 Downvote
Thanks for taking the time to look Mike.

Mike said:
FWIW, I did notice it on the first view, but generally didn't notice it beyond that, certainly not consistently (Chrome). I didn't see it at all in Firefox.
Click to expand...

Yeah it's very odd in that it comes and goes, I worry when I make the forum live and it has 700+ users online simultaneously it may be worse as content updates.

Mike said:
I would check on a bog standard style. It's possible that it could be related to the ads?
Click to expand...

It is the standard default style with very little colour changing - is that what you mean?

I don't think its ads related, I disabled them but it still occurred.

The main headache is viewing on a mobile (Safari), the navbar links jump on every page load. I just installed a fresh default style an the problem doesn't occur, so it's something I've done but I can't seem to isolate it to resolve
 
Upvote 0 Downvote
Update.

@Mike - You was correct in that it was adverts causing this problem. I forgot I had one in the footer.

This is my code, any idea what might be causing the problem (It's particularly consistent/bad in responsive)

Code: 
 <style type="text/css">
.adslot_1 { width: 320px; height: 50px; }
@media (min-width:500px) { .adslot_1 { width: 468px; height: 60px; } }
</style>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle adslot_1" style="display:inline-block;" data-ad-client="ca-pub-123" data-ad-slot="123"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
 
Upvote 0 Downvote
Fab, that's done the trick. No more flickering! :D

One last question if I may :) Noticing your the resource manager of the Adsense, I don't suppose you know whether the below is compliant? (Simple adblock detect, but its the resize of an add unit meant to be 320 to 300 that worries me - still relevant to this thread as the 320 pushes the frame on an iphone which is what I think causes flickering on page load)

Code: 
<div class="blockContainer">
    <div class="adContainer">
        <center>

<style type="text/css">
.overtaking-top-dynamic {
width: 300px;
height: 50px;
}

@media(min-width: 484px) {
    .overtaking-top-dynamic {
    width: 468px;
    height: 60px;
    }
   
    @media(min-width: 743px) {
    .overtaking-top-dynamic {
    width: 728px;
    height: 90px;
    }
}
</style>

<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Overtaking Top - Dynamic -->
<ins class="adsbygoogle overtaking-top-dynamic"
    style="display:inline-block"
    data-ad-client="ca-pub-123"
    data-ad-slot="123"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>


</center>
    </div>

    <div class="noticeContainer hidden">
        <div class="head">Oh man! Ad-blocking software has been detected! :'(</div>
        <div class="foot">
            Text advising user to make website exempt from adblock
        </div>
    </div>
</div>
 
Upvote 0 Downvote
You must log in or register to reply here.
Top Bottom