今天闲来无事,就用Firebug查看首页的HTTP瀑布图,测试页面加载时间,发现在外联的css和js上时间开销还是挺大的,虽然css和js都进行了gzip压缩,但是解析延迟在某些时候还是比较厉害,不是css解析延迟就是js解析延迟,在读取缓存的时候,也有一定的读取的时间开销。
鉴于这种情况,那么干脆就将首页的css和js都嵌入到页面中吧,把css放到head、js放到body闭合标签之前,反正这两个文件在gzip压缩的条件下也总共才三四K而已,而子页面里还是使用外联css和js的方式。
经过这样倒弄,首页加载速度平均有100ms的提升,欣喜若狂。更好笑的是yslow、page speed测试都得了满分,哈哈……
让首页嵌入css和js,而子页面外联的方式,主要是出于这样的一个目的:用户第一次浏览到首页的时候,页面可以尽快的呈现,而到了子页面,就加载css和js,这样的用户体验就有了一个类似于“稳步退化”的感觉,使得用户不会在起先的时候就有个不良感觉,而之后的访问,子页面就可以充分的利用缓存,因为子页面可能包含图片、flash等等,缓解HTTP的并发数。
还有,之前在浏览器下可能会有短暂的无样式与渲染样式之前切换的闪白,目前也得到了比较好的缓解。
现在导航半天才出来,是有意的吗?
e,原来搞了个透明度的动画,好像没什么意义啊
有意的,因为在网速慢的时候,首页刷新的时候,会有一个瞬间的闪白,特别是导航栏颜色浓,闪白比较明显,加这个动画就可以从视觉上观察不到这个闪白的变化,呵呵
win7/ FF下首页只加载出来了content和footer,不知道是不是我浏览器缓存的问题
留言avatar头像有问题
头像我全部都设置为静态图片了,网速慢会使得忙指示器一直在转
刚才去测试了下,win7/FF下没问题的,你Ctrl+F5强刷新一下看看
不显示头像,鄙视你!
需求很强烈啊,哈哈