vercel-react-best-practices

From install to first use

1. Install the skill from the Vercel source and confirm it is available in your client. Read the project instructions before running a review.
2. Limit the first review to one flow: page load, a search request or a slow interaction. Request the affected files and explain whether requests are independent.
3. Review each suggested change, run relevant checks and compare results under the same conditions. Keep changes only when the behavior remains correct.

How to check the result

Use your application's network timeline or profiler to inspect the specific issue. Record the environment and test conditions. Faster-looking code or fewer lines is not evidence of a faster application.

Independent-request example

// Two alternatives; the requests must be independent.
async function loadSequential() {
  const profile = await fetchProfile();
  const projects = await fetchProjects();
  return { profile, projects };
}

async function loadConcurrent() {
  const [profile, projects] = await Promise.all([
    fetchProfile(),
    fetchProjects(),
  ]);
  return { profile, projects };
}

Keep learning