Sergio Xalambrí

Article

🔥 Pro Tip: Name your useEffect functions

When creating an effect in React, avoid arrow function and instead use a function with a name. This will

  1. Show the function name in the stack trace of an error
  2. Help you and your team know what this effect does
  3. Force you to only use this effect for one concern
React.useEffect(
  function changeDocumentTitle() {
    const currentTitle = document.title;
    document.title = title;
    return function restoreDocumentTitle() {
      document.title = currentTitle;
    };
  },
  [title]
);

Do you like my content?

Your sponsorship helps me create more tutorials, articles, and open-source tools.

Sponsor me on GitHub