The title in head is blink when change locale

[thariddler]

Version

v5.3.0

Reproduction link

https://github.com

Steps to reproduce

I set my head() in index.vue. The problem is when I change locale or navigate to another route I see title blink.

If I remove nuxt-i18n or set seo: false everything ok.

head () {
  title: `!!MY TITLE`
}

What is expected ?

No blink

What is actually happening?

Blink

_{This bug report is available on Nuxt community (#c165)}

[thariddler]

Looks like this is Nuxt page transition issue somewhere

[thariddler]

Just double checked from scratch on blank Nuxt app. This is nuxt-i18n issue.

[thariddler]

If I set seo: false then there's no issue. But what if I need SEO?

[adi-zz]

@thariddler, is it possible that this issue is in fact caused by kazupon/vue-i18n#408?

[thariddler]

Forgot to mention, to reproduce this issue you need long page transitions

.page-enter-active {
  opacity: 1;
  transition: opacity 1000ms linear;
}

.page-leave-active {
  opacity: 1;
  transition: opacity 1000ms linear;
}

.page-enter {
  opacity: 0;
}

.page-leave-active {
  opacity: 0;
}

If you have no transition then it's happening instantly and you will not notice the issue.

@adi-zz not sure! It could be because head() manipulation is triggered in wrong time n=by this module and it's conflicting with custom head() in pages.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[snitovets]

Have the same issue here :(

I just put console.log into head() and it's triggers every few seconds

Found why it's working like that. I have dynamic elements which creates time by time and it's causes this inconvenient behaviour
https://nuxt-community.github.io/nuxt-i18n/seo.html#improving-performance

[parsher]

I have the same issue too.

How to prevent it?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[rchl]

Try to disable seo option and use alternative seo method described in https://nuxt-community.github.io/nuxt-i18n/seo.html#improving-performance

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[shakhzodkudratov]

still have same problem

[rchl]

Create a new issue with a repo that reproduces.

[shakhzodkudratov]

@rchl thanks for this reply! I solved this issue by removing title property in head inside nuxt.config.js