search

harlan-zw / nuxt-delay-hydration

Delayed hydration for progressively enhanced apps. Reduced blocking time and improved Google Lighthouse scores. ⚡️
MIT License
369 stars 22 forks source link

Can using this module affect indexing when using a "site loader" element? #44

Closed stefanobartoletti closed 1 month ago

stefanobartoletti commented 5 months ago

First of all thanks for this module :v:

I am testing it to improve the performances of my website, which has some pretty heavy resources to be loaded, mostly some 3d animations. It is built in a way that user experience is not really affected much, but Google PSI is not really happy about it.

This is the live production website: https://www.stefanobartoletti.it/ and this is the staging where I am testing nuxt-delay-hydration: https://staging--stefanobartoletti.netlify.app/

Here is a comparison

Unoptimized site

https://pagespeed.web.dev/analysis/https-www-stefanobartoletti-it/atnkrj2nyx?form_factor=mobile

Screenshot_20240504_105635

Enabling delayed hydration

https://pagespeed.web.dev/analysis/https-staging--stefanobartoletti-netlify-app/6mflps2zab?form_factor=mobile

Screenshot_20240504_105942

The "loader" cover was added both to enable loading resources like fonts without having a noticeable "Flash of unstyled content", but also for purely UI and aesthetical considerations (so it is there because I like it to be there :D ).

The huge improvements in PSI is mostly caused by the cover itself, because the scripts that control its behavior (including its discarding after the site has loaded and slight timeout) are not fired unless a user is performing any action like simply hovering the mouse in the window. In turn this is also preventing Google to consider some animations that are moving elements by design, like "Cumulative Layout Shift"

This is perfect, but I only have a doubt: can this be detrimental to Google indexing the content of my site? If the bot is not triggering the scripts that discard the cover in a reasonable time, will the content be correctly accessed and indexed?

sauravbv commented 1 month ago

@stefanobartoletti As long as your meta tags, links in your SSR HTML is present, there should be no problem for SEO. Also really cool site :)

harlan-zw commented 1 month ago

Hey, sorry I missed this one.

I don't have much experience around SEO for these type of banners, however, I would suggest hydrating asap is probably a good idea if you want to ensure the content has the best chance of getting indexed correctly.

Google crawler will execute js but not sure how long it will wait around for that js to execute after the idle time. So I don't think it's worth "tricking" lighthouse for a higher score in this instance.