GROQ query: String interpolation vs parameterized queries in Sanity client

Definitely use option 2 with parameters ($id). It's the recommended best practice for several important reasons:

// ✅ Recommended approach
const id = 'my-id'
client.fetch('*[_id == $id]', {id})

// ❌ Avoid this
const id = 'my-id'
client.fetch(`*[_id == '${id}']`)

Why Parameters Are Better

Security: Parameters prevent GROQ injection attacks. Since parameters are JSON literals, they can't contain GROQ expressions that could alter your query structure. With string interpolation, if a user-supplied value contains special characters or GROQ syntax, it could potentially break or manipulate your query.

Automatic Escaping: The Sanity client automatically handles proper escaping of parameter values. If your id contains quotes or other special characters, you don't have to worry about syntax errors. String interpolation requires you to manually handle this.

Caching: Parameterized queries can be more effectively cached since the query structure remains constant while only the values change. This can improve performance in some scenarios.

Maintainability: Parameters make your code cleaner and easier to read, especially with complex queries or multiple dynamic values:

client.fetch(
  `*[_type == $type && publishedAt > $date && author._ref == $authorId]`,
  { type: 'post', date: '2024-01-01', authorId: 'abc123' }
)

This is much clearer than trying to interpolate multiple variables with template literals.

Type Safety

Parameters maintain their data types automatically. You can pass strings, numbers, booleans, arrays, or objects, and they'll be handled correctly without manual type conversion.

The GROQ parameters documentation covers all of this in detail, and it's the approach you'll see throughout Sanity's official examples and guides.