The front end of the front-line performance optimization

solution:

1. http request to reduce the number of times, js, css compression source (the Gulp recommended), the use of sprite images, image size control;

2.CDN Hosted, data cache, you can refer to the role of the front end CDN Development

https://blog.csdn.net/weixin_41697143/article/details/82758630

3.HTML reduce empty tags used ditag, spiders crawling facilitate data

Can refer to the front-end SEO optimization:

https://blog.csdn.net/xustart7720/article/details/79960591

4. The distal try to use the variable to save the results of AJAX request, the data may be acquired by the operation of the local variables, can effectively reduce the number of requests

5. Set a lot of style, do not use inline styles to achieve the style separation. Multi-setting className, do not directly manipulate style

6. The reduction of global variables, the results can be cached lookup DOM node, can effectively reduce the operation DOM

7. To make the picture lazy loading, refer to the supporting sheet js lazy load principle:

https://blog.csdn.net/w1418899532/article/details/90515969

8. To the top of the CSS is introduced, introduction at the bottom JS

9. src and avoid empty href

Guess you like

Origin www.cnblogs.com/shubo168/p/12097085.html