php – 如何正确预加载图像,js和css文件？

我正在从零开始创建一个网站,我在90年代后期真正进入了这个网站,但从那时起网络已经发生了很大变化！而且我更像是一名设计师,所以当我开始把这个网站放在一起时,我基本上做了一个PHP系统,包括让网站更“动态”

当您第一次访问该站点时,如果您尚未登录(cookie),您将被显示在登录屏幕上.如果您未登录,则会引入名为access.PHP的页面.
我以为我会预先加载最重的图像.因此,当用户完成登录时,图像已经被缓存.这是我想要的.但我仍然注意到最大的图像仍然无法立即呈现.所以这看起来有点毫无意义.

所有这一切使我重新思考网站的结构以及脚本和css文件的加载方式.使用FireBug和YSlow与Firefox我看到一些指针,如expires标头和减少每个脚本的大小.但这真的是罪魁祸首吗？

例如,这在主index.PHP中真的很愚蠢吗？整个网站基本上都是这样构建的

<?PHP
require("dbconnect.PHP");
?>

<?PHP
include ("head.PHP");
?>

在这下面基本上只是网站的正文和内容.
然而,Head.PHP包括doctype,head部分,两个css样式表的链接,jQuery库,jQuery验证引擎,Cufon和Cufon字体文件,然后是小的Cufon.Replace片段.

身体的其余部分带有index.PHP文件,但在这个底部再次是一个名为“footer.PHP”的文件的包含,它基本上包括加载几个jsLoader脚本和一个幻灯片,然后是一个js功能.
所有这些使得最终页面源看起来像一个典型的完整网页,但我想知道你们中是否有人能立即看到“这真的很愚蠢”和“不要那样做,而是这样做”等等： )包括一个不好的方式去？

这个网站也是图像密集型,我可以做一些更优化.
但我不认为这是它的罪魁祸首. YSlow给我一个占据最多空间的报告：

doc(1) - 5.8K
js(5) - 198.7K
css(2) - 5.6K
cssimage(8) - 634.7K
image(6) - 110.8K

我知道它看起来像是cssimage(8),它的重量最大,但我已经预先加载了这些图像,它并没有真正影响渲染.

解决方法:

要加快速度,您可以在同一图像精灵上组合所有图像,这样您只有1个请求下载所有图像.但这需要您微调您的CSS以显示图像的小部分.
要获得更好的解释,请查看：http://css-tricks.com/css-sprites/

另一个看起来有点愚蠢的答案但我想在制作一个网站时想到这个：Just Keep It Simple.我的意思是你所有的JS都添加了真正的价值,所有这些图像都很好,你能少显示,做一个更轻的设计吗？我根本不批评你的工作,只是建议你……