Empty array with UseEffect

The below useEffect will be called on every render of the component,

import React, { useState, useEffect } from 'react';
 
function MyComponent() {
  const [data, setData] = useState(null);
 
  useEffect(() => {
    // This will run on every render of the component
    fetchData().then(response => setData(response));
  });
 
  return (
    // component render code here
  );
}

The below useEffect will only be called on the component’s initial render as we are using [],

import React, { useState, useEffect } from 'react';
 
function MyComponent() {
  const [data, setData] = useState(null);
 
  useEffect(() => {
    // This will only run on initial render
    fetchData().then(response => setData(response));
  }, []);
 
  return (
    // component render code here
  );
}

---

Refs §

1. https://dev.to/csituma/why-we-use-empty-array-with-useeffect-iok