Install YSlow and Pagespeed plugins for Firefox. Then start looking at all of the ways your site is unoptimized. This will be much like trying to take a sip of water from a fire hydrant.
Using minified ( and possibly aggregated ) Javascript and CSS along with a good, healthy far-future-expires is a really good way to start.
Server: if you rely on a database, check if you queries are cached, and more importantly check if your data is cached. For example if on every page you get a menu from the database, then you can cache that result. In addition you can check your code and see if there is room for optimization. Also the hardware itself plays a role. If you are on a shared hosting plan, maybe the server is full of other not-optimized apps that take a toll on the server.
Connection: Here the YSlow and Pagespeed come in handy, as well as Fiddler. You can do some caching of static content (CSS and JS). Set their expire date far in the future. Using GZIP to make their contents smaller, and combining the static files helps to a certain extent. In addition maybe the server has a low bandwidth.
Client: if you do wacky javascript or have slow css selectors, this might hurt performance on the client. But this depends on the speed of the client's computer.
Also, smush.it is good for compressing images (which have a big impact on how fast a webpage loads).
As far as browsers go, Safari 4 claims it is "the world's fastest browser", and I can say that the Mac version is certainly nice and fast (not to mention elegant!). However, the above suggestions will make much more of a difference than which browser you're using.
With ColdFusion you will want to make sure your queries are being cached. Use query analyzer (if using mssql server) to make sure a slow loading page isn't the result of a bad query. On the database end you'll also want to ensure proper indexing.
A big factor in performance is how many HTTP requests are sent for images, files, etc. YSlow will show you this info. Its only available for firefox.
There is a really great plugin for for Firefox called Dust-Me Selectors. It scans your css files and lets you find selectors that aren't used/have become redundant in your markup.
You shouldn't recommend any particular browser, but design your webpage to current standards with some fixes for older models, if necessary. From my perspective everything can have a speed impact, but CSS is the least important one and in real world examples the user will not notice this. In most cases a clear separation of html and style declarations will do the job. What really has an impact? First of all you can simply throw money at the problem by getting a better hosting contract (maybe a dedicated server). Another thing to improve the speed a website takes to load is to reduce the quality of your images and the usage of CSS-Sprites. Very often on dynamic webpages the database is a bottleneck and therefore caching and a good database abstraction layer can improve things (PHP: PDO instead of simply using mysql()). GZip your output to the user. There are so much more things, but a lot of them are very language dependent..
I recommend the use of FireBug and loadimpact.com for testing.
Less files are more - CSS sprites may be something to consider. In my experience, you have to balance your CSS file between speed and maintainability - one rule more or less won't make the difference between night and day...
The biggest problem I have is creating fast-running, beautifully designed pages with rich content. This is one thing that is extremely hard to do with today's technology.
If you have lots of javascript you might wanna use Javascript compression. Dojo provides one such tool SHRINKSAFE to compress your javascript. Find the link below: http://www.dojotoolkit.org/docs/shrinksafe
Also add multiple waiting icons to your website. Show icons in such way that every time user should get different waiting icon, which should be effective to engage user. And mean while your website will get loaded.
发布评论
评论(14)
安装 YSlow 和 Pagespeed Firefox 插件。 然后开始查看您的网站未优化的所有方面。 这很像试图从消防栓里喝一口水。
使用缩小的(可能是聚合的)Javascript 和 CSS 以及良好的、健康的远期过期是一个非常好的开始方式。
还有……明白我说的消防栓是什么意思!
Install YSlow and Pagespeed plugins for Firefox. Then start looking at all of the ways your site is unoptimized. This will be much like trying to take a sip of water from a fire hydrant.
Using minified ( and possibly aggregated ) Javascript and CSS along with a good, healthy far-future-expires is a really good way to start.
And... see what I mean about the fire hydrant!
总结一下上面的内容:
网站的速度取决于以下几件事:
在这一部分上,您可以进行改进。
服务器:如果您依赖数据库,请检查您的查询是否被缓存,更重要的是检查您的数据是否被缓存。 例如,如果您在每个页面上从数据库中获取一个菜单,那么您可以缓存该结果。 另外你可以检查一下你的代码,看看是否还有优化的空间。
硬件本身也发挥着作用。 如果您采用共享托管计划,服务器可能充满了其他未优化的应用程序,这些应用程序会对服务器造成影响。
连接:这里YSlow和Pagespeed会派上用场,还有Fiddler 。 您可以对静态内容(CSS 和 JS)进行一些缓存。 将它们的到期日期设置为遥远的未来。 使用GZIP来缩小其内容,并结合静态文件有一定帮助。
此外,服务器的带宽可能较低。
客户端:如果您使用古怪的 JavaScript 或使用缓慢的 CSS 选择器,这可能会损害客户端的性能。 但这取决于客户端计算机的速度。
Just to sum the stuff up from above:
The speed of a website depends on a few things:
And on each of this part you can do improvements.
Server: if you rely on a database, check if you queries are cached, and more importantly check if your data is cached. For example if on every page you get a menu from the database, then you can cache that result. In addition you can check your code and see if there is room for optimization.
Also the hardware itself plays a role. If you are on a shared hosting plan, maybe the server is full of other not-optimized apps that take a toll on the server.
Connection: Here the YSlow and Pagespeed come in handy, as well as Fiddler. You can do some caching of static content (CSS and JS). Set their expire date far in the future. Using GZIP to make their contents smaller, and combining the static files helps to a certain extent.
In addition maybe the server has a low bandwidth.
Client: if you do wacky javascript or have slow css selectors, this might hurt performance on the client. But this depends on the speed of the client's computer.
我建议阅读加速网站速度的最佳实践以及Yahoo! 的卓越性能页面。
如果您喜欢书籍,您可能会对高性能网站感兴趣(请注意,其中的很多内容都在加速网站速度的最佳实践一文中)和更快的网站。
网站速度的最佳实践中我最喜欢的一些规则:
另外,smush.it 有利于压缩图像(这对网页加载速度有很大影响)。
就浏览器而言,Safari 4 声称它是“世界上最快的浏览器”,我可以说Mac 版本确实又好又快(更不用说优雅了!)。 但是,上述建议将比您使用的浏览器产生更大的影响。
史蒂夫
I'd recommend reading Best Practices for Speeding Up Your Web Site and all of the content on Yahoo!'s Exceptional Performance page.
If you like books, you may be interested in High Performance Websites (note that a lot of the content in this is in the Best Practices for Speeding Up Your Web Site article) and Even Faster Websites.
Here are a few of my favourite rules from Best Practices for Speeding Up Your Web Site:
Also, smush.it is good for compressing images (which have a big impact on how fast a webpage loads).
As far as browsers go, Safari 4 claims it is "the world's fastest browser", and I can say that the Mac version is certainly nice and fast (not to mention elegant!). However, the above suggestions will make much more of a difference than which browser you're using.
Steve
使用 ColdFusion,您需要确保您的查询被缓存。 使用查询分析器(如果使用 mssql 服务器)确保加载缓慢的页面不是由错误查询造成的。 在数据库端,您还需要确保正确的索引。
性能的一个重要因素是为图像、文件等发送了多少 HTTP 请求。YSlow 将向您显示此信息。 它仅适用于 Firefox。
我推荐这本书。
With ColdFusion you will want to make sure your queries are being cached. Use query analyzer (if using mssql server) to make sure a slow loading page isn't the result of a bad query. On the database end you'll also want to ensure proper indexing.
A big factor in performance is how many HTTP requests are sent for images, files, etc. YSlow will show you this info. Its only available for firefox.
I'd recommend this book.
Google 目前正在其新的“让网络更快”页面上收集各种性能提示:http://code.google.com/intl/de-CH/speed/articles/
仅供参考:并非这些页面上的所有信息都是有效的,特别是 PHP 提示相距甚远。
Google is currently collecting all sorts of performance tips on their new 'Let's make the web faster'-page here: http://code.google.com/intl/de-CH/speed/articles/
FYI: Not all information on these pages are valid, particularily the PHP tips are way off.
Firefox 有一个非常棒的插件,名为 Dust-Me Selectors。 它会扫描您的 CSS 文件,并让您找到标记中未使用/已变得多余的选择器。
https://addons.mozilla.org/en-US/firefox/addon/ 5392
您还应该通过 CDN 传送静态内容。 静态文件的并行下载将加快页面渲染速度。 这里有更好的解释:http://www. sitecheck.be/tips/speed-up-your-site-using-a-cdn/
There is a really great plugin for for Firefox called Dust-Me Selectors. It scans your css files and lets you find selectors that aren't used/have become redundant in your markup.
https://addons.mozilla.org/en-US/firefox/addon/5392
You should also be delivering your static content off a CDN. Parallel downloads of static files will speed up your page renders. A better explanation here: http://www.sitecheck.be/tips/speed-up-your-site-using-a-cdn/
您不应该推荐任何特定的浏览器,但应根据当前标准设计您的网页,并在必要时对旧型号进行一些修复。 从我的角度来看,一切都会对速度产生影响,但 CSS 是最不重要的,在现实世界的示例中,用户不会注意到这一点。 在大多数情况下,清晰分离 html 和样式声明就可以完成这项工作。 真正有影响的是什么? 首先,您可以通过获得更好的托管合同(也许是专用服务器)来简单地花钱解决问题。 提高网站加载速度的另一件事是降低图像质量和 CSS-Sprites 的使用。 在动态网页上,数据库常常是一个瓶颈,因此缓存和良好的数据库抽象层可以改善情况(PHP:PDO 而不是简单地使用 mysql())。 GZip 将您的输出发送给用户。 还有很多东西,但其中很多都非常依赖于语言。
我建议使用 FireBug 和 loadimpact.com 进行测试。
You shouldn't recommend any particular browser, but design your webpage to current standards with some fixes for older models, if necessary. From my perspective everything can have a speed impact, but CSS is the least important one and in real world examples the user will not notice this. In most cases a clear separation of html and style declarations will do the job. What really has an impact? First of all you can simply throw money at the problem by getting a better hosting contract (maybe a dedicated server). Another thing to improve the speed a website takes to load is to reduce the quality of your images and the usage of CSS-Sprites. Very often on dynamic webpages the database is a bottleneck and therefore caching and a good database abstraction layer can improve things (PHP: PDO instead of simply using mysql()). GZip your output to the user. There are so much more things, but a lot of them are very language dependent..
I recommend the use of FireBug and loadimpact.com for testing.
文件越少越好 - CSS sprites 可能是值得考虑的。 根据我的经验,你必须在速度和可维护性之间平衡你的 CSS 文件 - 一条规则或多或少不会造成白天和黑夜的区别......
Less files are more - CSS sprites may be something to consider. In my experience, you have to balance your CSS file between speed and maintainability - one rule more or less won't make the difference between night and day...
对于 IE,请参阅 http://www.fiddler2.com/fiddler/Perf/
Fiddler 的新 neXpert 插件 (http://www.fiddler2.com/fiddler2/addons /nexpert.asp)提供与 YSlow 和 PageSpeed 中类似的功能。
For IE, see http://www.fiddler2.com/fiddler/Perf/
The new neXpert plugin for Fiddler (http://www.fiddler2.com/fiddler2/addons/nexpert.asp) offers features similar to those found in YSlow and PageSpeed.
我遇到的最大问题是创建运行快速、设计精美、内容丰富的页面。 以当今的技术来说,这是一件极难做到的事情。
The biggest problem I have is creating fast-running, beautifully designed pages with rich content. This is one thing that is extremely hard to do with today's technology.
如果您有大量 javascript,您可能想使用 Javascript 压缩。 Dojo 提供了一种这样的工具 SHRINKSAFE 来压缩您的 javascript。 找到下面的链接:
http://www.dojotoolkit.org/docs/shrinksafe
还有一个开源工具google称之为页面速度,它可以帮助你优化网站性能。 最近在向大家开源之前一直在内部使用。
http://google-code-updates.blogspot。 com/2009/06/introducing-page-speed.html
http://code.google.com/speed/page-speed/
希望它有助于。
If you have lots of javascript you might wanna use Javascript compression. Dojo provides one such tool SHRINKSAFE to compress your javascript. Find the link below:
http://www.dojotoolkit.org/docs/shrinksafe
There is another tool open sourced by google called page speed, which can help you optimize the website performance. It was used internally before it was open sourced to everyone recently.
http://google-code-updates.blogspot.com/2009/06/introducing-page-speed.html
http://code.google.com/speed/page-speed/
Hope it helps.
性能测试的几个非常基本的规则:
A couple of very basic rules of performance testing:
缓存所有内容(Web 服务器和浏览器缓存)。
尽可能静态发布(即减少数据库调用量)
Cache everything (web server and browser caching).
Statically publish as much as possible (i.e. to reduce the amount of database calls)
还可以向您的网站添加多个等待图标。
以这样的方式显示图标,每次用户都应该得到不同的等待图标,这应该能够有效地吸引用户。 同时您的网站将被加载。
Also add multiple waiting icons to your website.
Show icons in such way that every time user should get different waiting icon, which should be effective to engage user. And mean while your website will get loaded.