WP 5.3 and deferring JavaScript files

  • Resolved Carl Gross

    (@carlgross)


    5 years, 3 months ago

    Hello. For several years I’ve had custom PHP code on my site which ensured all JavaScript files (except jquery.js) were deferred during page load. Prior to WP version 5.3, the code resulted in no front-end issues, or JavaScript console errors. Furthermore, page speed checkers like Google’s PageSpeed Insights confirmed that the JS files were sufficiently deferred, and not slowing down page load. The code is at the bottom of this post.

    But after updating to WordPress version 5.3, this code now results in many JavaScript console errors (screenshot). Just about all of the errors seem to be related to WordPress core files. If I remove the custom PHP code, the JS console errors do not appear. But conversely, my page load time seems to increase significantly because these files are no longer deferred.

    Does anyone know why this change has occurred? Did version 5.3 move code around (or add new code) so that I can no longer defer the loading of some of these core JS files?

    Thanks in advance.
    ___
    **My PHP Code**

    function hh_defer_parsing_of_js ( $url ) {
  if ( FALSE === strpos( $url, '.js' ) ) return $url;// Skip all non .js files.
  if ( strpos( $url, 'jquery.js' ) ) return $url;// Skip jquery.js.
  return "$url' defer onload='";
}
add_filter( 'clean_url', 'hh_defer_parsing_of_js', 11, 1 );
    • This topic was modified 5 years, 3 months ago by Carl Gross.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

  • I looked in the 5.3 Field Guide, but didn’t see any mention of removing deprecated functions, but the clean_url function has been deprecated since WP 3.0. It sounds like your code isn’t being called.

    Thread Starter Carl Gross

    (@carlgross)

    Hey thanks for the reply.

    >> the clean_url function has been deprecated since WP 3.0. It sounds like your code isn’t being called.

    If I add some print statements to my code, I can confirm my code is being executed. I see that the clean_url function is deprecated. But I’m using the clean_url hook, which doesn’t appear to be deprecated. Also, if I was using something deprecated in my oce, wouldn’t an entry appear in the WordPress PHP error log?

    Thanks.

    Yes, the clean_url filter is being called from the suggested replacement for the clean_url function, esc_url().

    Perhaps some dependencies were rearranged, and you can no longer defer all scripts.

    Thread Starter Carl Gross

    (@carlgross)

    >> Yes, the clean_url filter is being called from the suggested replacement for the clean_url function, esc_url().

    Actually, what I was saying is that my code does not use the clean_url function at all. My code uses the clean_url filter. Here is my code:

    add_filter( 'clean_url', 'hh_defer_parsing_of_js', 11, 1 );

    Is the clean_url filter deprecated?

    I understood that from the beginning. And if you reread my last reply, you will see that the filter is still being used in core.
    You should look at the dependencies and whether they are out of order when using defer.

    Thread Starter Carl Gross

    (@carlgross)

    Actually I figured out the cause of my issue. After updating one of my plugins, it decided to include some Gutenberg-only JS files on every page of my site, including my home page, even though neither the plugin nor Gutenberg is in-use on the page. I spoke with the plugin devs, and they fixed that issue, which in-turn resolved my JS console errors. I guess my PHP code should do better at error handling as well though.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘WP 5.3 and deferring JavaScript files’ is closed to new replies.