Metafields on locale pages (/ja, /en-es) are cached and return old values

Short description of issue

Metafields on locale pages (/es-es, /ja) are cached and return old values

Link to Shopify Store

imou-store-1018.myshopify.com (/es-es), tkindg-nd.myshopify.com (/ja)

Reproduction steps

We set metafields on the Shop object level to track settings for our app. This is stored across multiple keys. The main ones in this case are the keys ‘settings’ and ‘selling_plans’. We set these keys when settings change so it happens infrequently.

It is not consistent but often times we will see that the metafields load old versions for a locale using path (/ja, /es-es) but we haven’t seen the subdomain version running into issues yet.

It happens frequently to the stores I’ve linked.

To recover from this we are forced to unset the metafield and then set it again. This is the only way for it to recover. Alternatively it does to have in some cases changed after a few days.

Additional info

In the screenshot you can see the updated_at key for the two paths is completely different. Setting the metafield multiple times doesn’t change the locale one.

What type of topic is this

Bug report

This is how we load the keys.

Looks like the screenshots I included in the post are missing but these are the settings on two different paths of the same website.

Hi @kartik-stoq

Is this caching issue only happening on markets/locales? ie: metafields update as expected on the default market?

Yes @Liam-Shopify that appears to be the case in all of them.

We’re noticing this happening across markets as well now. The same metafield will be an older value on some markets but be the current value in other markets.

It eventually resolves itself but we see up to several days of delay.

Hi again @kartik-stoq

Could you share a timestamp of the requests and the x-request-id response header for stale and non-stale cases?

Will have to wait for another one. It is intermittent and merchants don’t always report when they see issues with it.

Also importantly I don’t see how I can get x-request-id and timestamps from Liquid interpolations. Can you tell me what I can look for in these cases.

Still seeing major issues with metafields being cached.

Here is another example from today. Even setting and unsetting the metafield is not fixing them. The value is several months old.

The value is being loaded from metafields in the theme app extension Liquid.

Hi @kartik-stoq

DMing you for details on this.

We found what the issue is. The Liquid templates we use in theme app extensions don’t update regularly or get cached for a while. The initial problem that we mentioned with locale pages is probably because locale pages don’t get enough traffic for the cache to bust.

Conceptually a solution is to know when metafields are out of date using the Shopify is out of date using the ‘now’ date filter and then accordingly handle the issue.

{%- comment -%} This gets baked into the cached Liquid template {%- endcomment -%}
window._RestockRocketConfig.liquidRenderedAt = {{ ‘now’ | date: ‘%s’ }};

// Client-side detection
function isCacheStale() {
const liquidRenderedAt = window._RestockRocketConfig.liquidRenderedAt;
const now = Math.floor(Date.now() / 1000); // Current time in seconds
const cacheAge = now - liquidRenderedAt; // Age in seconds

const MAX_CACHE_AGE = 2 * 60 * 60; // 2 hours

if (cacheAge > MAX_CACHE_AGE) {
  console.debug(`STOQ - Liquid cache is ${Math.round(cacheAge / 60)} minutes old, fetching fresh data`);
  return true; // Stale
}

return false; // Fresh

}

if (isCacheStale()) {
fetchFreshData();
} else {
useCachedMetafields();
}