Jquery/Javascript—；如何直观地优化我的站点负载？

我正在对我的网站进行最后的润色，我正在努力使页面的负载看起来不那么紧张。向您展示我的意思的最佳方式是展示网站： （仍未完成，处于阿尔法阶段）

如您所见，内容粘贴在左侧，将大量jquery和图像加载到页面中，然后单击到位（中间）

我想知道是否有一种方法可以让它先点击到位，然后加载元素

我试着把重新定位脚本放在后面，甚至都不起作用

---

有什么想法吗？谢谢

我认为您可以将javascript函数放在document.ready（function（））中，这样在加载页面后就可以加载函数了。我猜你不需要加载网站的功能，只是为了与之交互

通常，您只希望在页面呈现后触发事件，即使用

$(document).ready(function()) {
   //your javascript goes here
}

---

然后，在HTML中有占位符，这样页面就不会像你所说的那样“扩展”或“跳转”，并带有某种元素仍在加载的指示。然后，当您的ajax请求完成时，只需用ajax响应填充占位符。

对于您拥有的所有图像，您的页面是1.5mb，再加上70http请求。难怪你的网站会这样做

您应该在较小的图像上使用精灵来减少http请求，对于较大的图像，您将同时加载所有的图像。即使是那些没有立即显示的。页面加载后，不立即显示的图像应该通过AJAX拉入

如果您想进一步优化，我还将：

• 使用一个外部javascript文件。对 它增加了尺寸，但我喜欢这样 通过http请求
• 缩小html/javascript/css
• 不要在站点上托管jQuery，请使用CDN，例如
• 查看类似于AmazonS3的服务

---

我可以在这里重新创建网站最佳实践轮盘，或者我可以发送给你那里有大量非常重要的信息，阅读并参考。

你加载了两次jQuery，一次是从你自己的网站加载，另一次是从谷歌的CDN加载。首先，您可能应该将所有JavaScript移到HTML的底部。然后，如果。。。else处理要显示的列数和您的Google Maps iframe

---

为了加快可视化速度，而不是使用jQuery，您可能应该使用一些普通的DOM脚本，为

项目

和

tb_tweets

类动态创建一些CSS样式，因此，它不必等待所有JavaScript加载后再处理

项目的大小调整

和

tb_tweets

使用并执行它告诉您的所有操作。如果你想让工具了解页面加载过程中发生了什么，chrome developer工具无疑是客户端优化的最佳工具。

@RGBK-这与你的问题无关——但那是什么音频播放器？我一直在寻找一个好的非flash音频播放器…这是一个高度定制的声音云播放器。我用了这个：除了加载速度慢之外，你的网站令人印象深刻。（：@RGBK，我建议你提高你的批准率：）人们会更愿意帮助你。不要认为一个涉足jquery的设计师可以获得很高的批准率：-）我问了很多愚蠢的问题。但我在学习！S.O.是上帝派来的。我已经做到了，所有javascript都放在内容加载之后。问题是，如果它在加载后执行此操作，那么该组合将保持在左边距，并在加载后单击到位（这是公认的相当大的），只是想知道是否有一种方法可以让它先修复，然后再加载？此外，您可以加入JS文件以减少http请求，并使用托管在CDN上的jquery。这是真的，我试着给他一些基本的东西嗨Nick。。。我不是一个专业设计师（做一些jquery黑客和WP的设计师）。。。想知道如何进行AJAX后加载吗？！你能给我一些指点吗？还有关于70个http请求。。。那些是什么？我怎样才能简化这个过程？谢谢manOk，这些都是很好的指示。我要把这件事说得天花乱坠：-）@RGBK，网上有很多关于jQuery ajax的答案，只要搜索就可以了。我将编辑我的帖子来解释HTTP请求。嗨，John，我不是那个技术人员，所以如果我错了，请原谅我的错误，但这不只是jquery，不是ajax吗？但是好吧，也许我应该先放一些内联javascript来做布局调整？我试着将重新定位脚本放在身体下方。此外，即使在加载图像之前，元素都已给定了宽度和高度（其中大多数），因此它应该具备执行repos所需的功能。Hmmm.：-/摆脱双重加载使速度提高了一倍。难以置信，我刚刚搜索了“香草DOM脚本”，结果中首先显示了您的评论。。。谷歌是。。。快速的