Using apply_filters(script_loader_tag, ...) to add async to loading JS

I am trying to add the "async" attribute to my .js files that I am loading using the wp_enqueue_script in my footer. I found a "script_loader_tag" filter and tried using it this way.

add_filter( 'script_loader_tag', function ( $tag, $handle ) {
return str_replace( ' src', ' async src', $tag );
}, 10, 2 );

Of course this added the async attribute before the src. When I give 'src async' the final HTML becomes src async='<url>' :slight_smile:

I also saw this "apply_filters( 'script_loader_tag', $tag, $handle, $src )" from trac But couldn't find any example.

Is there any way I can add the async attribute at the end of the tag

e.g. <script src='<js URL>' async></script>

I tried using asynchronous Javascript plugins but none of them really loaded my javascript properly.