Re: Combine static CSS and JS files not working

[Matt Atterbury]

Hi,

Could you please:

* stop Apache

* clear your mod_pagespeed cache

* set Apache's debug level to debug

* restart Apache

* access some pages again?

The error_logs file should then list more detail on what mod_pagespeed is/isn't doing.

Regards, m.

On Fri, Nov 30, 2012 at 12:07 PM, gvasquez <gvas...@altiuz.cl> wrote:

Our website is http://www.altiuzreports.com/

I first started with default config using the CoreFilters, but then enabled extra ones as the default didn't seem to work, but still haven't got desired results as neither CSS nor JS get combined. Some files DO get combined, but most not, do I don't really get it.

The extra filters I added as per de pagespeed.conf file are:

    ModPagespeedEnableFilters defer_javascript,insert_image_dimensions,sprite_images,collapse_whitespace,move_css_above_scripts,combine_javascript,inline_import_to_link

What else should I provide you to assist me?

Regards,

Gonzalo.-

[Gonzalo Vásquez]

Ok, understood, but just to be sure:

-clear cache: delete all folder contents under "cache"?

-set apache's log level to debug: where/how?

Enviado desde mi iPhone

[Matt Atterbury]

Please see https://developers.google.com/speed/docs/mod_pagespeed/system#flush_cache for clearing your cache.

The loglevel is in your httpd.conf file, the LogLevel directive: LogLevel debug

--
"Klaatu barada nikto"                          (754) 444-6288

[Gonzalo Vásquez]

Great info, thanks. I'll check It in a while

Enviado desde mi iPhone

[Gonzalo Vasquez]

After doing as requested, I issued the following command:

cat  apache2/error.log|grep -i error|grep pagespeed

And got: 

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] http://www.altiuzreports.com/es/:97: CSS parsing error in http://www.altiuzreports.com/es/

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/media/system/css/modal.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/mobile.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] http://www.altiuzreports.com/es/:24: CSS parsing error in http://www.altiuzreports.com/media/system/css/modal.css

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] http://www.altiuzreports.com/es/:27-36: CSS parsing error in http://www.altiuzreports.com/templates/gk_music_free/css/mobile.css

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/normalize.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/joomla.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/joomla.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/template.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/template.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/templates/gk_music_free/css/menu/menu.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/modules/mod_pwebcontact/css/modal/blue.css because of parse error.

[Fri Nov 30 16:43:36 2012] [info] [mod_pagespeed 1.0.22.7-2005 @32393] Failed to combine http://www.altiuzreports.com/modules/mod_pwebcontact/css/modal/blue.css because of parse error.

Any ideas about it?

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

El 30-11-2012, a las 15:01, Matt Atterbury <matte...@google.com> escribió:

[Matt Atterbury]

When I see this error message I run the CSS through the W3C CSS validator: http://jigsaw.w3.org/css-validator/

Since mod_pagespeed supports most/all of CSS 2.1 but some features of CSS 3, I test using both versions.

In the case of modal.css, it has 1 CSS3 error and 4 CSS2.1 errors, and that's probably why mod_pagespeed gets a parse error and so doesn't combine.

m.

[Gonzalo Vasquez]

Mmmmm...so mod_pagespeed is strict regarding w3c standards, I'll have to ask someone to review our css and make them w3c compliant.

Thanks!

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

[Matt Atterbury]

On Mon, Dec 3, 2012 at 10:13 AM, Gonzalo Vasquez <gvas...@altiuz.cl> wrote:

Mmmmm...so mod_pagespeed is strict regarding w3c standards, I'll have to ask someone to review our css and make them w3c compliant.

Well, it's not so much that it's "strict", more that it's limited. mod_pagespeed has to parse the CSS to optimize it and we (initially) wrote that against the CSS2.1 spec (since CSS3 is not ratified yet despite being widely adopted). Since then we've added a few CSS3 features and tried to handle bits we can't parse (and not treat them as errors), but there are still limitations to what it can handle.

The upshot is that even if you "fix" the CSS there's no guarantee that mod_pagespeed will be able to handle it since it might be something else it doesn't (yet) handle.

Regards, m.

[Gonzalo Vasquez]

No problem Matt, understood. But if don't fix the CSS I won't know if that's the only "pain" for mod_pagespeed.

By the way, is there any way to make logging even more verbose about the parse error, as it doesn't actually say what wasn't able to parse.

Regards,

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

[Matt Atterbury]

On Mon, Dec 3, 2012 at 10:34 AM, Gonzalo Vasquez <gvas...@altiuz.cl> wrote:

No problem Matt, understood. But if don't fix the CSS I won't know if that's the only "pain" for mod_pagespeed.

By the way, is there any way to make logging even more verbose about the parse error, as it doesn't actually say what wasn't able to parse.

I think we have a build-from-source tool that will tell you exactly what it doesn't like - I'm tracking this down now.

Also, the next release is due out very soon, but the release after that should have a change so that we combine CSS even if there are parse errors (with some limitations).

Regards, m.

[Gonzalo Vasquez]

Ok, I'll be waiting that tool to dig into my failed css.-

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

[Matt Atterbury]

On Mon, Dec 3, 2012 at 10:58 AM, Gonzalo Vasquez <gvas...@altiuz.cl> wrote:

Ok, I'll be waiting that tool to dig into my failed css.-

See https://developers.google.com/speed/docs/mod_pagespeed/build_from_source#debug-css

[Gonzalo Vasquez]

Thinking about possible workarounds: what if identify the failing syntax and then externalize only those little bit into a smaller css references by the bigger one, will that improve performace? Will that combine the larger part with rest and leave the smaller missing part out of the equation but still working?

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

[Matt Atterbury]

On Mon, Dec 3, 2012 at 1:09 PM, Gonzalo Vasquez <gvas...@altiuz.cl> wrote:

Thinking about possible workarounds: what if identify the failing syntax and then externalize only those little bit into a smaller css references by the bigger one, will that improve performace? Will that combine the larger part with rest and leave the smaller missing part out of the equation but still working?

I think so yes. If the "outer" CSS file (the one referenced by the HTML) @import's the "bad" CSS, then the outer one should be combined as it will parse OK.

However, I'm not sure it would be worthwhile, since the combining saves one fetch but the @import adds one fetch (though this might be ameliorated by browser caching).

My /suggestion/ is to wait for the release when we'll be able to combine CSS files even if they have parse problems, as I'd be surprised if the lack of combining is hurting performance *that* much, though I confess I haven't checked your logs to see how many opportunities are being missed.

Regards, m.

[Shawn Ligocki]

Note: We cannot combine CSS files with @import statements (except for the first CSS file). So,

@import url(foo.css)

a { ... }

cannot be combined with

@import url(bar.css)

.b { ... }

Because @import statements are only allowed at the top of a doc.

[Matt Atterbury]

Thanks, of course. I shoulda remembered that :)

[Gonzalo Vasquez]

Ok, so that means that THE option is to wait for the mentioned released. Does it have an ETA already?

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

[Matt Atterbury]

Current plan is sometime in January, hopefully mid-Jan.

[Gonzalo Vasquez]

That'll be OK for us.-

Gonzalo Vásquez Sáez Gerente Investigación y Desarrollo (R&D) Altiuz Soluciones Tecnológicas de Negocios Ltda. Av. Nueva Tajamar 555 Of. 802, Las Condes - CP 7550099 +56 2 335 2461 gvas...@altiuz.cl http://www.altiuz.cl http://www.altiuzreports.com

[Shawn Ligocki]

We'll announce progress on the bug:

http://code.google.com/p/modpagespeed/issues/detail?id=565

[Matt Atterbury]

On Wed, May 22, 2013 at 1:01 AM, Michael Micacchi <mmic...@gmail.com> wrote:

I just wanted to write in an ask what might else be causing this CSS and JS combine fail. Unfortunately I'm experiencing the same issue, but my debug error log doesn't mention and combine fails. Do you have any tips for tracing my steps here?

Which version of mod_pagespeed are you using?

Could you try accessing the page with this query param added to the URL: ?ModPagespeedFilters=+debug

Then look at the page source - it should have HTML comments explaining why combining failed (if you're using a recent enough version).

m.

[Joshua Marantz]

Most of the filters don't do much with "+debug" yet; we are slowly adding some more coverage for that feature.  combine_css is covered but I think combine_javascript is not yet.  Sorry about that.

I took a look at the zip file and I don't see any issues with your JS files.  Are they all delivered with the same content-encoding?  That will be a function of your apache configuration more than the files themselves.

Also can you share a public URL?

On Mon, Jun 10, 2013 at 11:54 AM, Paul Beigang <pbei...@gmail.com> wrote:

Hi guys,

i experience the same problem with the "combine_javascript" filter.
I basically try to combine the javascript files from zurb foundation framework, if you want to see this files you can find them here: http://foundation.zurb.com/files/foundation-4.2.1.zip

I query the page with the following parameters "?ModPagespeed=on&ModPagespeedFilters=+debug,+combine_javascript",
pagespeed is working in general (i.e. css combine is working) but for the javascript combining i get the following message at "/mod_pagespeed_message":

[Mon Jun 10 17:33:46 2013] [Info] [7368] Cannot combine: not combinable
[Mon Jun 10 17:33:46 2013] [Info] [7368] Cannot combine: not combinable
[Mon Jun 10 17:33:46 2013] [Info] [7368] Cannot combine: not combinable
…

The only debug output i can find in the generated html source of the page is the following:

<!--css_combine: end_document--><!--
#NumFlushes            0
#EndDocument after     204us
#Total Parse duration  176us
#Total Render duration 13881us
#Total Idle duration   28us
-->

Does this have anything todo with combining javascript? ;) I ask because of the "css_combine" …

The Apache LogLevel is set to "debug", in the error log i can only find:



[Mon Jun 10 17:33:46 2013] [debug] net/instaweb/apache/mod_instaweb.cc(400): [client xx] ModPagespeed OutputFilter called for request /pagespeed_test/?ModPagespeed=on&ModPagespeedFilters=+debug,+combine_javascript


[Mon Jun 10 17:33:46 2013] [debug] net/instaweb/apache/mod_instaweb.cc(621): [client xx] Request accepted.
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_deflate.c(615): [client xx] Zlib: Compressed 4374 to 1313 : URL /pagespeed_test/index.html


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()
[Mon Jun 10 17:33:46 2013] [debug] mod_headers.c(743): headers: ap_headers_output_filter()


[Mon Jun 10 17:33:48 2013] [debug] net/instaweb/apache/mod_instaweb.cc(400): [client xx] ModPagespeed OutputFilter called for request /mod_pagespeed_message
[Mon Jun 10 17:33:48 2013] [debug] net/instaweb/apache/mod_instaweb.cc(621): [client xx] Request accepted.


[Mon Jun 10 17:33:48 2013] [debug] mod_deflate.c(615): [client xx] Zlib: Compressed 84012 to 5699 : URL /mod_pagespeed_message

--
You received this message because you are subscribed to the Google Groups "mod-pagespeed-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mod-pagespeed-di...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Maksim Orlovich]

Thanks for the test. This is because you're using strict mode (yey!),
and the combiner
turns itself off for strict mode code, since it relies on eval to
setup the environment ---
which strict mode disallows.

(basically, the difference in behavior is captured by this testcase:
<script>
'use strict';

eval("function x() { return 42; }");
alert(x());
</script>
)

On Tue, Jun 11, 2013 at 5:21 AM, Paul Beigang <pbei...@gmail.com> wrote:
> All JavaScript files are delivered with "Content-Encoding: gzip" …
>
> The actual js combine test setup (temporary set in the htaccess file) is the
> following:
>
> <IfModule mod_headers.c>
>
> <FilesMatch "\.(html|htm)$">
> Header unset Etag
> Header set Cache-control "max-age=0, no-cache"
> </FilesMatch>
>
> <FilesMatch "\.(jpg|jpeg|gif|png|js|css)$">
> Header unset Etag
> Header set Cache-control "public, max-age=600"
> </FilesMatch>
>
> </IfModule>
>
> ModPagespeedRewriteLevel PassThrough
> ModPagespeedEnableFilters rewrite_javascript,combine_javascript
>
> Here is my testpage
>
>
> Thanks!

[Paul Beigang]

Thanks for the answer!

Do you have any suggestion to work around this? Because my testcase relies on a the foundation framework, i guess they will stay to "use strict" (because its a good idea :D) – any plans to change pagespeed environment setup to non "eval" method?

Or is it fact that pagespeed cant combine "use strict" JavaScript in the moment and there are no plans to improve?

I ask so straight because i want to figure out if we can use mod_pagespeed including the combine feature with foundation… thanks again!

Best

[Paul Beigang]

And: What to you think about printing out the reason why pagespeed cant combine JavaScript after the message on the "mod_pagespeed_message" page? That should help a lot ;)

Am Mittwoch, 12. Juni 2013 23:46:22 UTC+2 schrieb Maksim Orlovich:

[Maksim Orlovich]

On Thu, Jun 13, 2013 at 5:05 AM, Paul Beigang <pbei...@gmail.com> wrote:
> Thanks for the answer!
>
> Do you have any suggestion to work around this?

Unfortunately, no.

> Because my testcase relies on a the foundation framework, i guess they will stay to "use strict"
> (because its a good idea :D) – any plans to change pagespeed environment
> setup to non "eval" method?
>
> Or is it fact that pagespeed cant combine "use strict" JavaScript in the
> moment and there are no plans to improve?

Unfortunately, I am not aware of any other method that works in
general. Basically, just concatenating
files isn't correct, because:
1) Any downstream declarations will get picked up, when they shouldn't
2) Any syntax errors will mess up everything.

(The eval method is also slightly wrong in that you can delete
declared variables/function which you can't normally,
but that's not 100% common).

> I ask so straight because i want to figure out if we can use mod_pagespeed
> including the combine feature with foundation… thanks again!

> And: What to you think about printing out the reason why pagespeed cant combine JavaScript after the message on
> the "mod_pagespeed_message" page? That should help a lot ;)

Yeah, I will do that, it's pretty straightforward to do so (if I don't
manage to forget by tomorrow...)

[Ehsan Htabar]

For clean cache:

rm -rf /var/cache/mod_pagespeed

mkdir /var/cache/mod_pagespeed

chown apache:apache /var/cache/mod_pagespeed

بیمه و مرجع بیمه و سوابق بیمه و مالیات

[Joshua Marantz]

That is not sufficient for clearing the cache, because there is an in-memory cache in the servers.

See https://modpagespeed.com/doc/system#flush_cache

--
You received this message because you are subscribed to the Google Groups "mod-pagespeed-discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to mod-pagespeed-discuss+unsub...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/mod-pagespeed-discuss/1ef28495-6ac0-4a7a-9a9c-c6b92f1eb117%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.