帮助提高网站性能,尤其是在 IE8 中
如果您想加快此网页的加载速度,您会从哪里开始?
它的 JavaScript 代码很重,因为目标是单页布局和灯箱结帐。托管平台对服务器端代码部门造成了一些限制。
如果有人知道有一个 Flash 或 JavaScript 横幅看起来很漂亮,是 XML 驱动的,并且实际上利用了并行下载,请告诉我。我选择预加载出现在 Flash 库中的一堆 250 像素图像,以利用并行下载,而我们选择的 Flash 横幅则无法利用并行下载。
除此之外,在 Firefox Firebug NET 选项卡中我看到:
- 初始 gameonglove.com 请求需要 6.75 秒。这看起来很高。我想知道是否可以通过将大部分 JavaScript 打包到外部文件中来开始减少它。
- 为了减少大量图像,我可以用带有某种圆形边框的灰色边框替换白色背景,而不是为每个背景专用一个图像。
- Facebook、addthis.com 和 google-analytics.com 下载大约需要 7 秒,并暂停其余页面加载。问题是,我相信他们等待 onLoad 事件触发。我不确定还可以使用什么作为事件触发器,但我可能不必求助于其他东西。
- 我不完全确定要保留哪些主机名,以及在我们的服务器上托管哪些主机名以优化 DNS 与并行下载的比率。
避免 DNS 查找可以缩短响应时间,但减少并行下载可能会增加响应时间。我的指导方针是将这些组件拆分为至少两个但不超过四个主机名。 http://developer.yahoo.com/performance/rules.html
帮助会很大赞赏。
Where would you start if you were trying to make this webpage load faster?
Site: Game-On Glove
It is JavaScript heavy because the goal was a one-page layout with light-boxed checkout. The hosting platform creates some limitations in the server side code department.
If there's a Flash or JavaScript banner that anyone knows of that looks as nice, is XML-driven, and actually takes advantage of parallel downloads, please let me know. I chose to pre-load the bunch of 250px images that appear in our Flash gallery to take advantage of parallel downloads, which our Flash banner of choice doesn't take advantage of.
Apart from that though, in the Firefox Firebug NET tab I see:
- Initial gameonglove.com request takes 6.75s. This seems high. I wonder if I could start reducing it by packaging up most of the JavaScript into external files.
- To reduce our massive number of images I could replace the white background with grey borders with some kind of rounded border instead of dedicating an image for each background.
- Facebook, addthis.com, and google-analytics.com downloads take about 7s, and put the rest of the page load on hold. Problem being, they wait for the
onLoad
event to fire I believe. I'm not sure what else to use as the event trigger, but I probably shouldn't have to resort to something else. - I'm not entirely sure which hostnames to keep, and which ones to host on our server to optimize our DNS to parallel download ratio.
Avoiding DNS lookups cuts response times, but reducing parallel downloads may increase response times. My guideline is to split these components across at least two but no more than four hostnames. http://developer.yahoo.com/performance/rules.html
Help would be greatly appreciated.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您可以尝试 Pingdom,它纯粹测量下载对象的时间(没有 JavaScript 处理时间或类似的时间)。
我测试了您的网站,看起来它需要 >1.7MiB 的信息,这可能是您的速度下降的部分原因。
You could try Pingdom, which purely measures time to download objects (no JavaScript processing time or anything like that).
I tested your site and it looks like it needs >1.7MiB of information, which could be partially where your slowdown is occurring.
该网站正在加载的文件数量确实会影响性能。 研究表明每个文件的开销比文件大小的影响更大(对于典型的脚本、图像、CSS 文件)。
因此,需要做一些事情:
将 Javascript 合并到尽可能少的文件中。
使用
异步
和Defer
属性以阻止 JS 减慢页面加载。将 CSS 合并到尽可能少的文件中。
将图像合并到 CSS Sprites。
确保您的服务器正在缓存文件!
在服务器上打开 Gzip 编码。
尽可能避免重定向(301、302)(但保留旧 URL,否则会失去客户)。检查网络服务器日志以识别并解决问题。
获得更快的网站/域名托管服务商。 :)
另请参阅:
The number of files, that site is loading, really hurts performance. Studies show that the overhead per file as a much vaster effect than filesize (for typical script, image, CSS files).
So some things to do:
Consolidate Javascript into as few files as reasonable.
Use the
Async
andDefer
attributes to stop JS from slowing page loads.Consolidate CSS into as few files as reasonable.
Merge images into CSS Sprites.
Make sure your server is caching files!
Turn on Gzip encoding at the server.
Avoid Redirects (301, 302) as much as possible (but preserve old URL's or lose customers). Check the web-server logs to identify and fix problems.
Get a faster site/domain host. :)
See also: