✨ Highlights

The sanity and @sanity/vision packages are now precompiled with the React Compiler.

So far, 1,231 out of 1,411 components have been compiled, resulting in a 20%-30% overall reduction in render time and latency. We anticipate even greater improvements as we refactor the remaining 180 components to support auto-memoization.

For several weeks, we’ve already been shipping key packages—including our design system (@sanity/ui), the PortableText editor (@portabletext/editor), and react-rx (responsible for state management across Sanity Studio)—precompiled with the React Compiler.

We continue to see impressive results in our profiling and analysis, and with the release of React Compiler in beta we are excited to add support for auto-memoizing your own studio code:

# install using npm
npm install --save-exact react-compiler-runtime@beta && npm install --save-exact --save-dev babel-plugin-react-compiler@beta eslint-plugin-react-compiler@beta

# install using yarn
yarn add react-compiler-runtime@beta && yarn add --save-dev babel-plugin-react-compiler@beta eslint-plugin-react-compiler@beta

# install using pnpm
pnpm add react-compiler-runtime@beta && pnpm add --save-dev babel-plugin-react-compiler@beta eslint-plugin-react-compiler@beta

And in your sanity.cli.ts add:

import {defineCliConfig} from 'sanity/cli'

export default defineCliConfig({
   api: {
      projectId: 'abc123',
      dataset: 'production',
   },
   reactStrictMode: true,
+  reactCompiler: {target: '18'},
})

If you decide to give the React Compiler a try make sure you share your feedback and experience using it with the Working Group!

Sanity plugin authors, provided they're using @sanity/pkg-utils, can also ship pre-compiled plugins by running:

# install using npm
npm install --save-exact react-compiler-runtime@beta && npm install --save-exact --save-dev @sanity/pkg-utils@latest babel-plugin-react-compiler@beta eslint-plugin-react-compiler@beta

# install using yarn
yarn add react-compiler-runtime@beta && yarn add --save-dev @sanity/pkg-utils@latest babel-plugin-react-compiler@beta eslint-plugin-react-compiler@beta

# install using pnpm
pnpm add react-compiler-runtime@beta && pnpm add --save-dev @sanity/pkg-utils@latest babel-plugin-react-compiler@beta eslint-plugin-react-compiler@beta

and changing the package.config.ts to:

import {defineConfig} from '@sanity/pkg-utils'

export default defineConfig({
   // ...
+  babel: {reactCompiler: true},
+  reactCompilerOptions: {target: '18'},
})

The history inspector UI has been updated to display edits collapsed into the Published event they belong to. From and To revision selectors are added to the top of the inspector.

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.