How to resolve slow loading Attribute Select problem in WooCommerce Backend?

patrick

Currently, we have more than 25, 000 terms inside one attribute, While editing a product and clicking into the field for the attribute it's taking 10 seconds before the list of suggested terms drops down in Woocommerce

I tried by installing and setting up Redis on the server and on WP but nothing changed

Is it possible to make this faster? Also, it will be ok if we can turn off the suggestions we can just type the attribute value we need and save without a hang? Please let me know the best possible solution

anderson

In woocommerce code there is no ajax request made for this select, which means no use in caching. The reason for slowing down is javascript/select2 which have too many options to show.

But Woocommerce, have ample actions, filters and hooks to change the behaviour of this select2.
You can use this small plugin to fix your issue by doing an ajax search limited to 100 terms rather than showing all of the terms in the select2
function.php

/**
 * Enqueue script
 */
add_action( 'admin_enqueue_scripts', function () {
    wp_enqueue_script( 'wc-fix-attributes', plugins_url( 'script.js', __FILE__ ) );

    wp_localize_script( 'wc-fix-attributes', 'WCFixAttributes', [
        'ajaxurl' => admin_url( 'admin-ajax.php' ),
        'nonce' => wp_create_nonce( 'wc_fix_search_terms' ),
    ] );
} );

/**
 * Ajax search
 */
add_action( 'wp_ajax_wc_fix_search_terms', function () {
    // Permissions check.
    check_ajax_referer( 'wc_fix_search_terms' );

    if ( ! current_user_can( 'manage_product_terms' ) ) {
        wp_send_json_error( __( 'You do not have permission to read product attribute terms', 'woocommerce' ) );
    }


    if ( ! empty( $_REQUEST['taxonomy'] ) ) {
        $terms = get_terms( [ 'taxonomy' => $_REQUEST['taxonomy'], 'number' => 100, 'name__like' => $_REQUEST['term'] ] );

        $terms = array_map( function ( $term ) {
            return [ 'text' => $term->name, 'slug' => $term->slug, 'id' => $term->term_id ];
        }, $terms );

        wp_send_json( [ 'results' => $terms, 'success' => true ] );
    } else {
        wp_send_json_error();
    }
} );

script.js

jQuery(function ($) {
    // The woocommerce select2 is initializing
    $(document.body).on('wc-enhanced-select-init', function () {
        //We need to wait a bit for it to be fully inited
        setTimeout(function() {
            $('select.attribute_values').each(function () {
                var $that = $(this);
                $that.select2({ //Add an ajax option to it, to search the terms dynamically
                    ajax: {
                        url: WCFixAttributes.ajaxurl,
                        dataType: 'json',
                        type: "GET",
                        quietMillis: 400, //Typing delay before sending the request
                        data: function (term) {
                            return {
                                action: 'wc_fix_search_terms',
                                _wpnonce: WCFixAttributes.nonce,
                                // Get the taxonomy printed from our action
                                taxonomy: $that.parent().children('.attribute_taxonomy_getter').data('taxonomy'),
                                term: term.term
                            };
                        },
                    }
                });
            });
        }, 100);
    })
});

You need to make a directory in your plugins directory (with any name) and add those two files or download the zip and upload it in wordpress.