Ways to reduce HTTP requests

Recently looking at the High Performance website Construction guide, learn some website optimization techniques and read about some of the ways to reduce HTTP requests:

1. Image map

The image map allows you to parallel multiple URLs on one image, and the destination URL selection depends on where the user clicked on the image. Using a picture map This lets you reduce HTTP requests without changing the look and feel of the page,

There are two types of image maps: server-side picture maps Submit all clicks to the same destination URL, passing them the X-and y-coordinates of the user's click. The Web application maps the x and Y coordinates to the appropriate operation. Client Picture maps are more typical because they map the user's clicks to an action. Without having to send requests back-end applications. The map is implemented via the HTML map tag.

There are also drawbacks to using picture maps. When defining the area coordinates of a picture map, it is difficult and error-prone to take a manual approach, and it is almost impossible to define other shapes except rectangles. Picture maps created with DHTML do not work in Internet Explorer.

2. CSS Sprites

like image maps, CSS Sprites can also incorporate images, but are more flexible. It also reduces the amount of downloads. The merged picture will be smaller than the sum of the detached pictures, because it reduces the cost of the image itself, and if you need to provide a large number of images on the page for backgrounds, buttons, navigation barriers, links, etc., CSS Sprties is definitely an excellent solution---clean labels, very few pictures, and short response times.

3. Inline picture

By using the Data:url mode, you can include pictures in a Web page without any additional HTTP requests, although Internet Explorer does not currently support this approach, but the savings it can bring to other browsers make it worth paying attention to.

The main flaw of the Data:url mode is that it is not supported by IE, and another flaw is that there may be limitations on the size of the data,

4. Merging scripts and style sheets

As with image maps and CSS sprites, merging those separate files into one file reduces the number of HTTP requests and reduces end-user response times.