RG loading too quickly. Delay load until option sets completed

When I pass a filter to a list of products (Seating, Tables, Lighting, etc) the RG doesn’t show the correct products initially.

You can test for yourself here: MOFO | Products

Click one of the categories. Often times, it will show some seats when I click Tables, or some tables when I click Lighting.

Set up, On page load:

  • Set Custom States by extracting data from page URL
  • Pass the Custom States Text to Algolia
  • Algolia passes back Unique IDs of products
  • RG references UIDs for which products to show

It seems to be loading the RG before the Custom States are complete, since when I use debug_mode and run ‘step by step’ the products will load in the RG incorrectly initially until I pass by the step to apply the Custom States, at which point the correct products are shown.

Is there a way to stop the RG loading so quickly, to speed up the Custom State on Page Load or only load RG after Custom States are set.

Workflow on Page load:

Using Debugger:

tl;dr

  • Have you tried putting the options/state step in a custom event that is called before the Algolia search?
  • Where are the Algolia uids stored? What action is returning the uids? You should be able to wait until they are returned before displaying the RG.
  • You can query Algolia directly from the url parameter to avoid being delayed by custom states being set.
  • Can the custom states be of type text that represents the options’ values?
  • Where is the user being redirected from in order to arrive here with the OS filters? Is the RG count high? If it helps and is feasible, you can send the actual UIDs in the URL parameters.
  • Have you tried putting the options/state step in a custom event that is called before the Algolia search?
    – Would you refresh the RG element in Page Loaded workflow?
  • Where are the Algolia uids stored? What action is returning the uids? You should be able to wait until they are returned before displaying the RG.
    – Stored in Algolia. Passed into the RG filter:
  • You can query Algolia directly from the url parameter to avoid being delayed by custom states being set.
    – Didn’t know you could do this. Will investigate.
  • Can the custom states be of type text that represents the options’ values?
    – Actually already did this (custom states as text) I incorrectly called it Option Sets. I’ve corrected my initial post.
  • Where is the user being redirected from in order to arrive here with the OS filters? Is the RG count high? If it helps and is feasible, you can send the actual UIDs in the URL parameters.
    – Either this current page (it reloads if they click a filter) or another part of the site.

No but you can put a conditional on the RG to only be displayed when AlgoliaSimpleSearch Products != " " or alternatively, a separate custom state of whether to show results that is only set after all the other custom states in the CE i mentioned above.

Seems like some heavy filtering client side :anguished: which can be a big performance drag. Every time user changes a filter on this page it refreshes URL parameters and the page?!?

and for UX purposes put a spinner (preferably a lottie esp for desktop) to replace RG until it is ready)

I.e

  • On Page Load add a custom state ‘loaded’ = yes
  • RG has a conditional - only visible if ‘loaded’ = yes
    ?

Yes prob not the best way to go about it but should do the trick for you goal.

1 Like

This worked.

Glad to hear. If you have performance or WU issues, consider less advanced filtering and only using URL params when coming from a diff page :point_up:

Yeah, it’s something i worry about a little.

I want to ability for user to share the URL and filters to get applied.

Initial page load allows for that without reapplying advanced filters and searches upon every filter change or a filter view that can be saved and shared.

Turns out it’s not working now. I didn’t change anything after it worked for a few attempts.

Set up:

  • Page load workflow : Set custom states from URL and custom state of ‘loaded’ = no
  • Page load workflow : Change custom state of ‘loaded’ = yes, only if ‘loaded’ = no (trying to force loaded = yes to only occur after custom states are finished).
  • Conditional state on RG to visible if Loaded = yes

Same issue as I was having before. RG seems to be showing products that aren’t being filtered by custom states. Could the RG be loading in the background even if it is not visible?

Put Step1 into a CE.
Is RG collapsed when hidden (it shouldn’t make a difference but just in case).
What is product category? is it name of RG?

Just double check that default value for Loaded is NO

This topic was automatically closed after 70 days. New replies are no longer allowed.