\section{Mellékhatások}

\begin{frame}{Mi az a mellékhatás (side effect)?}
  \begin{block}{Definí­ció}
    Mellékhatásnak nevezzük mindazt, ami a komponens \textbf{renderelésén kívül} történik: hálózati kérés, DOM-módosítás, timer beállítása, eseménykezelő regisztrálása.
  \end{block}
  \vspace{0.5em}
  \begin{itemize}
    \item A renderelési fázisban ilyen műveletek nem végzhetők --- a React elvárja, hogy a renderelés \textbf{tiszta} (mellékhatásmentes) legyen.
    \item A \texttt{useEffect} hook nyújtja a lehetőséget arra, hogy e műveleteket \emph{renderelés után} hajtsuk végreh.
  \end{itemize}
\end{frame}

\begin{frame}{\texttt{useEffect} --- mikor és hányszor fut le?}
  \begin{itemize}
    \item \textbf{Függőségi történk:} minden egyes renderelés után lefut --- általában nem ezt akarjuk.
    \item \textbf{Üres történk (\texttt{[]}):} csak az első megjelenítéskor fut le egyszer --- pl. induló adatlekéréshez.
    \item \textbf{Értékekkel (\texttt{[id, szuro]}):} amikor a felsorolt értékek bármelyike megváltozik, újra lefut.
  \end{itemize}
  \vspace{0.4em}
  A függőségi történk tehát azt szabályozza, \textbf{mikor} akarjuk az effektet ismét futtatni.
\end{frame}

\begin{frame}{Cleanup --- takarítás az effect után}
  \begin{block}{Miért kell cleanup?}
    Ha egy komponens eltűnik az oldalról (pl. navigáció közben), az esetlegesen elindított timerek, eseményfigyelők tovább futnak, memóriaszivárgást okozva. A cleanup függvény ezt akadályozza meg.
  \end{block}
  \vspace{0.5em}
  \begin{itemize}
    \item Az effect \textbf{visszaadhat egy cleanup függvényt}: ez fut le a komponens unmountjakor, illetve az effect következő lefutása előtt.
    \item Tipikus eset: \texttt{clearInterval}, \texttt{removeEventListener}, API kérés megszakítása (\texttt{AbortController}).
  \end{itemize}
\end{frame}

\begin{frame}{Leggyakoribb hibák \texttt{useEffect}-tel}
  \begin{alertblock}{Figyelem}
    \begin{itemize}
      \item \textbf{Hiányzó dependency:} ha egy változót használunk de nem szerepel a tömbben, a hook régi értékkel dolgozhat --- ez nehezen felderíthető hiba.
      \item \textbf{Végtelen ciklus:} ha az effect frissít egy állapotot, ami maga is dependency, kör forgás indul.
      \item \textbf{Túl sok logika egy effectben:} egy effect egy felelősséget kezeljen; ha kettőt kezelne, bontsuk szét.
    \end{itemize}
  \end{alertblock}
\end{frame}