useEffect Dependency Array

The three effects below are identical except for their second argument, and that one difference decides how often each of them runs.

useEffect(() => {
  console.log("A: no array");
});

useEffect(() => {
  console.log("B: empty array");
}, []);

useEffect(() => {
  console.log("C: depends on userId");
}, [userId]);

Effect A runs after every render. Effect B runs once, after the first render. Effect C runs after the first render and then again after any render in which userId has a new value