Foreword
In the front-end development, the cache is conducive pages load faster, while the cache can be repeatedly used, it is possible to reduce traffic and bandwidth overhead.
There are many classification caching, CDN caching, database caching proxy servers cache and browser cache. Benpian future explain the browser cache Web development. This will often be asked in the actual development environment, or to use. How to clear the cache quasi confirm the concept of front-end learning must go
Cache browser issues, mainly refers to the http cache - the protocol layers. The h5 new storage and database cache, which is the application layer caching, are not included in the analysis of the content Benpian inside. Now we started to analyze the cache.
text
Sometimes when you use the network chrome developer tools found in the details:
This is how it goes, of course, is way above said cache, although both looks are read from the cache, but there are some not the same!
Classification webkit resources
webkit resource classification is divided into two categories: main resources and derived resources.
http status codes
Memory Cache from 200 // not access the server directly read cache, the cache is read from memory. Cached in memory, and when the kill process, that is, after the browser is closed, the data does not exist at this time of the data. However, this approach can only derive cache resources. Generally scripts, fonts, images will be in memory of them. Disk Cache from 200 // not access the server directly read cache, the cache is read from disk, kill the process when the data still exists. In this way can only derive cache resources, usually CSS
200 resource size values // from the server to download the latest resources 304 Not Modified // access the server, discovery data is not updated, the server returns this status code (does not return a resource). Then read the data from the cache.
General stylesheets are cached on disk, will not be cached in memory, because once loaded css style page rendering. But the script is subject to execution, if the disk exists in the script, the script will extract when executing from the cache to disk, so the IO overhead is relatively large, it may cause the browser to become unresponsive.
The execution order of several states
Now load a resource (for example: picture): Access -> 200OK -> Exit browser -> then come in -> 200 (from disk cache) -> Refresh -> 200 (from memory cache)
Principle three cache
- Memory go see if there are loaded directly
- If memory is not, choose to take the hard drive acquisition, if there is a direct load
- If the hard disk does not, then the process of network requests
- Loaded into the cache to the hard disk and memory resources
What is the first cache it
Usually lives cache an episode to download a song; these resources can be directly offline viewing, did not go to request network resources locally.
What browser's cache is
As mentioned above, the cache that is off-line resources; for browser developers, we use the browser cache is not downloaded anything, but for example, we opened a web browser, this resource page which contains (picture , css files, js files, etc.) in the absence of perception of the situation, the local cache;
Browser cache, sometimes we need him, because he can improve site performance and browser speed and improve site performance. But sometimes we have to clear the cache, since the cache might mess things up, some wrong data appears. Stock websites like real-time updates, etc. This site is not cached, as some sites rarely updated, there is a cache is still relatively good.
The browser will usually common resource cache in your PC's disk and in memory. Such as cache storage location in the Chrome browser: \ the Users \ your_account \ AppData \ Local \ Google \ Chrome \ the User the Data \ the Default in the Cache folder and the Media Cache folder.
Step browser cache is what
We know that the browser will cache, so we had to open before each opened websites are using cache it? of course not! ! ! When the browser needs to have a set of protocols to manage server requests, when to use the local cache; this agreement is called Cache Protocol (caching);
With a look at the mechanism of this process is what kind of:
