第一页加载时出现白色闪烁:是否可以“修复"此问题? [英] White Flash on First Page Load: Can this be "fixed?"
问题描述
我注意到,在我网站上某些页面的第一次加载中,有一个快速的白色闪烁.
I've noticed that on the first load of some of the pages on my site, there's a quick white flash.
页面内容被缓存后似乎没有执行此操作,但是在第一次加载时很烦人.
It doesn't seem to do this once the page content has been cached, but it's annoying during the first loads.
我尝试将所有<html>
标签设置为黑色,但这似乎无法解决问题.可能是我某些页面上的脚本吗? (即可能是分析)
I tried styling all of the <html>
tags black, but that doesn't seem to solve the issue. Could it be the scripts on some of my pages? (i.e. maybe analytics)
我有什么办法可以解决这个问题?
Is there anything I could do to remedy this problem?
更新:该站点可以在此处查看.根据我获得的结果,有些页面包含Javascript,而其他页面则没有.
Update: The site can be viewed here. Some pages have Javascript, but others do not, and it seems that's irrelevant, based on the results I've experienced.
推荐答案
好,所以看起来这可能与<head/>
中的脚本标签有关.尝试将其向下推至结束</body>
标记之前.在该脚本完全运行之前,无法呈现文档.
OK, so it looks like this might be related to your script tag in the <head/>
. Try pushing that down to just before the closing </body>
tag. The document can't render until that script has completely run.
请参见规则6
但是,有时您正在等待的其他资源之一是"home.css".这甚至可能是一个更大的问题.这有点hack,但是您甚至可以在使用内嵌<style/>
标签的css之前尝试将背景设置为黑色.
However, one of the other resource you're waiting on sometimes is 'home.css'. That may even be more of a problem. It's a bit of a hack, but you could try setting your background to black before even that css using an inline <style/>
tag.
尝试按此顺序构造页面(请注意<style/>
)标签;
Try structuring the page in this order (notice the <style/>
) tag;
<!doctype html>
<html>
<head>
<style>
html { background-color: black; }
</style>
...
<link href="home.css" rel="stylesheet" type="text/css">
...
</head>
<body>
...
<div id="footer">
<span class="footer_text">Copyright © 2013 Casey Kidd Music.<br />All Rights Reserved.</span>
</div>
</div>
<script>
(function(
...
'pageview');
</script>
</body>
</html>
在加载HTML之前,页面之间仍可能会出现少量白色闪烁,但是现在此窗口会很小.
It's possible you may still get a small flicker of white between pages, before the HTML has loaded, but this window would be pretty small now.
这篇关于第一页加载时出现白色闪烁:是否可以“修复"此问题?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!