Sanity Studio v3.57.0: Performance improvements in development mode and enhanced document validation in CLI

✨ Highlights

Significant rendering perf. improvements (up to x10) in dev mode

This change enables styled-components "speedy mode" in sanity dev, improving developer mode performance. This change impacts only development builds (sanity dev) – production builds (sanity build or sanity start) remain unaffected since "speedy mode" has always been enabled in production.

Developers embedding Sanity Studio in other frameworks like Next.js or Remix need to adjust their own build tooling to declare the SC_DISABLE_SPEEDY flag to achieve the same performance benefits. For example, Next.js users can add this snippet to their next.config.{js,mjs,ts} file:

export default {
env: {
SC_DISABLE_SPEEDY: 'false' // makes styled-components as fast in dev mode as it is in production mode
}
}

For Safari users, while they will still be able to inspect and see CSS rules coming from styled-components, these will now be read-only in the DevTools inspector. The performance benefits from enabling "speedy mode" in development mode are significant for Safari users and outweigh the convenience of being able to edit these rules directly in the inspector. With Hot Module Reload, developers can still quickly make changes to their source code, and the new styles will apply immediately.

Enabling "speedy mode" offers a faster development experience across the board. Developers using Safari for testing purposes can still verify the functionality of the studio, and for more detailed CSS editing, they can switch to Chrome, Firefox, or other Chromium-based browsers like Arc or Brave.

It's still possible to restore the old behaviour of disabling speedy in dev mode in userland with a custom sanity.cli.ts override:

import {defineCliConfig} from 'sanity/cli'
import {type UserConfig} from 'vite'

export default defineCliConfig({
vite(viteConfig: UserConfig): UserConfig {
return {
...viteConfig,
define: {
...viteConfig.define,
// `sanity dev` enables speedy in both development and production,
// this line restores the default `styled-components` behaviour of only enabling it in production
'process.env.SC_DISABLE_SPEEDY': JSON.stringify(process.env.NODE_ENV !== 'production'),
},
}
},
})

add --max-fetch-concurrency to prevent stalled validators

This update addresses an issue where the sanity documents validate CLI command could time out when validating documents with complex custom validation rules. The changes include:

Increased default maximum fetch concurrency from 10 to 25, which should resolve most timeout issues.

Added a new CLI flag --max-fetch-concurrency to allow users to adjust the maximum number of concurrent client.fetch requests during validation.

Made the default maximum custom validation concurrency explicit and configurable.

Usage:

sanity documents validate --max-fetch-concurrency <number>

These changes should improve the performance and reliability of document validation for projects with complex custom validation rules. Users experiencing timeouts during validation should try increasing the --max-fetch-concurrency value if issues persist with the new default.

Install or upgrade Sanity Studio

To initiate a new Sanity Studio project or upgrade an existing one, please refer to our comprehensive guide on Installing and Upgrading Sanity Studio.

If you are updating from a version earlier than 3.37.0, you should also check out this article to ensure your dependencies are up to date.