缩小动态 php 样式表

发布于 2024-11-18 07:43:27 字数 286 浏览 2 评论 0原文

所以我一直在使用 Minify 来压缩我的 JS 和 CSS,直到我需要压缩一些动态 php 样式表。

我试图使用 htaccess 来愚弄它,让它认为它是一个 css 文件,但后来我意识到它使用绝对文件路径,不会受到 mod_rewrite 的影响

无论如何,每当我将它指向 php 文件时,它总是返回“400 Bad Request” 。除了编写我自己的压缩脚本之外,还有如何解决这个问题的想法吗?

So I have been using Minify to compress my JS and CSS which had all been going nicely until I needed to compress some dynamic php stylesheets.

I tried to use htaccess to fool it into thinking it was a css file, but I then realised it uses absolute file paths which would not be effected by mod_rewrite

Anyways whenever I point it at a php file, it always returns '400 Bad Request'. Any idea on how to solve this other than writing my own compression script?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

≈。彩虹 2024-11-25 07:43:27

我发现处理缩小和压缩样式表的最佳方法是自己动手。查看这段代码:

<?php
header("Content-Type: text/css");
header("Last-Modified: ".gmdate('D, d M Y H:i:s', filemtime($_SERVER['DOCUMENT_ROOT'].$_SERVER['PHP_SELF']))." GMT");
header("Expires: ".gmdate('D, d M Y H:i:s', (filemtime($_SERVER['DOCUMENT_ROOT'].$_SERVER['PHP_SELF']) + 691200))." GMT");

//This GZIPs the CSS for transmission to the user
//making file size smaller and transfer rate quicker
ob_start("ob_gzhandler");
ob_start("compress");

//Function for compressing the CSS as tightly as possible
function compress($buffer) {
    //Remove CSS comments
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
    //Remove tabs, spaces, newlines, etc.
    $buffer = str_replace(array("\r\n", "\r", "\n", "\t", '  ', '    ', '    '), '', $buffer);
    return $buffer;
}

//Main style
require_once($_SERVER['DOCUMENT_ROOT']."/templates/style/style.css");

//Other style
if($php_variable) {
    require_once($_SERVER['DOCUMENT_ROOT']."/templates/style/other.css");
}

ob_end_flush();
ob_end_flush();
?>

这里发生了很多事情,所以让我解释一下。

标头

  • 将文件类型设置为 CSS。
  • 设置 Last-ModifiedExpires 标头以进行缓存控制(设置在一周多一点,您可以更改此设置)。

压缩和 GZIP

  • 使用 ob_start,我们告诉它对该文件进行 GZIP 压缩并运行自定义函数compress
  • compress 在发送到浏览器时删除所有 CSS 注释和空格。这意味着您可以在源文件中按照您喜欢的方式保留所有注释和间距,以便于编辑,但只将最少的内容发送到浏览器。

样式

  • 使用require 导入样式表。对任意数量的样式表执行此操作;它们都将通过单个 HTTP 请求传递给用户。

使用新文件

您将像调用普通 CSS 文件一样调用该文件。

<style type="text/css" src="/path/to/css-script.php"></style>

结论

使用这种方法,您可以做一些很棒的事情。

  • 提供正确的标头进行缓存,从而快速返回您的网站。
  • 缩小所有内容以不包含多余的空格或注释。
  • 使用 GZIP 压缩文件以获得更小的文件大小。
  • 将所有样式表包含在一个 HTTP 请求中,非常适合优化。
  • 避免使用 @import 语句...这本身就很棒。
  • 允许您保留多个样式表并使用 PHP 逻辑包含或不包含它们。
  • 允许您根据需要保留源样式表的间距和注释,而不会对访问者产生任何影响。

您也可以对 JavaScript 使用相同的方法,尽管上面的 compress 函数严格用于 CSS,所以我将省略它。

将此技术与缓存控制技术结合使用,您就可以为自己构建一个很棒的 CSS/JS 处理程序: 如何强制浏览器重新加载缓存的 CSS/JS 文件?

I find the best way to deal with minifying and compressing stylesheets is to do it yourself. Check out this code:

<?php
header("Content-Type: text/css");
header("Last-Modified: ".gmdate('D, d M Y H:i:s', filemtime($_SERVER['DOCUMENT_ROOT'].$_SERVER['PHP_SELF']))." GMT");
header("Expires: ".gmdate('D, d M Y H:i:s', (filemtime($_SERVER['DOCUMENT_ROOT'].$_SERVER['PHP_SELF']) + 691200))." GMT");

//This GZIPs the CSS for transmission to the user
//making file size smaller and transfer rate quicker
ob_start("ob_gzhandler");
ob_start("compress");

//Function for compressing the CSS as tightly as possible
function compress($buffer) {
    //Remove CSS comments
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
    //Remove tabs, spaces, newlines, etc.
    $buffer = str_replace(array("\r\n", "\r", "\n", "\t", '  ', '    ', '    '), '', $buffer);
    return $buffer;
}

//Main style
require_once($_SERVER['DOCUMENT_ROOT']."/templates/style/style.css");

//Other style
if($php_variable) {
    require_once($_SERVER['DOCUMENT_ROOT']."/templates/style/other.css");
}

ob_end_flush();
ob_end_flush();
?>

There's a lot of things going on here, so let me explain.

Headers

  • Setting the file type as being CSS.
  • Setting the Last-Modified and Expires header for cache control (Setting at slightly over a week, you can change this).

Minify and GZIP

  • Using ob_start, we tell it to GZIP this file as well as run a custom function compress.
  • compress removes all CSS comments and white space when sending to to the browser. This means you can keep all your comments and spacing the way you like it in your source files for easier editing, but only send the bare minimum to the browser.

Style

  • Using require to import the stylesheets. Do this for as many stylesheets as you'd like; They'll all get delivered in a single HTTP request to the user.

Using Your New File

You'll call on the file just as you would a normal CSS file.

<style type="text/css" src="/path/to/css-script.php"></style>

Conclusion

Using this method, you're doing several awesome things.

  • Provides the correct headers for cache'ing, making return visits to your site quick.
  • Minifys all the contents to contain no extra white space or comments.
  • Compresses the file using GZIP for smaller file size.
  • Includes all your stylesheets in one HTTP request, great for optimization.
  • Avoids using @import statements...which in itself is awesome.
  • Allows you to keep multiple stylesheets and use PHP logic to include or not include them.
  • Allows you to keep your source stylesheets spaced and commented as you like with no consequence to the visitors.

You can use this same method for JavaScript as well, though the compress function above is strictly for CSS so I would omit it.

Use this technique in combination with this cache control technique, and you've built yourself an awesome CSS/JS handler: How to force browser to reload cached CSS/JS files?

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文