apache / incubator-pagespeed-mod

Apache module for rewriting web pages to reduce latency and bandwidth.
http://modpagespeed.com
Apache License 2.0
696 stars 158 forks source link

CSS optimization breaks IE11, how to disable? #1792

Open janslu opened 6 years ago

janslu commented 6 years ago

I have a problem with a large css file generated by one of the frameworks. Current ModPagespeed built on nginx 1.14 rewrites one of the rules from:

.cell.auto {
    -ms-flex: 1 1 0px;
    -webkit-box-flex: 1;
    flex: 1 1 0px;
}

to

.cell.auto {
    -ms-flex: 1 1 0;
    -webkit-box-flex: 1;
    flex: 1 1 0;
}

This change is fine in most browsers, but breaks Internet Explorer 11. Unfortunately this rule is used for a main site grid and the whole layout breaks. I have tried to find a place to disable this change, but I couldn't. Here are my enabled filters:

ah  Add Head
cc  Combine Css
jc  Combine Javascript
gp  Convert Gif to Png
jp  Convert Jpeg to Progressive
jw  Convert Jpeg To Webp
mc  Convert Meta Tags
pj  Convert Png to Jpeg
ws  When converting images to WebP, prefer lossless conversions
ec  Cache Extend Css
ei  Cache Extend Images
es  Cache Extend Scripts
fc  Fallback Rewrite Css 
if  Flatten CSS Imports
hpsr    Hint Preload of Subresources
hw  Flushes html
ci  Inline Css
gf  Inline Google Font CSS
ii  Inline Images
il  Inline @import to Link
ji  Inline Javascript
idp Insert DNS Prefetch
js  Jpeg Subsampling
cj  Move Css Above Scripts
rj  Recompress Jpeg
rp  Recompress Png
rw  Recompress Webp
ri  Resize Images
jm  Rewrite External Javascript
jj  Rewrite Inline Javascript
cu  Rewrite Style Attributes With Url
cp  Strip Image Color Profiles
md  Strip Image Meta Data

Any idea how I can protect this part of css from "optimization"?

oschaaf commented 6 years ago

That looks similar to what https://github.com/apache/incubator-pagespeed-mod/commit/2fb25bc323ebabf14eb0072dfa5574c432a30b86 fixed. Is the ngx_pagespeed version involved the latest one? (1.13.34.2?)

janslu commented 6 years ago

Yes, this seems like similar issue but I'm on the latest stable 1.13.35.2.

oschaaf commented 6 years ago

Sounds like a separate issue then, thanks for the report. I think that either completely disabling css rewriting [1] or excluding [2] the offending css url will help short term.

[1] https://www.modpagespeed.com/doc/filter-css-rewrite [2] https://www.modpagespeed.com/doc/restricting_urls

janslu commented 6 years ago

Disabling css_rewrite wasn't enough, I had to disable combine_css also. Thanks for taking a look into this. I wish IE could be forgotten already...

Lofesa commented 6 years ago

Hi @janslu How about disable it for the implied user-agent? I don't know the apache exacts syntax, but some like If UA like "explorer" then pagespeed DisableFilter combine_css;

janslu commented 6 years ago

@Lofesa Haven't thought about it... I don't know if it's even possible because I'm also using nginx to cache and store the page output. I'll look into it.

Lofesa commented 6 years ago

if ($http_user_agent ~* "^xxx$") { pagespeed DisableFilter combine_css; } where xxx is the user-agent string.