Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more

On WordPress 6.3 and later, defer an enqueued script by passing 'strategy' => 'defer' in the fifth argument of wp_enqueue_script(). Keep in_footer enabled where appropriate, verify the script’s dependency chain, and test any inline code that expects a library to run early. If you need to add the setting after registration, use wp_script_add_data( $handle, 'strategy', 'defer' ).

What “defer JavaScript” means in WordPress

A normal, parser-discovered script can pause HTML parsing while the browser downloads and executes it. That pause is why performance tools often report render-blocking JavaScript. A script marked defer can download while the browser continues parsing the document, then execute after parsing has finished. Deferred scripts retain document order relative to other deferred scripts, which makes them safer than async for code with dependencies.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Deferring does not make JavaScript disappear, remove its execution cost, or guarantee a faster page in every case. It changes when the browser is allowed to fetch and run the file. A script that modifies the initial markup, supplies an early global, or is required by inline code may need to remain blocking or move to the footer instead.

How to defer JavaScript in WordPress 6.3 and newer

WordPress 6.3 added a native script strategy API. The preferred pattern is to pass an associative array as the fifth argument to wp_enqueue_script().

<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_enqueue_script(
        'my-app',
        get_stylesheet_directory_uri() . '/js/app.js',
        array(),
        '1.0.0',
        array(
            'in_footer' => true,
            'strategy'  => 'defer',
        )
    );
} );

Place this code in a child theme’s functions.php or in a site-specific plugin. Replace the handle, URL, dependency array, and version with the values for your own bundle. The handle must be unique within the page.

What each argument does

  • Handle: my-app is the identifier WordPress uses for the script and its dependency relationships.
  • Source: The second argument points to the JavaScript file. A theme URL function keeps the path correct when the theme moves.
  • Dependencies: The third argument lists handles that must be available before this script runs.
  • Version: The fourth argument becomes a cache-busting query value. Change it when the file changes.
  • Arguments: The fifth argument sets footer placement and the loading strategy. In WordPress 6.3+, defer and async are supported strategy values.

Using a dependency in the same call

<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_enqueue_script(
        'my-app',
        get_stylesheet_directory_uri() . '/js/app.js',
        array( 'wp-i18n' ),
        '1.0.0',
        array(
            'in_footer' => true,
            'strategy'  => 'defer',
        )
    );
} );

WordPress uses the handle in the dependency array, not the filename. If the dependency itself is registered by a plugin or by WordPress core, inspect how that handle is loaded before changing its strategy.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Using wp_script_add_data to set defer after registration

If a script is already registered and you need to set its strategy separately, add the strategy data to its handle:

<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_register_script(
        'my-app',
        get_stylesheet_directory_uri() . '/js/app.js',
        array(),
        '1.0.0',
        true
    );

    wp_enqueue_script( 'my-app' );
    wp_script_add_data( 'my-app', 'strategy', 'defer' );
} );

The final true registers the file for the footer. The strategy is attached to the already-registered handle, so this pattern is useful when registration and enqueueing occur in different parts of a theme or plugin.

WordPress 6.3 and later understand this data. Older WordPress versions ignore the strategy value rather than producing a defer attribute; the same script therefore falls back to its ordinary loading behavior on those installations. The $args array form also requires WordPress 6.3 or later.

Choosing between defer, async, and footer loading

Option Download Execution Best fit Main risk
defer While HTML parsing continues After parsing, in dependency/order sequence Application bundles and scripts that rely on one another Code that must run before parsing or inline code that expects an early global may break
async While HTML parsing continues As soon as the file is ready; order is not guaranteed Independent analytics, widgets, or other self-contained files A dependent script may run before its library or before required markup exists
Footer only Usually after the main document has been encountered According to normal script rules at the footer Code that can wait until the page body is available It can still block parsing near the footer and does not provide the same scheduling semantics as defer

Use defer as the default for an ordered application bundle. Use async only when the file has no execution-order relationship with other scripts. Moving a script to the footer is a placement decision; it is not automatically equivalent to applying a strategy.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Dependency rules you must preserve

WordPress calculates a compatible strategy across a script’s dependency graph. For a script marked defer to preserve execution order, its dependencies must be blocking or deferred, and scripts that depend on it must also be deferred. An asynchronous dependency cannot safely be treated as an ordered prerequisite.

Safe chain

<?php
wp_register_script( 'library', '/js/library.js', array(), '1.0.0', array(
    'in_footer' => true,
    'strategy'  => 'defer',
) );

wp_register_script( 'app', '/js/app.js', array( 'library' ), '1.0.0', array(
    'in_footer' => true,
    'strategy'  => 'defer',
) );

wp_enqueue_script( 'app' );

Here, both handles are deferred and the dependency relationship is explicit.

Risky chain

<?php
wp_register_script( 'library', '/js/library.js', array(), '1.0.0', array(
    'in_footer' => true,
    'strategy'  => 'async',
) );

wp_register_script( 'app', '/js/app.js', array( 'library' ), '1.0.0', array(
    'in_footer' => true,
    'strategy'  => 'defer',
) );

The browser is free to execute library at any time, so app cannot rely on it being initialized first. Either keep the library blocking, make both scripts deferred, or redesign the code so the files are independent.

Why jQuery and inline scripts need special care

Many themes and plugins assume that jQuery, another library, or a global configuration object is available as soon as an inline block runs. Deferred files execute after document parsing, so an inline block that appears earlier can encounter an undefined function or object.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Do not place jQuery in a blanket “defer every JavaScript file” rule unless the complete site has been tested. The same caution applies to scripts that:

  • define globals consumed by inline JavaScript in the document head;
  • write configuration values that a library reads during its initial evaluation;
  • alter markup before another script queries it;
  • provide event handlers needed during the initial interaction;
  • are dependencies of third-party handles you do not control.

A safer approach is to defer your own bundle first, then test each dependency chain. If an inline block must run after a deferred library, move that inline logic into a dependent deferred file or place it after the library’s initialization path instead of forcing a timing race.

How to identify scripts worth deferring

  1. List the handles. View the enqueue calls in your theme and plugins, and inspect the page source or browser developer tools to identify the files loaded on the affected template.
  2. Separate first-party and third-party code. Your own bundle can usually be changed with a controlled release. A plugin-owned handle may be shared by several features or have undocumented inline consumers.
  3. Map dependencies. Record each handle’s dependencies and dependents. Do not change one node in isolation when other code relies on its execution timing.
  4. Start with non-critical bundles. Choose scripts that enhance an already usable page rather than code required to render navigation, forms, checkout-like interactions, or above-the-fold behavior.
  5. Apply one change at a time. This makes a regression traceable and lets you revert the exact handle that caused it.

How to verify that WordPress actually deferred the file

After adding the strategy, clear any page cache and load a page where the handle is enqueued. In the browser:

  1. Open developer tools and select the Elements or Inspector panel.
  2. Search for the script’s filename or handle in the generated HTML.
  3. Confirm the resulting <script> element has a defer attribute and that it is not being rewritten by another optimization layer.
  4. Use the Network panel to check that the file loads on the intended page and returns a successful response.
  5. Reload with the console open and look for JavaScript errors, missing globals, failed module imports, and requests that now occur in the wrong order.
  6. Test logged-in and logged-out views, mobile and desktop layouts, and every template that enqueues the handle.

A performance audit may still mention JavaScript after successful deferral. Deferring affects parser blocking; it does not remove script execution time, network transfer, third-party activity, or long tasks that occur after parsing.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

WordPress’s footer and module-import caveat

The developer reference requires a script with a strategy to be printed in the footer or to use a deferred strategy. This ordering matters for script modules: the import map must be printed before the module is evaluated. Registering a strategy-bearing file for the footer, as in the examples above, satisfies that placement requirement for the common case.

If a plugin registers a strategy-bearing script in the head, do not assume that adding defer alone fixes module ordering. Inspect the generated markup and the plugin’s registration code, then adjust placement and dependencies together.

Handling caching and optimization plugins

Optimization plugins can add their own defer or delay behavior, rewrite script tags, combine files, or inject inline loaders. Running two independent deferral systems on the same handle can produce duplicate attributes, altered order, or a loader that no longer matches WordPress’s dependency information.

When using a caching or performance plugin:

  • Record which feature is changing JavaScript timing before enabling WordPress strategies.
  • Choose one system to own the policy for a given handle whenever possible.
  • Exclude a script from the plugin’s automatic deferral if WordPress’s strategy is managing it and the plugin offers per-file exclusions.
  • Clear the plugin cache, server cache, CDN cache, and browser cache after changing the policy.
  • Recheck the final HTML rather than relying on the enqueue code alone; the delivered document is authoritative.

A support report has documented a clash between a plugin’s own deferral and WordPress strategy attributes. The practical lesson is to test the rendered output and disable overlapping processing when behavior changes unexpectedly.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Common failures and how to fix them

“The defer attribute is missing”

  • Confirm the site runs WordPress 6.3 or newer when using the $args strategy form.
  • Check that the handle is actually enqueued on the page you are viewing.
  • Ensure wp_script_add_data() runs after registration and uses the exact handle.
  • Inspect optimization, concatenation, and CDN rewriting; one of them may be replacing the tag.
  • Clear all caches and view the generated HTML again.

“A function is not defined” or “$ is not a function”

An inline block or dependent file is running before the deferred library. Remove that library from the deferred set, defer the dependent code as one ordered chain, or move the initialization into a file that explicitly depends on the library. Do not solve an ordering problem by adding random timeouts; make the dependency and execution order explicit.

“The page works only after a refresh”

This usually indicates a race between an asynchronous file, a deferred file, and code that expects a fixed order. Replace async with defer for related files, or make the files independent. Check whether a cache plugin serves different script combinations to different visitors.

Best Value
BAZIC Products Take Along Large Print Word Finds Puzzle Book, 2 Titles
  • Offer contains ONLY 2 titles regardless of the order quantity placed for this listing. Set of volumes may vary. Ordering in multiples will not change the volume received. Image is meant to display the type of book you will be receiving only.
  • BRAIN TEASING. Perfect Puzzle Book for all ages to learn. Enjoy puzzles, maze, word search, or crosswords! This puzzle book is ideal for people on the go and will provide hours of entertainment.
  • FUN & CHALLENGING. Exercise your brains long-term memory, working memory, executive functioning, attention to detail, multitasking, and processing speed. Perfect gifting item for those who love word search puzzles!
  • RELAX, RECHARGE, & REFOCUS. The word find puzzle book offers an enjoyable challenge for all, from beginners to experts. Ideal for learning, practicing, and having fun time for various users.
  • OFFICIALLY LICENSED. High-resolution printing. Perfect for family activities, classroom learning, or travel. Provide an engaging, educational experience with every page, making it both fun and meaningful.

“A plugin feature stopped working”

Restore the plugin’s handle to its original strategy and test again. If that fixes the feature, inspect the plugin documentation or source for inline consumers and dependencies before attempting a narrower change. Third-party handles are more difficult to defer safely because another component may rely on their timing.

Supporting older WordPress installations

On WordPress versions before 6.3, the native strategy API does not add defer behavior. The wp_script_add_data() call is ignored there, and the site receives normal script loading without an error. If you maintain a broad version range, feature-detect the API before calling it or accept the graceful no-op:

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_register_script(
        'my-app',
        get_stylesheet_directory_uri() . '/js/app.js',
        array(),
        '1.0.0',
        true
    );

    wp_enqueue_script( 'my-app' );

    if ( function_exists( 'wp_script_add_data' ) ) {
        wp_script_add_data( 'my-app', 'strategy', 'defer' );
    }
} );

The function itself exists in older WordPress releases, but those releases do not understand the strategy value as the 6.3 script API does. Treat the resulting behavior on older sites as ordinary loading, and do not promise defer support unless the site’s minimum WordPress version is 6.3.

A practical rollout plan

  1. Back up or use staging. JavaScript timing changes can affect forms, menus, editors, and logged-in administration screens.
  2. Choose one first-party handle. Prefer a bundle whose dependencies and consumers you control.
  3. Register it with in_footer and strategy => defer. Keep its version value stable until the code itself changes.
  4. Test the full dependency chain. Include every page template and interaction that uses the bundle.
  5. Inspect the delivered tag. Confirm the attribute survived caching and optimization.
  6. Expand gradually. Add another handle only after the previous change has passed functional testing.
  7. Document exclusions. Record why jQuery, an inline-dependent file, or a plugin handle remains blocking so a future optimization change does not reintroduce the bug.

Direct answers to common “force async/defer” questions

Can I force every WordPress script to defer?

You can technically alter many handles, but a site-wide rule is unsafe. Dependencies, inline consumers, modules, and third-party widgets do not share one timing contract. Apply strategies to known handles and preserve blocking behavior where the code requires it.

Should I use async instead of defer for better performance?

Not as a general replacement. async removes ordering guarantees, so it belongs only on independent scripts. For related files, defer provides predictable post-parse execution and is usually the safer strategy.

Does WordPress automatically defer all scripts after version 6.3?

No. WordPress 6.3 added the API; it does not automatically mark every enqueued script as deferred. You must set the strategy for each handle or use an optimization tool that changes loading behavior.

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Is a deferred script always faster?

No universal performance number is established for this change. The result depends on the script, network, browser, dependencies, and the work performed after parsing. Measure the delivered page and verify that functionality remains intact rather than treating the attribute as a guaranteed score improvement.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.