php - CSS 中的版本控制图像,如何?

标签 php css caching refresh version

我正在寻找在 CSS 中缓存破坏图像的正确方法。

在 PHP 中将版本控制应用于 css、js 和图像链接很容易,使用这里建议的几种方法: How to force browser to reload cached CSS/JS files?

但我无法弄清楚如何为css 文件内 的引用链接提供动态版本,或任何其他强制刷新css 引用的方法。

最佳答案

现有的大多数解决方案都是针对 .html 而非 .php 页面的版本控制。

在 PHP 中你不必使用:

<LINK REL=StyleSheet HREF="style.css" TYPE="text/css">

使用 PHP,您可以包含 CSS。


你可以设置你的Cache-Control: max-age
您的 CSS 将缓存与 HTML 相同的时间。
即使您使用 LINK REL 进行版本控制,浏览器也不会获取 HTML 以发现您将 LINK 更改为 CSS。

保存 HTTP 回合 TTFB

如果缓存被“包含”,它对 CSS 的影响不大。您没有 HTTP 往返连接和等待时间,除非您有过多的 CSS,否则内容传输时间通常小于连接到第一个字节的时间。

GoDaddy 示例

如果 HTML 传输中包含 CSS 和字体,则此页面的加载速度会快 2 秒以上。

CSS 文件内容传输时间 1 毫秒总时间 589 毫秒

URL: https://cloud.typography.com/7914312/697366/css/fonts.css
Loaded By: https://www.godaddy.com/:15
Host: cloud.typography.com
Client Port: 0
Request Start: 1.404 s
DNS Lookup: 103 ms
Initial Connection: 36 ms
SSL Negotiation: 90 ms
Time to First Byte: 359 ms
Content Download: 1 ms

Waterfall Page Load

<?php 
ob_start("ob_gzhandler");
header('Content-Type: text/html; charset=utf-8');

header('Cache-Control: max-age=86400');  
// 86400 caches for one day, 604800=week, 2592000=30 days

echo <<<EOT
<!DOCTYPE html>
<html lang="en"><head><title>PHP Testbed</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
EOT;
ob_flush();


include('css.inc');


echo <<<EOT
</style></head><body><div id="page"><h1>TEST</h1>
</div></body></html>
EOT;
 ob_end_flush();
?>

关于php - CSS 中的版本控制图像,如何?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30009065/

相关文章:

java - Guava 缓存,如何在删除时阻止访问

php - 国家/地区的动态 PHP 下拉菜单

php - 在 PHP 中下载文件的最佳方式

php - WP All Import 库存覆盖

javascript - 证明 hashbang URL 的 noscript 网站内容

css - 仅在 Safari 中转换动画的中断

html - 没有图像的 CSS3 多边形,如何?

带有内联文本的 CSS 圆圈

c - `clflush` 大内存区不刷新?

ruby-on-rails - Rails 5 Active Record - 是否可以在内存中保存一个表?