How to efficiently deploy front-end code, such as css, js..., cssjs ..

How to efficiently deploy front-end code, such as css, js..., cssjs ..

I read some articles on the Internet and made some summary. By the way, I would like to add some of my own things.

 

1. Use the browser's 304 cache, but 304 is called the negotiation cache, and you still need to communicate with the server once.

2. Force the browser to use the local cache (cache-control/expires), but the problem arises, so the browser is not allowed to send resource requests and how to update resources.

3.what should I do with a.css? V1_1.0, B .css? When vswitch1.0 is changed, all the changes are changed to a.css? V1_2.0, B .css? V1_2.0. When a.css is changed, B .css is not changed. Isn't that an alternative?

4.what should I do with a.css? V1_0abc23, B .css? V1_65ao1j. if a.cssis modified, a.css1_v1_1asd2j, and B .css is B .css? V = 65ao1j.

5. Many enterprises, now static file cdn deployment, similar to http://static.cdn.com/css/a.css? V = 0abc23, which is deployed separately from the page,

A. if you deploy the page first and then deploy resources: During the deployment interval, if a user accesses the page, the old resources will be loaded in the New Page Structure, and the old version of the resource is cached as the new version. The result is that the user accesses a page with disordered styles, unless it is refreshed manually, before the resource cache expires, the page will always run incorrectly.

B. If you deploy the resource first, then deploy the page:

During the deployment interval, users with locally cached resources of the old version access the website. Because the requested page is of the old version and the resource reference is not changed, the browser directly uses the local cache, in this case, the page is displayed normally. If you do not have a local cache or a user who has expired the cache accesses the website, the old version of the page loads the new version of the resource, resulting in a page execution error, however, when the page is deployed, this part of the user's access to the page will return to normal again. Solution: change the name to a_0abc23.css, and deploy static resources before the page.