Many webmasters use virtual hosts for websites. Once there are many web pages, the website will be very slow to open. If we say that we do not have the financial strength to do such hard indicators as servers, bandwidth, and CDN, lu songsong summarized some feasible methods to speed up the optimization of webpage code.
1. Narrow down JavaScript and CSS files
If about 50-60% of your website's users are visiting the site for the first time, these users will download JavaScript and CSS. If these files are large, the browser will download them for a long time.
Using a compression tool can reduce the size of JavaScript and CSS files by half. If you are confident to use "command line", I strongly recommend using Yahoo's Yui compression, it can increase the compression rate by at least 40% to 60%. If you are not familiar with it, you can use the CSS \ JS compression tool of webmaster's house.
2: Reduce HTTP requests
The browser takes 80% of the time to obtain external components, including scripts, style sheets, and images. It only takes 20% of the time to load content. Each website has many HTTP requests, because only two HTTP requests can be sent at the same time, too many requests may cause latency.
Yslow shows the number of HTTP requests in my blog. We can see that there are too many image files referenced by JS, CSS, and CSS, resulting in too many HTTP requests.
3: cache images, CSS, and JavaScript
Whenever a new user accesses your website, images, CSS, and JavaScript should be cached in its browser, so that their next visit will be extremely fast.
Most Windows hosts are enabled by default. You only need to set the expiration time and file type in the control panel. I suggest setting the image, CSS, and JavaScript time to a month. For Apache Web servers, use the mod_cache module to enable caching. :
4: Merge CSS reference images
As shown in figure 1, images of many websites are cut into small pieces, so a large number of CSS references will be generated. For example, 14 images are referenced by CSS of Lu songsong's blog, cssimages is also an important factor affecting website speed.
If we merge the CSS image into one and change 14 HTTP requests into one, what will happen? The principle is to use CSS coordinates to obtain the path of an image. Different CSS labels reference different coordinates to obtain different images. We can see that there is only one CSS image for many websites. This principle is used.
It doesn't matter if you don't understand it. The CSS image merging builder website can help you merge CSS images and get the corresponding code.
5: only load the
This is the simplest and does not take time. Right-click your website and choose "View Source File" to find the area between
For example, the jiathis (social sharing button) and util referenced by Lu songsong's blog. JS (back to the top and write comments to the quick tag), so that it can be loaded at the end, which can speed up content opening, and they are not very important.
6. compress the image
Unless you load videos, the culprit affecting the website speed should be images. If JPEG and PNG images are used to ensure the quality, compress them as much as possible, the export Wizard feature of fireworks provides a good way to preview saved images and balance the image size and quality. Most other image editing software has similar features.
For example, each of my blog posts uses the "Export wizard" function. I try to compress all the images within 30 kb, which accelerates browsing to a certain extent, but some images are distorted, not clear.
7. Enable the gzip Module
Gzip compression is a very popular data compression format. Generally, after Gzip is enabled on a website, the compression rate increases by 70%-80%, and the effect is immediate.
Some virtual hosts have the gzip function by default, but most of them do not. Independent hosts and VPS can be set. Enabling gzip will increase the burden on the server and modify the server configuration. We strongly recommend that you enable gzip, if you are not sure, ask the space provider for help.
Related reading:
Nine major factors affecting the website opening speed
5 methods to test the Website access speed
Tips for losing weight on webpages and accelerating websites
The bus article list plug-in will slow down the Z-blog speed
Streamline the zblog template code to speed up page opening
Does traffic statistics affect website speed?
Firebug and yslow are good tools.
Removed the blog gravatar Avatar
Enable lazyload to Reduce image loading
How to Use yslow
Popular js code optimization techniques