IE8 下网站速度很慢。 jQuery 的错？
我网站的某些页面在 IE8 中运行极其缓慢。内容较多的页面在所有浏览器中加载速度都很慢，但在 IE8 中加载速度较慢。我认为它们一开始加载速度很慢，因为有很多过程性 PHP 和数据库查询。
但我主要担心的是这些页面在 ie8 中加载后的速度有多慢。有一些 jQuery 幻灯片效果，我想知道 ie8 是否在渲染它们方面很糟糕。
这是一个内容很少的页面： http://searchfornutrition.com/?pageid=topic& topicid=acai
按钮的向下滑动工作正常，并且 jQuery 快速/正常。
现在这是一个包含大量内容的页面： http://searchfornutrition.com/?pageid=topic& ;topicid=vitamin_d
按钮的下滑速度很慢。
我用IE8检查过另一台电脑，也是一样的。我为这个网站做了所有独特的编程，但我不是专家。通过创建这个网站，我学到了有关 Web 开发的所有知识，所以如果不是 IE8，那么可能就是我。
感谢您提供的任何帮助。
编辑：
我刚刚尝试了 Chrome 开发工具上的网络选项卡，对于为什么我的页面加载速度如此缓慢而言，它非常有帮助。一些不必要的 .css 链接需要几秒钟才能加载，但大多数是文档本身。有时仅需要长达 30 秒，这意味着我的代码效率不高。我知道我的代码效率不高，因为我在学习函数和 OOP 之前完成了网站的大部分内容，因此它是程序性的并且非常多余。我将不得不开始更新它。
至于IE的问题，我还不太确定。我会尝试你的一些建议，然后也许会制作一个病毒，每当 IE 请求页面时，它会安装 FF 或 chrome 来代替 IE :P
编辑 2：
如果有人想知道结果如何 - 我已经设法减少加载通过仅加载最初可见的内容并让 ajax（通过 jQuery）在按下每个按钮时加载与每个按钮滑动相关的数据，可以显着节省时间。现在快多了，而且我还没有遗漏几个不需要的CSS文件。在 IE8 中加载后仍然很慢，但我会再次解决这个问题，并考虑您的建议。感谢您的帮助！
Some of the pages of my site are extremely sluggish in IE8. The pages with lots of content load slowish in all browsers but slower in IE8. I assume they load slow to begin with because there is a lot of procedural PHP and database queries.
But my main concern is how lumberingly slow these pages are after they load in ie8. There are some jQuery slidedown effects and I'm wondering if ie8 just sucks at rendering them.
Here is a page with very little content: http://searchfornutrition.com/?pageid=topic&topicid=acai
The slidedown from the buttons work fine and the jQuery is fast/normal.
Now here is a page with lots of content: http://searchfornutrition.com/?pageid=topic&topicid=vitamin_d
The slidedown from the buttons is sluggish.
I've checked another computer with IE8 and it's the same. I did all the unique programming for this site and I'm no expert. Doing this site was how I learned everything I know about web development so if it's not IE8 then it's probably me.
thanks for any help you can give.
Edit:
I just tried out the network tab on Chrome dev tools and it was very helpful as far as why my pages load so slowly in the first place. Some of the unnecessary .css links take seconds to load but mostly it's the document itself. Sometimes it can take up to 30 seconds alone, which means my code isn't efficient. I knew my code wasn't efficient since I did most of the site before learning about functions and OOP, so it's procedural and very redundant. I will have to start updating it.
As for the IE issues, I'm still not exactly sure. I'll try some of your suggestions and then maybe make a virus that installs FF or chrome in place of IE whenever IE requests a page :P
Edit 2:
If anyone is wondering how this turned out - I've managed to decrease the loading time significantly by loading only what is initially visible and having ajax (via jQuery) load the data associated with each button slidedown on the event that each button is pressed. It's much faster now, and I still haven't omitted the several unneeded CSS files. It's still sluggish after load in IE8 but I'll tackle that another time and take your suggestions on that into consideration. Thanks for all your help!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
使用Fiddler2查看您的页面加载情况，您有大量的JS和CSS，这真的是必要的吗？资源是否被最小化和压缩？即使响应为 200 并且可以使用缓存的资源，您发出的每个 HTTPRequest 也需要时间。考虑按需加载资源或将它们捆绑到单个文件中。
一般来说，jQuery 的优化相当好，IE6 很慢，除非您指定一个元素以及 id 或选择器。
我在 FF4、Chrome 和 IE9 中感觉你的页面同样慢。
Use Fiddler2 to look at your page loading you've got a whole lot of JS and CSS there is it really all necessary? Are the resources minified and compressed? Every HTTPRequest you make takes time even when the response is 200 and the cached resource can be used. Look at loading resources on demand or bundling them into single files.
jQuery is fairly well optimised generally speaking, IE6 was slow unless you specific an element along with and id or selector.
Your page felt about equally slow for me in FF4, Chrome and IE9.
就元素选择器而言，ie8 肯定比大多数其他现代浏览器慢。您可以做很多事情来优化 - 如果可以的话，您应该通过 id 选择其中之一。我过去注意到 ie 在大页面上也往往很慢。
ie8 is definitely slower in terms of element selectors than most other modern browsers. There are lots of things you can do to optimize - for one you should be selecting by id if you can. I have noticed in the past that ie tends to be slow on big pages also.
我注意到您有几个一像素宽的图像（和一个两像素宽）用作重复背景图像来创建渐变。我最近遇到了一个大型网站的性能问题，通过增加背景图像的大小解决了这个问题。
我没有亲自调查原因，但我的理解是，当背景图像重复时，浏览器必须单独渲染每个重复。例如，如果 1,000 像素宽的元素具有 1 像素宽的背景，则该图像必须渲染 1,000 次，而拉伸到 50 像素宽的同一图像只需要渲染 20 次。 IE 在最好的情况下往往比其他浏览器慢，因此受到的影响更为严重。
当然，使图像变宽确实会增加图像尺寸，但增幅远没有您预期的那么大。 PNG 和 GIF 都非常擅长处理重复数据（尤其是水平重复数据），从而最大限度地减少文件大小的影响。
就我个人而言，我从来不会在重复的方向上制作小于 50 像素的重复图像。进行此更改极大地提高了我网站的动画性能。
I notice that you have several one-pixel-wide images (and one two-pixel-wide) used as repeating background images to create gradients. I recently ran into performance issues with a large site which were resolved by increasing the size of my background images.
I have not personally investigated the causes, but my understanding is that when a background image repeats, the browser must render each repetition separately. For example, if a 1,000-pixel-wide element has a one-pixel-wide background, that image must be rendered 1,000 times, whereas the same image stretched to 50 pixels wide would only need to be rendered 20 times. IE, tending to be slower than other browsers at the best of times, is more severely affected.
Making your images wider does, of course, increase your image size, but not by nearly as much as you'd expect. Both PNG and GIF are very good at handling repetitive data (especially horizontally repetitive data), minimizing the file size impact.
Personally, I never make a repeating image less than 50px in the direction(s) in which it repeats. Making this change drastically improved the animation performance of my site.