34 website acceleration methods provided by Yahoo

Source: Internet
Author: User

Yahoo provides 34 detailed descriptions of the yslow rule (22). Using this rule, you can perform a comprehensive analysis and optimization on your page to increase the loading speed of your website.

 

1. Minimize HTTP requests reduces HTTP requests
Images, CSS, scripts, Flash, and so on all increase the number of HTTP requests. Reducing the number of these elements can reduce the response time. Writing multiple JS and CSS files into a file whenever possible. It is not good to write images directly into the page. It should be written into CSS, use CSS Sprites to splice small images and use background to locate them.

 

2. Use a content delivery network using CDN Technology
CDN is really a good thing. Eight-way server providers usually charge fees for this service. I used to buy domestic space but I didn't know what to use at the time, now it's gone...

 

3. Add an expires or a cache-control header to set the header file expiration or static Cache
The browser uses cache to reduce the number of HTTP requests to speed up page loading. If a long expiration time is added to the page header, the browser will always cache the elements on the page. However, if something on the page changes, you need to change the name. Otherwise, the user will not take the initiative to refresh the page ~ This can be done by modifying the. htaccess file.

4. gzip components gzip Compression
The GZIP format is a common compression technology. Almost all browsers have the ability to decompress the GZIP format, and it can be compressed in a very large proportion. Generally, the compression rate is 85%. Compression is not compressed. You can perform the test here.

 

5. Put stylesheets at the top and put CSS on the top.
Allows viewers to see the complete style of the website as soon as possible.

 

6. Put scripts at the bottom to put the JS at the bottom
After the website is rendered, set the function. Of course, these JS files do not affect the content performance during your loading process.

 

7. Avoid CSS expressions avoid CSS expressions
The CSS expression is terrible. It only takes a lot of effort to execute the content supported by IE. You need to move the mouse to perform re-calculation, but sometimes this must be used for browser compatibility. | IE6 is used to die! ~

 

8. Make JavaScript and CSS external to link JS and CSS external links
As mentioned above, some common JS and CSS files can be used as external links. For example, I am a jquery file from Google's external links, if a visitor has downloaded and cached this file when Browsing another website that uses this external link file, he does not need to download it when browsing my website! ~

 

9. Reduce DNS lookups reduces DNS Lookup
It seems that we want to reduce the number of resources that the website calls from outside. My Google analysis and Picasa's external link images are included.

 

10. Minify JavaScript and CSS reduce the size of JS and CSS
Writing JS and CSS is skillful. You can use the least code to implement the same function, reduce gaps, enhance logic, and use abbreviations, of course, there are also many tools that can help you achieve this.

 

11. Avoid redirects avoid redirection
When the link is written, although "http: // www. today-S-ooxx. COM and http: // www. today-S-ooxx. COM/"only has one final"/", but the results are different. The server needs to take the time to redirect the former to the latter and then perform the jump. Please note that, you can also use alias, mod_rewrite, or directoryslash in Apache.

 

12. Remove duplicate scripts to delete duplicate scripts
The browser that repeatedly calls the Code does not recognize and ignore the code, but will calculate it again, which is of course a big waste.

 

13. Configure etags in configure etags
I don't know what's going on. In short, I deleted it in. htaccess.

 

14. Make Ajax cacheable cache Ajax
Ajax responds in real time. Before the browser receives new data, the old data is cached, which improves the efficiency.

 

15. Flush the buffer early release of the buffer
When a user makes a page request, the server needs to spend 200 to 500 milliseconds to splice HTML, write it between the head and the body, and release the buffer. In this way, the file header can be sent first, then, send the file content to Improve the efficiency.

 

16. Use get for Ajax requests to perform Ajax requests in get Mode
The get method has only one interaction with the server (sending data), while the POST method requires two (sending the data in the header ).

 

17. Post-Load components delayed component loading
Yui image loader is a good example of Loading required components first for page initialization and loading others.

 

18. preload Components
Content that may be used after loading in advance does not conflict with delayed loading. Its purpose is to provide faster response for subsequent requests. For details, refer to the CSS Sprites application on the Google homepage.

 

19. Reduce the number of DOM elements to reduce the number of DOM elements
A complex page structure means a longer download and response time, and a more reasonable and efficient use of tags to construct pages. This is a prerequisite for a good front-end.

 

20. Split components internal SS domains cross-origin separation component
Multiple sources of page components can increase your parallel downloads, but be careful not to use too many. If you have more than 2-4 domain names, the DNS search mentioned above will be wasted.

 

21. Minimize the number of iframes to reduce the number of IFRAME
Ifames needs to be used more effectively.
IFRAME advantages: it is helpful for downloading slow third-party content such as advertisements, security sandbox, and parallel downloading scripts.
IFRAME disadvantage: even if it is empty, there will be a large amount of resource consumption, it will block the onload of the page, non-semantic

 

22. Do not display the 404 page for no 404 S
404 pages appear in the site itself (non-Search Results). Meaningless 404 pages will affect user experience and consume server resources.

 

23. Reduce cookie size reduce cookie
The cookie is exchanged between the server and the browser through the file header to minimize the cookie volume and set a reasonable expiration time, which can greatly improve the efficiency.

 

24. Use cookie-free domains for components use a cookie-free domain name for the component
Cookie reading of Static components is a waste. It is a good way to store your static components using another domain name without cookies, alternatively, you can store only domain names with WWW in cookies.

 

25. Minimize Dom access reduces Dom access times
JS is slow to access the Dom. Try not to use js to set the page layout.

 

26. Develop smart Event Handlers develops flexible event handling handles
If too many elements on the DOM tree are added to the event handle, the response efficiency will be low. The Yui event tool has an onavailable method that helps you flexibly set the DOM Event handle.

 

27. Use choose <link> over @ import instead of @ import
Using @ import in IE is the same as using <link> at the bottom of the page. We mentioned that we should put <link> on the top.

 

28. Avoid filters avoid the use of filters
If Alpha transparency is required, do not use alphaimageloader. It is inefficient and only applicable to IE6 and earlier versions. Use png8 images. If you want to use it, add _ filter to avoid affecting IE7 + users.

 

29. optimize images Optimized images
Converting your GIF to png8 will be a good way to reduce the volume. There are also many ways to process your jpg and PNG images to achieve the optimization effect.

 

30. Optimize CSS Sprites optimize CSS Sprites
In CSS Sprites, you can arrange images vertically and compact as much as possible, and arrange images of similar colors together to reduce the size of the image and increase the display speed of the page image.

 

31. Don't scale images in HTML. Do not scale the image in HTML.
The size of the image to be used is large. After the width of the 1000x1000 image is "100" Height = "100", the size of KB will not be reduced.

 

32. Make favicon. ICO small and cacheable reduce the size of favicon. ICO and cache it
The website's browser ICO should not be changed frequently, so it will be cached for a long time, and it is best to control it below 1 K.

 

33. Keep components under 25 k ensures that the component is less than 25 K
The iPhone cannot cache more than 25 KB of components, and this must be before being compressed.

 

34. Pack components into a multipart document package the component into a multi-part document
Just like adding an attachment to an email, an HTTP request is enough, but this technology requires your proxy support, which is not supported by the iPhone.

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.