gpt4 book ai didi

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

转载 作者:行者123 更新时间:2023-11-28 07:57:36 25 4
gpt4 key购买 nike

我正在寻找在 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com