fix!: make useCdn use true by default (#191)

BREAKING CHANGE: if you want to keep the previous behaviour add `useCdn: false` to your configuration.

Co-authored-by: Rune Botten <rbotten@gmail.com>

.github/workflows/deno.yml

@@ -38,4 +38,3 @@ jobs:
           labels: 🤖 bot
           title: 'chore(deno): update import_map.json'
           token: ${{ steps.generate-token.outputs.token }}
-

README.md

@@ -26,7 +26,7 @@ import {createClient} from '@sanity/client'
 export const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
   // token: process.env.SANITY_SECRET_TOKEN // Only if you want to update content with the client
 })
@@ -93,7 +93,9 @@ export async function updateDocumentTitle(_id, title) {
   - [Set client configuration](#set-client-configuration)
 - [Release new version](#release-new-version)
 - [License](#license)
-- [From `v4`](#from-v4)
+- [Migrate](#migrate)
+  - [From `v5`](#from-v5)
+  - [From `v4`](#from-v4)
 
 ## Requirements
 
@@ -119,7 +121,7 @@ pnpm install @sanity/client
 
 `const client = createClient(options)`
 
-Initializes a new Sanity Client. Required options are `projectId`, `dataset`, and `apiVersion`. Setting a value for `useCdn` is encouraged. Typically you want to have it as `false` in development to always fetch the freshest content and `true` in production environments so that content is fetched from the distributed cache. [You can learn more about the API CDN here][api-cdn].
+Initializes a new Sanity Client. Required options are `projectId`, `dataset`, and `apiVersion`. [We encourage setting `useCdn` to either `true` or `false`.](https://www.sanity.io/help/js-client-cdn-configuration) The default is `true`. If you're not sure which option to choose we recommend starting with `true` and revise later if you find that you require uncached content. [Our awesome Slack community can help guide you on how to avoid stale data tailored to your tech stack and architecture.](https://slack.sanity.io/)
 
 #### [ESM](https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/)
 
@@ -129,7 +131,7 @@ import {createClient} from '@sanity/client'
 const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 })
 
@@ -145,7 +147,7 @@ const {createClient} = require('@sanity/client')
 const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 })
 
@@ -163,7 +165,7 @@ import {createClient, type ClientConfig} from '@sanity/client'
 const config: ClientConfig = {
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 }
 const client = createClient(config)
@@ -183,7 +185,7 @@ import {z} from 'zod'
 const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 })
 
@@ -210,7 +212,7 @@ import {createClient} from '@sanity/client'
 const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 })
 
@@ -238,7 +240,7 @@ import {createClient} from 'https://esm.sh/@sanity/client'
 const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 })
 
@@ -271,7 +273,7 @@ export default async function handler(req: NextRequest) {
   const client = createClient({
     projectId: 'your-project-id',
     dataset: 'your-dataset-name',
-    useCdn: false, // set to `true` to fetch from edge cache
+    useCdn: true, // set to `false` to bypass the edge cache
     apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
   })
 
@@ -302,7 +304,7 @@ Using [esm.sh] you can either load the client using a `<script type="module">` t
   const client = createClient({
     projectId: 'your-project-id',
     dataset: 'your-dataset-name',
-    useCdn: false, // set to `true` to fetch from edge cache
+    useCdn: true, // set to `false` to bypass the edge cache
     apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
   })
 
@@ -321,7 +323,7 @@ const {createClient} = await import('https://esm.sh/@sanity/client')
 const client = createClient({
   projectId: 'your-project-id',
   dataset: 'your-dataset-name',
-  useCdn: false, // set to `true` to fetch from edge cache
+  useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
 })
 
@@ -343,7 +345,7 @@ Loading the UMD script creates a `SanityClient` global that have the same export
   const client = createClient({
     projectId: 'your-project-id',
     dataset: 'your-dataset-name',
-    useCdn: false, // set to `true` to fetch from edge cache
+    useCdn: true, // set to `false` to bypass the edge cache
     apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
   })
 
@@ -364,7 +366,7 @@ The `require-unpkg` library lets you consume `npm` packages from `unpkg.com` sim
     const client = createClient({
       projectId: 'your-project-id',
       dataset: 'your-dataset-name',
-      useCdn: false, // set to `true` to fetch from edge cache
+      useCdn: true, // set to `false` to bypass the edge cache
       apiVersion: '2022-01-12', // use current date (YYYY-MM-DD) to target the latest API version
     })
 
@@ -924,6 +926,23 @@ MIT © [Sanity.io](https://www.sanity.io/)
 
 # Migrate
 
+## From `v5`
+
+### The default `useCdn` is changed to `true`
+
+It was previously `false`. If you were relying on the default being `false` you can continue using the live API by setting it in the constructor:
+
+```diff
+import {createClient} from '@sanity/client'
+
+export const client = createClient({
+  projectId: 'your-project-id',
+  dataset: 'your-dataset-name',
+  apiVersion: '2023-03-12',
++ useCdn: false, // set to `true` to use the edge cache
+})
+```
+
 ## From `v4`
 
 ### No longer shipping `ES5`

src/config.ts

@@ -75,7 +75,8 @@ export const initConfig = (
 
   newConfig.apiVersion = `${newConfig.apiVersion}`.replace(/^v/, '')
   newConfig.isDefaultApi = newConfig.apiHost === defaultConfig.apiHost
-  newConfig.useCdn = Boolean(newConfig.useCdn) && !newConfig.withCredentials
+  // If `useCdn` is undefined, we treat it as `true`
+  newConfig.useCdn = newConfig.useCdn !== false && !newConfig.withCredentials
 
   validateApiVersion(newConfig.apiVersion)
 

src/types.ts

@@ -31,6 +31,7 @@ export interface RequestOptions {
 export interface ClientConfig {
   projectId?: string
   dataset?: string
+  /** @defaultValue true */
   useCdn?: boolean
   token?: string
   apiHost?: string

src/warnings.ts

@@ -7,10 +7,9 @@ const createWarningPrinter = (message: string[]) =>
   once((...args: Any[]) => console.warn(message.join(' '), ...args))
 
 export const printCdnWarning = createWarningPrinter([
-  'You are not using the Sanity CDN. That means your data is always fresh, but the CDN is faster and',
-  `cheaper. Think about it! For more info, see ${generateHelpUrl('js-client-cdn-configuration')} `,
-  'To hide this warning, please set the `useCdn` option to either `true` or `false` when creating',
-  'the client.',
+  `Since you haven't set a value for \`useCdn\`, we will deliver content using our`,
+  `global, edge-cached API-CDN. If you wish to have content delivered faster, set`,
+  `\`useCdn: false\` to use the Live API. Note: You may incur higher costs using the live API.`,
 ])
 
 export const printBrowserTokenWarning = createWarningPrinter([
@@ -26,5 +25,5 @@ export const printNoApiVersionSpecifiedWarning = createWarningPrinter([
 ])
 
 export const printNoDefaultExport = createWarningPrinter([
-  'The default export of @sanity/client has been deprecated. Use the named export `createClient` instead',
+  'The default export of @sanity/client has been deprecated. Use the named export `createClient` instead.',
 ])

test/client.test.ts

@@ -2235,21 +2235,21 @@ describe('client', async () => {
   })
 
   describe.skipIf(isEdge)('CDN API USAGE', () => {
-    test('will use live API by default', async () => {
+    test('will use CDN API by default', async () => {
       const client = createClient({projectId: 'abc123', dataset: 'foo'})
 
       const response = {result: []}
-      nock('https://abc123.api.sanity.io').get('/v1/data/query/foo?query=*').reply(200, response)
+      nock('https://abc123.apicdn.sanity.io').get('/v1/data/query/foo?query=*').reply(200, response)
 
       const docs = await client.fetch('*')
       expect(docs.length).toEqual(0)
     })
 
-    test('will use CDN API if told to', async () => {
-      const client = createClient({projectId: 'abc123', dataset: 'foo', useCdn: true})
+    test('will use live API if told to', async () => {
+      const client = createClient({projectId: 'abc123', dataset: 'foo', useCdn: false})
 
       const response = {result: []}
-      nock('https://abc123.apicdn.sanity.io').get('/v1/data/query/foo?query=*').reply(200, response)
+      nock('https://abc123.api.sanity.io').get('/v1/data/query/foo?query=*').reply(200, response)
 
       const docs = await client.fetch('*')
       expect(docs.length).toEqual(0)
@@ -2286,6 +2286,7 @@ describe('client', async () => {
         projectId: 'abc123',
         dataset: 'foo',
         token: 'foo',
+        useCdn: false,
       })
 
       const reqheaders = {foo: 'bar'}

test/warnings.test.ts

@@ -15,7 +15,7 @@ describe('Client config warnings', async () => {
   test('warns if useCdn is not given', () => {
     createClient({projectId: 'abc123', apiVersion: '1'})
     expect(warn).toHaveBeenCalledWith(
-      'You are not using the Sanity CDN. That means your data is always fresh, but the CDN is faster and cheaper. Think about it! For more info, see https://www.sanity.io/help/js-client-cdn-configuration  To hide this warning, please set the `useCdn` option to either `true` or `false` when creating the client.'
+      "Since you haven't set a value for `useCdn`, we will deliver content using our global, edge-cached API-CDN. If you wish to have content delivered faster, set `useCdn: false` to use the Live API. Note: You may incur higher costs using the live API."
     )
   })