The named color renaming scheme (renaming things such as #FF0000 to red and white to #fff) is a tad too agressive, as it renames occurences everywheren.

In my particular case, it changes url(assets/images/white.png) into url(assets/images/#fff.png), which results in a 404. I suppose the regular expression attempting to rename these colors could be tweaked so that it only works on things that are actually colors, but I'm not sure how.

In the meantime, I'm working around this bug by renaming my file.

Hi Tubal;
Just got the following feedback from an Autoptimize user;

I'm using @-webkit-keyframes for CSS3 animations and it seems the compressor in yui-php-
cssmin-2.4.8-3.php is doing something wrong.

In line 601 it does a preg_replace to replace keyframe zero percentages, so that the optimized
code is converted from this:

0{...}
to this:
0%{...}

However, the preg_replace also replaces any zero values within the parenthesis, in my case
there's a rotate3d() like this:
0% { transform: rotate3d(0,0,1,30deg); }
This is converted to this:
0% { transform: rotate3d(0%,0%,1,30deg); }

Which is wrong, because the first three parameters are boolean values.

Would be great if you could have a look!

Kind regards,
frank

Hey Tubal;
We just released Autoptimize 2.4 and it comes with the 4.x-version of this great CSS minifier. I have been able to confirm one bug that traces back to YUI-CSS-compressor-PHP-port;

.full-width-content .nectar-recent-posts-slider .recent-post-container .inner-wrap h2{font-family:Archivo Black;text-transform:capitalize;letter-spacing:0;font-size:60px;line-height:74px;font-weight:400;}

after minification becomes:

.full-width-content .nectar-recent-posts-slider .recent-post-container .inner-wrap h2{font-family:Archivo #000;text-transform:capitalize;letter-spacing:0;font-size:60px;line-height:74px;font-weight:400}

so font-family:Archivo Black; becoming font-family:Archivo #000;

This was not the case in AO 2.3.x which still used the 2.x version of your minifier. Could you have a look at what is happening here?

Thanks!
frank

If the first number is a value with px, the spaces within calc() will still be removed and the entire
function will be ignored. This will not happen if the first number is a % value.
I am using a magento extension that uses https://github.com/mrclay/minify which apparently uses this(?), so I am not exactly sure where to report this...

the clip-path CSS property can use an id as its url value to reference a clip-path element defined in SVG. Here is an example :

Would it be possible to fix this issue?

Please consider running unit and PHPCS tests in Travis.
Thanks.

{flex: 1 1 0%} is optimized into {flex:1 1 0}, which is not rendered the same in Chrome.

Cfr. Autoptimize support topic on https://wordpress.org/support/topic/google-chrome-css-flex-1-1-0-is-not-the-same-as-flex1-1-0

frank

Input

/* test */
/*! test */
.test {
    /* test */
    /*! test */
    color: #111;
    background-color: #fff;
}

Expected output

/*! test */
.test{/*! test */ color:#111;background-color:#fff}

Actual output

/*! test */
.test{color:#111;background-color:#fff}

I discovered the following issue with CSS calc and white spaces which breaks your styles in some browsers (e.g. Chrome) while others will work fine (e.g. Firefox):
Pure CSS
width: calc(100% / 3 - (3 - 1) * 1em / 3);
will turn into
width: calc(100% / 3 -(3 - 1) * 1em / 3);
when compressed.

Note the missing white space in front of the opening parenthese. I'd appreciate a fix for that :)

Has seen on https://bugs.php.net/bug.php?id=81424

On line:

The following regex /[^{};\/\n]+\{\}/S is not optimal with PCRE2 10.35+ (100 times slower) it should be rewrite.
The solution proposed on the PHP issue is not suitable here, a regexp expert should have a look at it

Here's my CSS, reduced/simplified from a real-world example: https://gist.github.com/trepmal/edf83dbd0d10b949b353c4b88fe20eea . The key elements being the selector with escaped characters, and a certain minimum amount of styles to follow.

When run through the minifier, nothing is returned:

use tubalmartin\CssMin\Minifier as CSSmin;

$css = file_get_contents( 'test.css' );

$minifier = new CSSmin;
$min = $minifier->run( $css );

// $min is empty

There "JIT stack limit exhausted" error comes from

Which can be tested directly:

$min_test = preg_replace_callback(
	'/(?:"(?:[^\\\\"]|\\\\.|\\\\)*")|'."(?:'(?:[^\\\\']|\\\\.|\\\\)*')/S",
	function($i) { return $i; },
	$css
);

if ( preg_last_error() ) {
	echo preg_last_error_msg() . PHP_EOL;
}

Hi!

First things first, thanks for this port! It's pretty cool to be able to embed the YUI Compressor inside a PHP project and don't rely on a third party program outside the app.

This port breaks CSS animations and transforms because it strips the unit of a value when this value is 0, i.e.:

transform: translateX(0px) rotate(0deg)

becomes...

transform:translateX(0) rotate(0)

I have no idea if this a valid syntax or not, but what I'm sure, is that the animations I'm using don't work anymore once compressed.

I attach a screenshot of a diff, left side official YUI CSS Compressor output, on the right side YUI Compressor PHP port.

Magento ver. 2.4.4-p6
PHP 8.1.14
Bitbucket : wardenenv/php-fpm:8.1

When we run deploy command : php8.1 bin/magento setup:static-content:deploy

We are getting error :

`Compilation from source app/design/frontend/Vendor/demo/web/css/styles.css failed
Exception: Deprecated Functionality: preg_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in vendor/tubalmartin/cssmin/src/Minifier.php on line 330 in vendor/magento/framework/App/ErrorHandler.php:61
Stack trace:
#0 [internal function]: Magento\Framework\App\ErrorHandler->handler()
#1 vendor/tubalmartin/cssmin/src/Minifier.php(330): preg_replace()
#2 vendor/tubalmartin/cssmin/src/Minifier.php(102): tubalmartin\CssMin\Minifier->minify()
#3 vendor/magento/framework/Code/Minifier/Adapter/Css/CSSmin.php(58): tubalmartin\CssMin\Minifier->run()
#4 vendor/magento/framework/View/Asset/PreProcessor/Minify.php(60): Magento\Framework\Code\Minifier\Adapter\Css\CSSmin->minify()
#5 vendor/magento/framework/Interception/Interceptor.php(58): Magento\Framework\View\Asset\PreProcessor\Minify->process()
#6 vendor/magento/framework/Interception/Interceptor.php(138): Magento\Framework\View\Asset\PreProcessor\Minify\Interceptor->___callParent()
#7 vendor/magento/framework/Interception/Interceptor.php(153): Magento\Framework\View\Asset\PreProcessor\Minify\Interceptor->Magento\Framework\Interception{closure}()
#8 generated/code/Magento/Framework/View/Asset/PreProcessor/Minify/Interceptor.php(23): Magento\Framework\View\Asset\PreProcessor\Minify\Interceptor->___callPlugins()
#9 vendor/magento/framework/View/Asset/PreProcessor/Pool.php(77): Magento\Framework\View\Asset\PreProcessor\Minify\Interceptor->process()
#10 vendor/magento/framework/View/Asset/Source.php(152): Magento\Framework\View\Asset\PreProcessor\Pool->process()
#11 vendor/magento/framework/View/Asset/Source.php(105): Magento\Framework\View\Asset\Source->preProcess()
#12 vendor/magento/framework/View/Asset/File.php(158): Magento\Framework\View\Asset\Source->getFile()
#13 vendor/magento/framework/App/View/Asset/Publisher.php(74): Magento\Framework\View\Asset\File->getSourceFile()
#14 vendor/magento/framework/App/View/Asset/Publisher.php(62): Magento\Framework\App\View\Asset\Publisher->publishAsset()
#15 vendor/magento/framework/Interception/Interceptor.php(58): Magento\Framework\App\View\Asset\Publisher->publish()
#16 vendor/magento/framework/Interception/Interceptor.php(138): Magento\Framework\App\View\Asset\Publisher\Interceptor->___callParent()
#17 vendor/magento/framework/Interception/Interceptor.php(153): Magento\Framework\App\View\Asset\Publisher\Interceptor->Magento\Framework\Interception{closure}()

`

Same things are working fine with PHP 8.1.15 .

please review the issue and let me know how we can fix it.

For some reason this rule crashes PHP.. but if I break it up into smaller chunks it works fine.

.createaccount .verticalContainer .useAsBillingAddressCheckbox,
.createaccount .verticalContainer .phone_block,
.createaccount .verticalContainer .email_block,
.createaccount .verticalContainer .firstName_block,
.createaccount .verticalContainer .lastName_block,
.createaccount .verticalContainer .shippingAddressTitleRow,
.createaccount .verticalContainer .shippingAddress1_block,
.createaccount .verticalContainer .shippingAddress2_block,
.createaccount .verticalContainer .shippingCity_block,
.createaccount .verticalContainer .shippingState_block,
.createaccount .verticalContainer .shippingZip_block,
.createaccount .verticalContainer .billingFirstName_block,
.createaccount .verticalContainer .billingLastName_block,
.createaccount .verticalContainer .billingAddressTitleRow,
.createaccount .verticalContainer .billingAddress1_block,
.createaccount .verticalContainer .billingAddress2_block,
.createaccount .verticalContainer .billingCity_block,
.createaccount .verticalContainer .billingState_block,
.createaccount .verticalContainer .billingZip_block,
.createaccount .verticalContainer .billingPhone_block,
.createaccount .verticalContainer .creditCardTitleRow,
.createaccount .verticalContainer .creditCardTitleRow,
.createaccount .verticalContainer .creditCardNumber_block,
.createaccount .verticalContainer .cc_expiration_block,
.createaccount .verticalContainer .securityCode_block,
.createaccount .verticalContainer .createAccountContinueShoppingButton{
position: relative;
display: block;
height: 65px;
padding-top: 15px;
width: 98%;
margin-left:2%;

}

Hi Túbal;
I'm using your YUI-CSS port in my WordPress plugin (Autoptimize).

A user filed a bugreport that my plugin was generating internal server errors. After investigating the problem is due to YUI-CSS-compressor-PHP-port not being able to optimize specific CSS of All In One Buttons, another WordPress plugin. The YUI-CSS port's GUI on my healthy Linux-VPS doesn't succeed in optimizing that CSS either, so this indeed seems like a bug?

Looking forward to your feedback, let me know if I can help in any way!

frank

Valid example:

bottom: calc(100% + 100px);

after compression:

bottom:calc(100%+100px);

Is this the right place?

This regexp:
$css = preg_replace('/(^|[^0-9])(?:0?.)?0(?:em|ex|ch|rem|vw|vh|vm|vmin|cm|mm|in|px|pt|pc|%|deg|g?rad|m?s|k?hz)/iS', '${1}0', $css);
remove "s" in "0s"

CSSmin transform this css:

page_scroll {

display:block;
font-style:normal;
position:relative;
transition:margin 0.2s ease 0s;
-moz-transition:margin 0.2s ease 0s;
-webkit-transition:margin 0.2s ease 0s;
-o-transition:margin 0.2s ease 0s;
width:36000px;
}
to that:

page_scroll{display:block;font-style:normal;position:relative;transition:margin .2s ease 0;-moz-transition:margin .2s ease 0;-webkit-transition:margin .2s ease 0;-o-transition:margin .2s ease 0;width:36000px}

, but must me that for work in firefox 27.0.1:

page_scroll{display:block;font-style:normal;position:relative;transition:margin .2s ease 0s;-moz-transition:margin .2s ease 0s;-webkit-transition:margin .2s ease 0s;-o-transition:margin .2s ease 0s;width:36000px}

Hello,
i'm working on a large enterprise application. With the patch version p8 you introduced a calculated value (https://github.com/tubalmartin/YUI-CSS-compressor-PHP-port/blob/master/cssmin.php#L35) that is a breaking change because it requires >=PHP 5.6.

For us this is a crucial issue. We rolled back to p7 for now, but it is a crucial misinterpretation of SemVer.

Please consider a invalidating of the patch version and release a new major.

Best regards. :)

(as reference http://php.net/manual/en/language.oop5.properties.php)

Great to see you're pumping out updates like that @tubalmartin!

I see in the readme you state 3.0.0 is more performant, did you do benchmarks on this and if so can you share results?

I noticed that unless I use a non-zero value for linebreakpos, extra whitespace will be left in the output. I've not traced why this is happening yet.

Why is there an ini_set?

Here's a testcase that fails with current master:

@import url(//example.org/foo.css?a&b);
@import url(//example.org/bar.css);

Expected output:

@import url(//example.org/foo.css?a&b);@import url(//example.org/bar.css);

Actual output:

@import url(//example.org/foo.css?a&@import url(//example.org/bar.css);b);

Diff highlight:

Failed asserting that two strings are equal.
--- Expected
+++ Actual
@@ @@
-'@import url(//example.org/foo.css?a&b);@import url(//example.org/bar.css);'
+'@import url(//example.org/foo.css?a&@import url(//example.org/bar.css);b);'

When urls are quoted, the problem doesn't occur (because processStringsCallback() captures and later restores the url "tokens").
However, I cannot control the inputs being given to Minifier.

Do you have any pointers on how to best approach fixing this?
Is this something you think needs fixing at all?

I have a branch ready for a PR over at my fork (with the test suite passing), as this is currently a showstopper for getting the latest version integrated into Autoptimize, however, there's probably a better/smarter way to go about fixing this -- I just needed to get something that works quickly...

When I picked up a file folder public / css / main.css for example and put the folder public / cache / css / main.css the urls are broken .

Laughed interesssante be a parameter to be able to set the new URL .

Change this:
background: url ( " ../ images / ZF2 - logo.png " ) no-repeat scroll 0 10px transparent ;

To do this:
background: url ( " ../../ images / ZF2 - logo.png " ) no-repeat scroll 0 10px transparent ;

Thank you so much ...

Att ,

Reported in the Autoptimize support forum & confirmed using the YUI-CSS-compressor's GUI: when optimizing CSS with inlined SVG, the spaces get removed from the inline SVG;

a#mobile-menu-btn{ background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="9.125" height="9.137" viewBox="4.437 4.431 9.125 9.137"><path d="M9.282 8.712h4.125c.12 0 .155.047.155.168v.252c0 .12-.035.154-.155.154H9.282v4.127c0 .12-.036.155-.156.155h-.252c-.12 0-.156-.037-.156-.156V9.286H4.593c-.12 0-.156-.035-.156-.154V8.88c0-.12.036-.168.156-.168h4.125V4.585c0-.107.037-.154.156-.154h.252c.12 0 .156.05.156.156v4.126z"/></svg>') 0 0 no-repeat; }

becomes:
a#mobile-menu-btn{ background: url('data:image/svg+xml;utf8,<svgxmlns="http://www.w3.org/2000/svg"width="9.125"height="9.137"viewBox="4.4374.4319.1259.137"><pathd="M9.2828.712h4.125c.120.155.047.155.168v.252c0.12-.035.154-.155.154H9.282v4.127c0.12-.036.155-.156.155h-.252c-.120-.156-.037-.156-.156V9.286H4.593c-.120-.156-.035-.156-.154V8.88c0-.12.036-.168.156-.168h4.125V4.585c0-.107.037-.154.156-.154h.252c.120.156.05.156.156v4.126z"/></svg>') 0 0 no-repeat; }

Had a quick look at the source code, but haven't found a potential fix yet.

frank

When minifying CSS, color values using RGB are breaking.

An example is:

Pre-minification: background: rgb(255, 255, 255, 1.0) !important;
Post-minification: background: #ffffff01 !important;

Compressing the RGB value seems to work in that it converts to ffffff, but it's including the opacity in the hex value, which causes it to break.

Hi,

minifying "-webkit-text-size-adjust: none;" removes the space character and breaks WebKit rendering. Confirmed for Safari 5, Safari 9.1 and Midori 0.5.11. Safari 10 and other modern browsers appear to correct this bug.

Since Java version has the same output, it's not a bug. Just a suggestion for improvement.
Input:

section  a   :not( .one  , .two  , [ data-x = " ab  c " ] ) {
  color  : red ;
}

Ouput:

section a :not(.one,.two,[data-x=" ab  c "]){color:red}

Space before :not can be safely removed.

A string alteration component should not alter PHP settings--especially those put in place to protect a system from PHP overusing resources--but I realize the pragmatism in CSSmin choosing to do this by default.

I think this functionality should probably be moved to a component dedicated to sniffing and altering settings like these. I think at most CSSmin should keep the getSuggestedPhpLimits() method, or have those in a PHPDoc annotation that could be read through reflection.

Should run() return the settings to their original values before returning? Maybe the settings shouldn't be altered until run() is called... anyway, something to think about.

if you have the following CSS code calc(612px + (100% - 1024px)/2) the css min function generates at the moment the following result: calc(612px +(100% - 1024px)/2). Because the whitespace are left over between the plus and the bracket, the css code is invalid.
The problem is located in the replace_calc function. I have fixed it with the following code:
$token = preg_replace('/\s*([\*\/\(\),])\s*/', '$1', $matches[2]); $token = preg_replace(['/(\S)([+-])/', '/([+-])(\S)/'], '$1 $2', $token); $this->preserved_tokens[] = trim($token);

Please fix this problem in the next Version :)
Best regards

We have problem with compressing bootstrap.css
There is an error somewhere over:
$css = preg_replace_callback('/(?:^|})(?:(?:[^{:])+:)+(?:[^{]*{)/', array($this, 'replace_colon'), $css);
$css = preg_replace('/\s+([!{};:>+()]~=,])/', '$1', $css);
$css = preg_replace('/' . self::CLASSCOLON . '/', ':', $css);

It's poissible add a file chooser?
i use this tool in local and every time i need to copy and paste :-/
also a download feature maybe more useful.
another feature it's show the diff on byte below and after the compress.

I get 'segmentation fault' when compressing some css files.
Here is my test script:

require_once './library/CssMin.php';

$cssMin = new CssMin();

$testCss = file_get_contents('./themes/cureline/css/reset.css');
$compressed = $cssMin->run($testCss);

echo $compressed;

output:

newtoaster.dev/ (develop) $ php test.php 
Segmentation fault

phpStorm with xDebug attached process to line 93 and then fails
i'll update if got more details

UPD: sorry, this is css that breaks https://gist.github.com/PavloKovalov/8582652

sometimes, @media queries are redundant, especially when generated by CSS preprocessors which support nested media queries. eg:

@media screen and (min-width: 768px) and (min-width: 800px) {
...
}

These should be rewritten to remove redundancies:

@media screen and (min-width: 800px) {
...
}

similarly, @media queries are sometimes impossible, eg:

@media screen and (max-width: 767px) and (min-width: 800px) {
...
}

these (and their associated blocks) should be completely removed.

Came across this issue when using the Drupal module advagg:

Raw:
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale")

Compressed:
filter:url("data:image/svg+xml;utf8,<svgxmlns='http://www.w3.org/2000/svg'><filterid='grayscale'><feColorMatrixtype='matrix'values='0.33330.33330.3333000.33330.33330.3333000.33330.33330.33330000010'/></filter></svg>#grayscale");

Sample write-ups/examples about usage:

• http://www.karlhorky.com/2012/06/cross-browser-image-grayscale-with-css.html
• https://coderwall.com/p/mqk9ea
• https://gist.github.com/karlhorky/3478370

If you run this:

$minifier = new \tubalmartin\CssMin\Minifier();
$minifier->run('#id {');

Then Minifier::processRuleBodies() will get itself into an infinite while-loop, because it does not consider that $blockEndPos may be false.

Expected behavior is that an exception should be thrown.

The replacement of preservedTokens doesn't restore nested tokens resulting in CSSMIN_PTK_X tokens appearing in the final minimised output.

Some tokens in the preservedTokens contain tokens themselves which don't get replaced. For example;
'_CSSMIN_PTK_629_' => 'x-slicer:stretch:bottom, frame-bg:url(_CSSMIN_PTK_10_), bg:url(_CSSMIN_PTK_11_), corners:url(_CSSMIN_PTK_12_), sides:url(_CSSMIN_PTK_13_)', '_CSSMIN_PTK_630_' => 'x-slicer:stretch:bottom, corners:url(_CSSMIN_PTK_35_), sides:url(_CSSMIN_PTK_36_), frame-bg:url(_CSSMIN_PTK_37_), bg:url(_CSSMIN_PTK_38_)', '_CSSMIN_PTK_631_' => 'x-slicer:stretch:bottom, corners:url(_CSSMIN_PTK_39_), sides:url(_CSSMIN_PTK_40_), frame-bg:url(_CSSMIN_PTK_41_), bg:url(_CSSMIN_PTK_42_)', '_CSSMIN_PTK_632_' => 'x-slicer:stretch:bottom, corners:url(_CSSMIN_PTK_43_), sides:url(_CSSMIN_PTK_44_), frame-bg:url(_CSSMIN_PTK_45_), bg:url(_CSSMIN_PTK_46_)', '_CSSMIN_PTK_633_' => 'x-slicer:stretch:bottom, corners:url(_CSSMIN_PTK_47_), sides:url(_CSSMIN_PTK_48_), frame-bg:url(_CSSMIN_PTK_49_), bg:url(_CSSMIN_PTK_50_)',

PHP 5.x end of life is approaching fast. There are a couple of minor PHP 7.2 incompatibilities in this project, both in gui/index.php:

• ini_set('magic_quotes_sybase', 0); --> this directive has been removed. I guess it's safe also to disable it.
• parse_str($_POST['options']); --> parse_str now requires the return parameter to be set. I searched across the code and couldn't find

Would it be ok to raise the PHP minimum version requirement? I can raise a PR if you want

Thank you for this great tool!

Hello! I was trying your library on my system but as soon as I call it apache crashes.
This is the error taken from apache's log:

[Thu Jul 18 17:41:58 2013] [notice] Parent: child process exited with status 3221225725 -- Restarting.

I tried also with CSSmin(false); and installing a fresh version of apache but had no luck.

There are some little changes in PHP 7.4 with could break the normal usage of cssmin. Perhaps these things can be fixed:

• get_magic_quotes_gpc() is deprecated, see https://github.com/tubalmartin/YUI-CSS-compressor-PHP-port/blob/master/gui/index.php#L41

An Autoptimize-user has CSS with a calc in it which gets broken. Whereas YUI-CSS-compressor-PHP-port normally preserves spaces, it does not in this case (confirmed using GUI)

Test input;
input { width: calc(100% - (1em*1.5)); }

Expected output:
input{width:calc(100% - (1em*1.5))}

Actual Output:
input{width:calc(100% -(1em*1.5))}

Frank

Is javascript compression supported?
If no, can you please recommend some alternative for that task?

I ran into a problem with CSSmin hanging during the minification process. Eventually I tracked it down to a problem with an unclosed comment at the end of the file. It can be reproduced with this CSS:

/* Comment 1 */
/* Comment 2

When I run CSSmin against this it does the infinite loop thing until hitting the max execution time limit in PHP.

Yes the error is that user didn't close the comment, but I think a defensive approach would be to strip the unclosed trailing comment out.

The minification process strips out spaces from base64 strings - https://github.com/tubalmartin/YUI-CSS-compressor-PHP-port/blob/master/src/Minifier.php#L388

But I ran into a case where doing this actually broke previously working PNG images. It turns out that browsers are very forgiving about invalid characters in base64 strings.

I put together an example of this in action at https://josephscott.org/tests/base64-spaces/

For now I've commented out the three lines that remove the spaces.

Ultimately, because of the looseness of browsers supporting these types of base64 strings, I think the minification process should NOT strip spaces by default. Then we could have an option that would turn it on. That would make things more safe by default, and still give those who knew it was ok to strip out their spaces, an easy way to do that.

a{background:0 0}
becomes
a{background:0}

fix could be to change line 357 from
$css = preg_replace('/(background\-position|webkit-mask-position|(?:webkit|moz|o|ms|)\-?transform\-origin)\:0(;|\}| \!)/iS', '$1:0 0$2', $css);
into
$css = preg_replace('/(background|background\-position|webkit-mask-position|(?:webkit|moz|o|ms|)\-?transform\-origin)\:0(;|\}| \!)/iS', '$1:0 0$2', $css);

frank

Try "-20.0deg" or "-20.0px". Both will stay untouched.