HTML MASTER CLASS /// LEARN TAGS /// BUILD STRUCTURE /// SEMANTIC WEB /// HTML MASTER CLASS /// LEARN TAGS ///

Untitled Lesson

⚡ Total XP: 0|💻 backend XP: 0

Skill Matrix

UNLOCK NODES BY LEARNING NEW TAGS.

Select an unlocked node to view details root

Pascual Vila

Frontend Instructor // Code Syllabus

Common Pitfalls & Errors

The Error //

The N+1 query problem caused by field-level resolvers each hitting the database independently

// Wrong: one query per user, N+1 total
User: { posts: (parent) => db.posts.find({ author: parent.id }) }

// Correct: DataLoader batches all pending IDs into one query
const postLoader = new DataLoader(async (userIds) => {
  const posts = await db.posts.find({ author: { $in: userIds } });
  return userIds.map(id => posts.filter(p => p.author === id));
});
User: { posts: (parent) => postLoader.load(parent.id) }

The Solution //

If a query returns 50 users and each has a User.posts field-level resolver that runs its own db.posts.find({ author: userId }) call, you fire 1 query for the users plus 50 separate queries for their posts — one per user, hence 'N+1'. Batch these with a DataLoader, which collects all requested IDs within a single tick and issues one combined query.

The Error //

Mutations that don't return the updated object, breaking client-side cache updates

// Wrong: client has no way to update its cache
type Mutation { updateUser(id: ID!, name: String!): Boolean }

// Correct: return the updated entity
type Mutation { updateUser(id: ID!, name: String!): User }

The Solution //

A mutation like updateUser that returns just `Boolean` gives Apollo/Relay clients nothing to reconcile against their normalized cache, forcing a full refetch. Always design mutations to return the affected object (or at least its updated fields plus ID) so client caches can update automatically.