Taxonomy select_advanced select2 field is very slow

This topic has 7 replies, 2 voices, and was last updated 4 years, 5 months ago by Long Nguyen.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts
July 22, 2020 at 5:35 AM #20891
brandonjp
Participant
I've got users complaining that the drop-down/autosuggest for Taxonomy fields is very slow. Any tips on how I can optimize that? I'm guessing it is because of too many terms in the DB? (However, we've currently only entered about half of the terms we need)

Here's an example GIF:
https://www.dropbox.com/s/fj5tboz2uko4vpt/CleanShot%202020-07-21%20at%2015.28.36.gif?dl=0

And here's a code sample we're using to create the metaboxes:
```
            array(
                'id'         => $prefix . 'job_customer_taxonomy',
                'type'       => 'taxonomy',
                'name'       => esc_html__('Customer', 'text-domain'),
                'taxonomy'   => 'customer',
                'field_type' => 'select_advanced',
                'class'      => 'add-add-new-modal',
            ),
            array(
                'id'         => $prefix . 'job_contact_taxonomy',
                'type'       => 'taxonomy',
                'name'       => esc_html__('Contact', 'text-domain'),
                'taxonomy'   => 'contact',
                'field_type' => 'select_advanced',
                'class'      => 'add-add-new-modal',
            ),
```
Add New Note to this Reply
July 22, 2020 at 10:34 AM #20897

Long Nguyen
Moderator

Hi Brandon,

The field taxonomy get the taxonomy by the function get_terms of WordPress. Since version 5.2, Meta Box uses Ajax to increase the performance for the field select_advanced but too many terms might slow down the field query.

You can try to limit the number of terms display to improve the loading time, please follow this documentation https://docs.metabox.io/fields/taxonomy/#limit-the-number-of-terms-for-pagination.

Add New Note to this Reply

July 28, 2020 at 11:38 PM #21002
brandonjp
Participant
Thanks, Long. On the docs, it says

When the field is loaded, Meta Box only queries for saved terms (which is usually not many). So the initial query is very minimal and doesn’t cause any performance problem.

screenshot: https://cln.sh/mxnF3I

What does saved terms mean?

Right now we've got 150 tags and it takes usually 15 seconds to populate the dropdown, and it's currently set to only query for 10 terms.
- Is reducing the number of terms in the DB the only option?
- Would our internet speed or anything else be contributing you could think of?
- We're using MB Custom DB Tables, would that make it slower?
My next idea is I'm thinking about loading all terms as JSON into the browser on the page load. My users would be happier with extra time on page load, I think.

Add New Note to this Reply
July 29, 2020 at 9:29 AM #21003

Long Nguyen
Moderator

Hi,

When the field is loaded, Meta Box only queries for saved terms (which is usually not many). So the initial query is very minimal and doesn’t cause any performance problem.

That means, there are 10 items (default) loaded and ready to show on the first choice without query. After scrolling down to the bottom of the select field, it will do the next query to show more taxonomies. See my screen record to make sense.

I think the issue is the initial select2 (select advanced) when you click to the select field, please try to deactivate all plugins except Meta Box and MB extensions to check this issue again. If it still happens, I recommend using the field type select.

Add New Note to this Reply

July 30, 2020 at 7:46 AM #21020

brandonjp
Participant

Hello- I have realized something... Even though the first 10 are loaded, I think it is still making a new AJAX request and waiting on request to finish before it shows the first 10 that were pre-loaded. https://cln.sh/xgwV9g

Also in your screen recording it seems to take 2.5 seconds, which is a long time to load 10 items that are already in the page.

Add New Note to this Reply

July 30, 2020 at 9:53 AM #21022

Long Nguyen
Moderator

Hi,

Could you please deactivate all plugins except Meta Box and MB extensions then check the issue again? If it still happens, please share the admin site account via this form https://metabox.io/contact/, I will take a closer look and give a quick response.

Add New Note to this Reply

August 3, 2020 at 11:34 PM #21099

brandonjp
Participant

I have an update!

#1 - I've run over 50 tests and replicated my site onto 5 different server environments & found that the issue is with my server, DreamPress by DreamHost. Even on regular shared hosting from DreamHost (their non-DreamPress hosting), the site performs on average 5x better. I typically love DreamHost, but for this particular site we are switching to a different host. DreamPress explained to us that:

"Reviewing the site further, it does perform better on our non-DreamPress services such as shared or VPS. What that tells me is that the way that your plugin is configured is it's either not compatible with a proxy-based setup like we use on DreamPress as we use ngxcache to serve the site, which reverse proxies back to apache or the way it's handling caching is causing the problem and needs to have a rewrite."

I don't really understand exactly how that's affecting our plugin, as our plugin is not very complicated (other than it uses MetaBox for lots of custom fields with MB Custom Table).

Are you familiar with ngxcache & reverse proxies? Or have you had any other users where MetaBox.io plugin has performance issues because of caching?

#2 - However, there is the secondary issue that select_advanced select2 fields are still waiting on an ajax query on first click, even though they are simply fetching the same terms that were already loaded into the page. I think this should probably be a separate bug report, as I don't think this is how Metabox's select2 is expected to behave.

Add New Note to this Reply

August 4, 2020 at 10:45 AM #21113
Long Nguyen
Moderator
Hi,

#1 - This issue is so weird, querying to show 10 items (even 100 items) from the database is fast to show the dropdown items in 0-1s. I'm not sure with Nginx cache and reverse proxies of that server affect the ajax request while other servers not happen.

#2 - It seems an issue with the select2 library when it makes an ajax request when opening the dropdown. Refer https://github.com/select2/select2/issues/110#issuecomment-419255510.
You can turn off the ajax request by adding this code to the field setting.
'ajax' => false
Or make a request only the user type something to the search box by following this documentation
https://docs.metabox.io/fields/taxonomy/#searching-parameters.
```
'js_options' => array(
        'minimumInputLength' => 1, // THIS
),
```
Add New Note to this Reply
Author

Posts

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.