'Is Nuxt Fetch method bad for SEO
Maybe this is a stupid question, I am using the fetch method but I observed that initially, it's showing the default title which I have set in my layout/default.vue but after half second the title is getting updated which is set from the head method of the page. Is this change in title bad for SEO.
I read on some other answers asyncData blocks the page transition until it resolves. does this mean fetch reduces initial server response time compare toasyncData
Solution 1:[1]
At the end, the best result that you can get regarding SEO is to have the whole thing totally static. So, having a static head meta-tag too.
As explained in this amazing video.
The best way to see what the Google crawler may see first (even if he is crawling your SPA but it delivers a lower score) is to preview your app without any JavaScript or view the source code (ctrl + u) directly.
You can disable JS via your devtools.
The half-second change that you see is basically the difference between:
- the app initially served from the server
- the hydrated app that brings the full power of your Vue.js SPA app
It would be best to have as little difference as possible between both.
asyncData is basically working as:
- you're on page A
- you load the content of page B
- you move to page B
fetch is working like:
- you are on page A
- your move to page B
- you load the content of page B
fetch() can mainly provide a better experience regarding skeletons/loaders but the total time between data readable on page A and page B is the same with both hooks (in exactly same conditions of course).
Finally, it will not reduce the initial loading time because there is no route transition initially (you "arrive" on the page, like when your press F5).
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | kissu |