这种延迟怎么可能呢?
我正在尝试优化我的网站的加载时间,因为它太长了,而且仍然如此,但特别是对于 jQuery UI CSS 图像,
如果您有时间,请看一下 此 Pingdom 测试?
在文件号 60 和 75 中,很少有来自 jQuery CSS 文件的图像(只是重命名了路径)。它们最多需要 3 秒才能连接,然后加载速度似乎很快。但是 3 秒才能连接?
与此相关的 CSS 片段:
.ui-icon { width: 16px; height: 16px; background-image: url(/css/images/ui-icons_222222_256x240.png); }
.ui-widget-content .ui-icon {background-image: url(/css/images/ui-icons_222222_256x240.png); }
.ui-widget-header .ui-icon {background-image: url(/css/images/ui-icons_222222_256x240.png); }
.ui-state-default .ui-icon { background-image: url(/css/images/ui-icons_888888_256x240.png); }
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(/css/images/ui-icons_454545_256x240.png); }
.ui-state-active .ui-icon {background-image: url(/css/images/ui-icons_454545_256x240.png); }
此 CSS 文件的路径是: /CSS/ui.css
以及图像路径是: /CSS/images/*.png
如果这不是关于路径的,我在这里完全迷失了,有什么线索吗?
I'm trying to optimize my website's load time because it was too long, and it still is but especially for the jQuery UI CSS images,
If you have a minute, could you please look at this Pingdom test?
Among files number 60 and 75 there are few images from the jQuery CSS file (just renamed the path). They take up to 3 seconds to connect, and then they seem to load fast.. But 3 seconds to connect?
The piece of CSS related to this:
.ui-icon { width: 16px; height: 16px; background-image: url(/css/images/ui-icons_222222_256x240.png); }
.ui-widget-content .ui-icon {background-image: url(/css/images/ui-icons_222222_256x240.png); }
.ui-widget-header .ui-icon {background-image: url(/css/images/ui-icons_222222_256x240.png); }
.ui-state-default .ui-icon { background-image: url(/css/images/ui-icons_888888_256x240.png); }
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(/css/images/ui-icons_454545_256x240.png); }
.ui-state-active .ui-icon {background-image: url(/css/images/ui-icons_454545_256x240.png); }
And the path of this CSS file is: /CSS/ui.css
and the images path is: /CSS/images/*.png
If this is not about paths, I am completely lost here, any clue?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
另一件需要考虑的事情是您的浏览器使用缓存。因此,当您运行这样的测试时,JQuery UI 图像看起来会非常慢。但对于用户(具有适当的浏览器缓存设置)来说,“惩罚”只会发生一次。所以,实际上这不是一个完全公平的测试。
我更担心你的 40kb 背景图像和不太完美优化的 CSS。尝试在您的 css 文档上使用此网站,以减少 13% 的开销(在主站点 css 上)另外,您可以通过将 CSS 文档组合在一起而受益,这将降低 HTTP 开销。再次强调,由于浏览器缓存的概念,对于正确设置的浏览器来说,这将是一次性的改进。
与许多网站相比,这个网站加载速度相当快。除非您的网站每天访问量超过 20 百万,或者您按 kb 支付带宽,否则该设置就足够了。
The other thing to think about is that your browser uses caching. So, when you run a test like this it will look like JQuery UI images are horribly slow. But to the user (with a proper browser caching setup in place) the "penalty" will only happen once. So, in reality it's not an entirely fair test.
I'd worry more about your 40kb background image and less-than-perfectly-optimized CSS. Try this website on your css document to drop 13% of it's overhead (on the main site css) Also, you could benefit by combining the CSS documents together, which will lower HTTP overhead. Again, thanks to the concept of browser caching this would be a one-time only improvement for a properly setup browser.
Compared to many sites out there, this one loads quite quick. Unless your site is going out to 20+million daily, or you're paying by the kb for bandwidth, the setup is more than adequate.
我没有看到那么长的延迟。看起来它们的加载时间不到一秒钟。
I am not seeing that long of a delay. It looks like they take less than a second to load.