Cloudflare's Rocket Loader + Wordpress -> Ignore scripts?

Question

I'm trying to make Cloudflare's Rocket Loader work on my WP site. Everything works fine except for the WP Visual Editor. I followed the advice here but it doesn't work:

How do I add custom attributes to javascript tags in Wordpress?

Cloudflare says that in order to make Rocket Loader ignore a javascript file I need to add the data-cfasync="false" tag before my script:

<script data-cfasync="false" src="/javascript.js"></script>    

https://support.cloudflare.com/entries/22063443--How-can-I-have-Rocket-Loader-ignore-my-script-s-in-Automatic-Mode-

Rocket loader doesn't ignore my JS files.

Here's my code:

function rocket_loader_attributes( $url )
{
$ignore = array (

'http://www.mysite.com/wp-includes/js/tinymce/tiny_mce.js?ver=349-21274',
'http://www.mysite.com/wp-admin/js/editor.js?ver=3.4.2'

);
if ( in_array( $url, $ignore ) )
{ // this will be ignored
return "$url' data-cfasync='false";
}

return $url;
}
add_filter( 'clean_url', 'rocket_loader_attributes', 11, 1 );

What is wrong with my code?

I'm currently using Rocket Loader on Automatic mode.

Can anyone help?

Maybe you can point me in the right direction.

Thank you.

Answer 1

I have found the solution for this!

As it's written in this article: Controlling Cloudflare Rocket Loader

Your script was almost right, but the manual mode is broken. You need to switch to automatic mode, and then make some modifications:

function rocket_loader_attributes_start() {
    ob_start();
}

function rocket_loader_attributes_end() {
    $script_out = ob_get_clean();
    $script_out = str_replace(
      "type='text/javascript' src='{rocket-ignore}", 
      'data-cfasync="false"'." src='", 
      $script_out);  
    print $script_out;
}

function rocket_loader_attributes_mark($url) {
    // Set up which scripts/strings to ignore
    $ignore = array (
        'script1.js'
    );
    //matches only the script file name
    preg_match('/(.*)\?/', $url, $_url);
    if (isset($_url[1]) && substr($_url[1], -3)=='.js') {
      foreach($ignore as $s) {
         if (strpos($_url[1], $s)!==false)
           return "{rocket-ignore}$url";
      }
      return "$url' data-cfasync='true";
    }

    return "$url";

}
if (!is_admin()) {
  add_filter( 'clean_url', 'rocket_loader_attributes_mark', 11, 1);
  add_action( 'wp_print_scripts', 'rocket_loader_attributes_start');
  add_action( 'print_head_scripts', 'rocket_loader_attributes_end');
}

Answer 2

Notice in the example that the tag does not have the type='text/javascript' attribute. For some reason Rocket Loader requires data-cfasync='false' to be used without the type='text/javascript'... a bug?

Your code does add the data-cfasync='false' attribute, but does not override the WordPress behaviour of adding the type='text/javascript' attribute also, which makes Rocket Loader not to "ignore" your script.

It might be tricky to override this WordPress behaviour since the relevant code does not support a filter...