Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(gatsby): fix hydration flicker on initial render of ssr page for more cases #33196

Merged
merged 1 commit into from
Sep 15, 2021

Conversation

pieh
Copy link
Contributor

@pieh pieh commented Sep 15, 2021

Description

#33134 worked if pagePath matches "normalizedPath". This make sure we store it under normalize key when prewarming pageData cache.

I do think this will cause troubles with matchPath cases, so PR is draft for now until I do discovery on that (I don't want make it worse!) Won't cause problems with matchPath because of requires-writer skipping non-ssg matchPath pages (and tested locally)

[ch38318]

@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Sep 15, 2021
@pieh pieh added topic: render-mode Related to Gatsby's different rendering modes and removed status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer labels Sep 15, 2021
@pieh pieh marked this pull request as ready for review September 15, 2021 18:27
@pieh pieh changed the title fix(gatsby): fix hydration flicker on initial render of ssr page (final this time!) fix(gatsby): fix hydration flicker on initial render of ssr page for more cases Sep 15, 2021
@@ -506,7 +506,7 @@ export class ProdLoader extends BaseLoader {
super(loadComponent, matchPaths)

if (pageData) {
this.pageDataDb.set(pageData.path, {
this.pageDataDb.set(findPath(pageData.path), {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

just for ref - this is how we fill pageData cache -

const pagePath = findPath(rawPath)
if (this.pageDataDb.has(pagePath)) {
const pageData = this.pageDataDb.get(pagePath)
if (process.env.BUILD_STAGE !== `develop` || !pageData.stale) {
return Promise.resolve(pageData)
}
}
return this.fetchPageDataJson({ pagePath }).then(pageData => {
this.pageDataDb.set(pagePath, pageData)
return pageData
and there we use pagePath as key which is result of findPath(rawPath), and prewarming cache should use cache key produced with same method

@pieh pieh merged commit c146750 into master Sep 15, 2021
@pieh pieh deleted the fix-getServerData-flash-again branch September 15, 2021 20:56
pragmaticpat pushed a commit to pragmaticpat/gatsby that referenced this pull request Apr 28, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
topic: render-mode Related to Gatsby's different rendering modes
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants