[分享]什么是前端应用的 Cache buster

Cache buster 是一种在前端开发中用于解决浏览器缓存问题的技术。它的主要目的是确保用户在访问网页时，能够获取到最新的资源文件而不受浏览器缓存的影响。在 Web 开发中，浏览器会将已下载的文件缓存到本地，以提高页面加载速度。然而，当你更新了网站的静态资源文件（例如 JavaScript、CSS 或图片），浏览器可能仍然使用缓存中的旧文件，导致用户看到不符合预期的页面。

Cache buster 的实现方式通常是在资源文件的 URL 中添加一个唯一的标识符，以使浏览器认为这是一个新的文件，从而强制它重新下载。这个唯一标识符可以是时间戳、随机数或文件内容的哈希值。

在下面的例子中，我们将使用时间戳作为 cache buster，假设我们有一个 JavaScript 文件 app.js：

<script src="app.js?timestamp=163934589***0"></script>

在这里，timestamp 参数的值是当前时间的时间戳。每当你更新了 app.js 文件，你只需更改时间戳，浏览器就会认为这是一个新的文件，强制重新下载。

除了时间戳，还可以使用哈希值。例如，如果你使用工具计算了 app.js 文件的 MD5 哈希值为 abcdef123456，那么可以这样使用 cache buster：

<script src="app.js?hash=abcdef123456"></script>

在这个例子中，只要文件内容发生变化，哈希值就会改变，从而触发 cache buster。

Cache buster 在前端开发中是一个常见的实践，确保用户总是能够获取到最新版本的网页资源，同时提高网站的性能和用户体验。