Web Optimization Summary Simplified

1, File compression

JavaScript File source code can be used to confuse compression, CSS file source code for normal compression, JPG images can be compressed according to the specific quality of 50% to 70%,png can use some open source compression software to compress, such as 24 color into 8 colors, remove some PNG format information, etc. Turn on server-side gzip compression to compress text resources.

2. Choose the right picture

Color book more: JPG color less: PNG?. Web Support Webp:svg

3, merge static resources?

Includes CSS, JavaScript, and small images to reduce HTTP requests.

4, using CDN

? or some public libraries use static resource addresses provided by third parties (such as jquery, Normalize.css). Increase concurrent downloads on the one hand and share caches with other sites on the other

5, extended static resource cache time

In this way, visitors who visit the site frequently will be able to access it more quickly. However, this is done by modifying the file name to ensure that the user pulls up the latest content when the resource is updated.

6, put the CSS on the page header, put JavaScript at the bottom of the page

This does not block page rendering, which makes the page appear blank for a long time.

7, the static resources and non-static resources are placed under two domain names? (statically placed under a non-primary domain name)

Increase concurrency and reduce unnecessary cookie data that is carried in HTTP requests

8, reduce the HTTP request?

9, when writing XHTML to do structure semantics.

10. Increase the server's request processing power (background)

The biggest difference between prefork and worker patterns is that a process in prefork maintains a connection, while a worker thread maintains a connection. So the prefork is more stable but the memory consumption is larger and the worker is less stable because many connected threads share a process, and when a thread crashes, the entire process and all the threads die together. However, the worker's memory usage is much lower than prefork, so it is suitable for use on servers with high HTTP requests.

In recent years Nginx more and more favored by the market. In the case of high-connection concurrency, Nginx is a good substitute for Apache Server or supplement: On the one hand, Nginx is more lightweight, consumes less resources and memory, on the other hand, the Nginx processing request is asynchronous non-blocking, and Apache is blocking type, in high concurrency under the Nginx Keep low resources, lower consumption and high performance.

Due to the advantages of Apache and nginx, so often collocation is nginx processing front-end concurrency, Apache processing background requests.

It is worth mentioning that rookie node. JS also uses event-based asynchronous non-blocking to process requests, so there is a natural advantage in handling high concurrent requests.

?

From "Web full stack engineer self-accomplishment"?

Web Tuning Summary