Why does site "flash" with each page reload

[dwzemens]

I have developed several sites using the StudioPress Genesis framework. My most recent site "flashes" and seems to reload the images each time I move from page to page on the site. The header image reloads each time rather than transitioning smoothing.

Here's the site that flashes:

http://stjoesworkshop.com/newsite/

Here's another site I did a few weeks ago that does not flash but rather loads pages smoothly:

http://www.joannaforrochester.com/

It's like the one site does not cache the images and there's a forced reload each page view.

Can anyone help me out understanding why this is and how to avoid it? Thanks!

[NicktheGeek]

both "flash" for me. It is a question of load times, there is a tiny delay that you are seeing as a flash when the page loads.

[dwzemens]

Thanks Nick. I understand load time can be an issue, but even on my localhost testing server (with no appreciable load time at all) the one site flashes and the other does not.

[dwzemens]

Even when I disable all images on my local server the one site flashes the page text content on page reload. There's no way, of course, that this site is loading slowly in this situation, so I remain perplexed.

[dwzemens]

After doing some investigating I see that the issue is discussed in detail on the WordPress forums with no real answer.

However, if I turn off javascript on my sites then the flash disappears completely. So I know it is related to javascript, but I don't know how to fix the problem.

It's very ugly to look at and certainly is disruptive when viewing the websites.

[NicktheGeek]

Again, it is related to server speeds. Completely disabeling scripts will make it load faster since it doesn't have to get the libraries being used, which means that the CSS file can load completely right at teh start.

[dwzemens]

But on *every page load*? Even on my localhost with speeds not reliant on internet connectivity? I have to disagree. Something else is in play here, and I've seen reports of it elsewhere, with quite a discussion about the causes. Seems to be related to recent WordPress upgrades, or at least evident after recent upgrades.

[NicktheGeek]

it's not internet speeds, it is the browser load times. When the javascript library files are loaded it stops fetching images and all from teh style sheet till those files are done, then goes and finishes. With cached files this takes just a fraction of a second, and you see a flash.

[dwzemens]

Nick:

Is there a simple way with Genesis that I can force the javsacript to load in the footer rather than the header?

I've been struggling to try and do it by following this advice:
http://codex.wordpress.org/Function_...enqueue_script

but with no success.

[blogjunkie]

You can tell the wp_enqueue_script function to output the script in the footer:

PHP Code:

function my_enqueue_scripts() {
    wp_enqueue_script('custom-js',
        get_stylesheet_directory_uri() . '/lib/js/custom.js',
        array('jquery'),
        '1.0',
        true
    );
}
add_action('wp_enqueue_scripts', 'my_enqueue_scripts'); 


Just add the true to the end of the array and this will output the script in the footer.

[dwzemens]

Thanks blogjunkie. I am not sure why your suggestion works - but it does - because the output from it references a .js file that doesn't even exist. But, for whatever reason, the annoying flash has stopped!

[blogjunkie]

Glad I could be of help.

And if the code is not referencing any .js files, just put a blank custom.js in /ilbs/js/