Does the widget behave as expected when you disable Page Cache?
Thread Starter
Josh
(@joshuammott)
No disabling page cache didn’t affect the behavior. But, thank you, your post inspired me to take a more deductive approach to ferreting out the problem. It turns out the likely culprit is my CDN, CloudFlare (for ClickDesk specifically CloudFlare’s Rocket Loader function). Also, any JS minification that passed through W3TC before going to CloudFlare broke my Contact Form 7 response messages and my counts and email and print buttons on the sharing buttons for Jetpack. If I bypass CloudFlare everything works fine. FYI, if JS is not minified in W3TC first, then JS Minification and Rocket Loader do not break CF7 or Jetpack’s Sharing Buttons. I guess I’ll have to consider a CDN other than CloudFlare unless somebody has a suggestion???
https://wordpress.org/support/plugin/jetpack
https://wordpress.org/support/plugin/contact-form-7
https://wordpress.org/support/plugin/cloudflare
Hi Josh,
You’ve got a lot going on there, so without at the very least a URL/source to examine no one is really going to be able to help all that much. Some things to consider, however, are:
1.) Does disabling Rocket Loader solve all of the issues you’re having?
2.) Are you minifying .js with W3TC only?
3.) If you’ve combined your .js via W3TC, have you attempted troubleshooting for dependency issues?
4.) What CloudFlare caching level are you using?
5.) Have you tried this plugin to exclude ClickDesk .js files from Rocket Loader?
Again, without at least a URL/source to examine, this is guesswork.
Best,
AJ
Thread Starter
Josh
(@joshuammott)
Thanks for the suggestions AJ! To answer your questions in order:
1) Yes with respect to ClickDesk, but no as to CF7 and the sharing buttons,
2) I would either use W3TC or CloudFlare to minify JS exclusively, ie, no overlap.
3) If dependency issues are the order the scripts load, and dealt with by adjusting the order of JS files in W3TC Manual JS Minify tab, then yes.
4) Aggressive.
5) The plugin does weird things to ClickDesk and not functional for me (also breaks YouTube Lyte with my settings for some reason).
But all that said I think I found a reasonable solution. I have minified everything through W3TC using Auto (and async for JS). I have disabled CloudFlare’s Rocket Loader, and I have put the following into the “Never minify the following JS files:” field under the Advanced settings in the Minify Tab:
wp-content/plugins/jetpack/modules/sharedaddy/sharing.js
wp-content/plugins/contact-form-7/includes/js/jquery.form.js
wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js
wp-content/plugins/contact-form-7/includes/js/scripts.js
This allows ClickDesk, the sharing buttons, and CF7 all to behave properly. My page speed is around 2 seconds on average. Just in case anybody else is running into this issue I am running Cpanel on GoDaddy Shared Hosting with the Catch Everest Pro theme. I am minifying via Disk.
Awesome, glad you found a solution.
Rocket Loader… love-hate it.
Two other things you might try:
1.) Minify everything you’re going to minify with CloudFlare instead of W3TC, re-validate your cache, then re-test the load time to see which schema is ultimately faster for your site and set up. (if it works and is faster, re-enable Rocket Loader and see if anything breaks. Might not.)
2.) Try Autoptimize for .js: Autoptimize is often able to concatenate scripts that W3TC can’t. If that works for you, it is probable that you will be able to then re-enable Rocket Loader without issue.
EDIT: You could also try Autoptimize for all minification/combination, allowing W3TC to handle everything but.
One more, lol
You could also try skipping .js minification altogether and re-enabling Rocket Loader. Aside from asyncing them, Rocket Loader also combines (‘bags’) all of your scripts; which, in almost all conceivable instances, is more important than minification anyway.
The only (potential) downside to this being that, iirc, only Firefox and Chrome recognize CloudFlare’s script attribute. I.e Rocket Loader doesn’t work in Safari, IE, Et. al., etc.
Walking away now…
“Also, any JS minification that passed through W3TC before going to CloudFlare broke my Contact Form 7 response messages and my counts and email and print buttons on the sharing buttons for Jetpack.”
Make sure you don’t have minify turned on at both W3TC and CloudFlare.
Rocket Loader is also an optional performance feature that can be turned off (doesn’t affect the CDN aspect of our service).
If the behavior is only happening on a specific URLs with Rocket Loader, you could look at setting a PageRule to turn CloudFlare off on that URL.
Thread Starter
Josh
(@joshuammott)
AJ,
I tried your suggestions, and the best option seems to be to use Autoptimize for minification, and disable minification in all other applications. Rocket Loader would be nice as it really speeds up the page load time, but it breaks my Jetpack sharing buttons and it creates the caching problem with ClickDesk. Thanks for your suggestions! Autoptimize works very nice.
damoncloudflare,
I really like CloudFlare’s Rocket Loader but it breaks my scripts that are appearing on every page. If possible, it would be nice if CloudFlare could add the option to exclude certain files. As previously noted it would be too cumbersome to apply to all files except a couple. There is a plugin that purports to do this, but it’s buggy.
Hi Josh,
Rocket Loader would be nice as it really speeds up the page load time, but it breaks my Jetpack sharing buttons and it creates the caching problem with ClickDesk.
Sounds like dependency issues arising from inline scripts, especially if you were formerly (and successfully) asyncing your .JS with W3TC… Were you able to combine all .JS with Autoptimize, or did you have to exclude certain files to get it to work?
…Further, Rocket Loader (as an asynchronous JavaScript loader/virtual browser) has no technical connection to caching… none that I can think of off the top of my head, anyway. This does indeed sound like an issue with W3TC config/permissions and/or dependency issue(s) arising from script placement. Is there still no way to provide a URL to have a look at?
I really like CloudFlare’s Rocket Loader but it breaks my scripts that are appearing on every page. If possible, it would be nice if CloudFlare could add the option to exclude certain files.
I’ve been at them about this for longer than I can now remember. For a reason I know not what, they’re not interested in refining Rocket Loader in this manner. As I ask all people that ultimately come to the exact same, obvious conclusion/solution you have, please do let them know what you think via CloudFlare support. If enough people make the effort to complain about how ridiculous it is to not be able to exclude scripts right within the CloudFlare dashboard, they have to get on the ball with an appropriate change.
Best,
AJ
“Further, Rocket Loader (as an asynchronous JavaScript loader/virtual browser) has no technical connection to caching… none that I can think of off the top of my head, anyway”
It doesn’t have anything to do with caching (a separate performance feature from caching).
“I really like CloudFlare’s Rocket Loader but it breaks my scripts that are appearing on every page. If possible, it would be nice if CloudFlare could add the option to exclude certain files. As previously noted it would be too cumbersome to apply to all files except a couple. There is a plugin that purports to do this, but it’s buggy. “
This is the only option to exclude based on file type, unfortunately.
Another option, if Rocket Loader is only impacting certain URLs, would be to use PageRules to exclude URLs from performance features.
Thread Starter
Josh
(@joshuammott)
AJ,
I am able to combine everything with Autoptimize. I replaced ClickDesk with Live Chat by Screets. That chat plugin does not seem to conflict with Cloudflare. However, I do have to empty the W3TC cache every time I change my online/offline status. Combining the three (Autoptimize, W3 Total Cache, and Cloudflare) and switching to Screets reduced page load time to around 1 second. I am very happy with the combination, and I’m looking forward to moving to dedicated hosting which I hope will increase the page speed even more.
