我一直在深入研究Google页面速度,优化了我正在处理的很多网站以获得良好的评分,而且我很自豪地说做得非常成功。
唯一的缺点是,由于某些缓存操作,对JS和CSS进行小的更改通常不会导致文件的新下载副本。
当JS、CSS(或其他资源)发生更改时,是否有任何方法强制下载新的副本呢?
我一直在深入研究Google页面速度,优化了我正在处理的很多网站以获得良好的评分,而且我很自豪地说做得非常成功。
唯一的缺点是,由于某些缓存操作,对JS和CSS进行小的更改通常不会导致文件的新下载副本。
当JS、CSS(或其他资源)发生更改时,是否有任何方法强制下载新的副本呢?
我有时会遇到 JS 和 CSS 缓存时间过长的类似问题。对我有效的解决方案是,在文件名后作为查询字符串添加版本号或最后更新的时间戳。这样浏览器会将文件视为已更改并重新下载它。
获取 JS 的示例:
http://yourdomain.com/content/js/functions.js?v=201232
我知道这可能显而易见,因为您可以了解到“版本控制”技术用于使任何静态资源请求失效,但如果不是这样,我会在这里提供帮助。
我们允许某些应用进行品牌推广,这意味着在客户与我们合作期间,图像文件很常见地发生变化,以及其他之前提到的静态文件。如果相同的名称用于文件,缓存将成为一个问题。方便的是,对图像源进行版本控制的想法同样有效。
<img src="images/title.gif?v=2" />
看一下HTML5 Boilerplate。http://html5boilerplate.com/它可以自动处理你所担心的很多事情,并且通过在每次修改时使用不同命名的CSS文件来处理缓存失效。
捆绑的.htaccess文件中的相关片段:
# ----------------------------------------------------------------------
# | Filename-based cache busting |
# ----------------------------------------------------------------------
# If you're not using a build process to manage your filename version
# revving, you might want to consider enabling the following directives
# to route all requests such as `/style.12345.css` to `/style.css`.
#
# To understand why this is important and even a better solution than
# using something like `*.css?v231`, please see:
# https://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/
# <IfModule mod_rewrite.c>
# RewriteEngine On
# RewriteCond %{REQUEST_FILENAME} !-f
# RewriteRule ^(.+)\.(\w+)\.(bmp|css|cur|gif|ico|jpe?g|m?js|png|svgz?|webp|webmanifest)$ $1.$3 [L]
# </IfModule>