Changes in Presentation causes a full page refresh / white flicker

[ragnsan]

If you find a security vulnerability, do NOT open an issue. Email [email protected] instead.

Describe the bug

Making changes in Presentation causes a full refresh / white flicker of the content in the left-hand pane.

To Reproduce

Steps to reproduce the behavior:

Any document viewed in the Presentation pane.

Screenshots
If applicable, add screenshots to help explain your problem.

Which versions of Sanity are you using?

@sanity/cli (global) 3.28.0 (latest: 3.64.0)
@sanity/asset-utils 2.1.0 (up to date)
@sanity/color-input 4.0.1 (up to date)
@sanity/icons 3.4.0 (up to date)
@sanity/image-url 1.1.0 (up to date)
@sanity/preview-url-secret 2.0.3 (up to date)
@sanity/table 1.1.2 (up to date)
@sanity/ui 2.8.23 (up to date)
@sanity/vision 3.64.0 (up to date)
sanity 3.64.0 (up to date)
next-sanity 9.8.12

I was using next-sanity @ 9.8.10 and sanity @ 3.63.0 but I upgraded after seeing a similar issue on the official Sanity repo.

What operating system are you using?

MacOS

Which versions of Node.js / npm are you running?

10.2.4
v20.11.0

[rdunk]

Would you be able to update your studio version to 3.64.1 and check if that fixes the issue for you?

[OignonFugace]

I’m currently using version 3.64.1, and I'm still experiencing the same issue.

[OignonFugace]

After some exploration, I’ve identified the behavior more clearly. I started by running:

rm -rf .next node_modules
npm cache clean --force
npm install
npm run build

Initially, this seemed to fix the issue — there were no full page reloads when making changes in the presentation tool. However, upon publishing a document, the page refreshes, and the issue with refreshes on every modification reappears.

I've found that closing the page, disabling draft mode, and reopening it temporarily resolves the issue, but as soon as I publish a document from the presentation mode, the full page refresh on each change returns.

It seems that any action that triggers a full page refresh once causes it to persist for every subsequent change. Publishing is one example, but even toggling the edit mode (using the switch in the top-left corner) and re-enabling it causes a refresh.

The only way I’ve found to restore the normal behavior is by exiting draft mode completely.

These tests were done using npm run start in Google Chrome.

[geeth24]

having the same issue

[geeth24]

I’m curious if there’s any news on this. It’s been quite frustrating, as it keeps refreshing and making it difficult to use.

[rdunk]

More than happy to take a look at this if someone can provide a minimal reproduction, unfortunately I'm not able to replicate it from the information provided here.

[geeth24]

I was able to resolve the issue by embedding my app layout within a () folder. Leaving the sanity outsided it. This prevents Sanity from refreshing itself unnecessarily.

https://nextjs.org/docs/app/building-your-application/routing/route-groups#organize-routes-without-affecting-the-url-path

[gadcam]

I had flickering issues too.
Adding a group like @geeth24 suggested (thank you :)) enabled me to add back

export const dynamic = 'force-static';

to the studio page and then it was solved.
It looks like the studio does not like if it is not renderer statically.