Trending September 2023 # How To Implement On Websites # Suggested October 2023 # Top 9 Popular

You are reading the article How To Implement On Websites updated in September 2023 on the website Benhvienthammyvienaau.com. We hope that the information we have shared is helpful to you. If you find the content interesting and meaningful, please share it with your friends and continue to follow and support us for the latest updates. Suggested October 2023 How To Implement On Websites

Introduction to HTTP Caching

Web development, programming languages, Software testing & others

What is HTTP Caching? Cache Headers in HTTP

HTTP Caching has two major cache headers; the first one is called “Cache-Control,” and the second one is called “Expire.”

1. Cache-Control

You can consider Cache-Control as a Switch to toggle the caching in the user browser. Adding this header enables caching for all supported web browsers. If this header is not present, no browser will keep a cache of the web page contents even if it helps to cache. The Cache-control has two types of privacy settings, the first one is Public and the second one is Private.

In the case of the Public, the resources can be cached by any intermediate proxy, such as Content Delivery Networks (CDN). When a Cache-Control header with a Private response is included, it informs the browser that caching will only be performed for a single user and not for any intermediate proxy.

The value “max-age” in the Cache-Control header sets the time for the content to be cached. This time is in seconds.

Cache-Control:public, max-age=31536000

2. Expires Conditional Requests

The discussed headers simply inform the browser about when to retrieve the data from the web server. Conditional Requests, on the other hand, tell the browser how to retrieve them. Conditional Requests instruct a browser on how to query the server to determine if the cached data is still valid or outdated.

In this process, the browser sends some data about resources it has cached into its memory, and after reading this data, the server decides if the data is outdated or not.

1. Time-Based Requests

In time-based requests, we check if the requested resource has changed on the server or not. If the cached copy in the browser is the latest, the server will return code 304.

To set Conditional Requests on a time basis, you can use “Last-Modified” in the response header.

2. Content-Based

In Content-Based requests, we check the server and cache copies for the MD5 Hash (or any other viable option). This tells if the data is the same; if the data is different, the MD5 checksum will not match, and the server will send a fresh copy of resources.

This is done via “ETag” in the header. Its value of it is the digestion of resources.

ETag: “496d7131f15f0fff99ed5aae”

Visibility

Almost all modern browsers include development-related tools that let you check resources, source code, and other web page aspects. Among them, you can find a tool to see the headers returned by any application.

Use Cases in HTTP Caching

Below are some uses cases of HTTP Caching which are as follows:

1. For Static Assets

You can opt to aggressively cache the contents for static assets of a page, such as images, JS Files, and any CSS files. Not having to load these files will result in impressive performance improvement. For this use case, go for the Cache-Control Header with a max-age value of more than a month or even a year.

2. For Dynamic Contents

In the case of a page’s dynamic contents, you will need to think about what files the browser should cache and for how long. If the content changes frequently, you must ensure that the time duration you pick for caching won’t result in any problems for the user.

3. Caching of Private Content

As we discussed in the Cache-Control section, if the content of a page is private, you can prevent it from being cached by intermediate proxies like CDNs by including the “Cache-Control: private” header. Another safer approach is not to cache any private content at all.

Implementing HTTP Caching

Now that you know what HTTP Caching is and how it works, let’s look at how you can implement it on your website. The implementation of HTTP Caching is a bit different for different server types. In our case, let us look at implementing caching via the .htaccess file.

To enable the Caching on-site, you can add the headers in the .htaccess file on your server, for example:

/FilesMatch

The above will cache all to pdf, Flv, jpg, and other formats mentioned in the “File Match” for one year.

Conclusion

HTTP Caching is one of the essential tricks that make browsing your site a faster experience for your visitors, and now that you can see how it works, you can implement it on your sites and web apps to make them faster for your users and save your server bandwidth.