๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

useCallback

๋ฆฌ์•กํŠธ์˜ ๋ Œ๋”๋ง ์ˆœ์„œ์™€ ๋ Œ๋”๋ง ์ตœ์ ํ™”ํ•˜๋Š” ๋ฒ• (memoization์„ ํ†ตํ•ด ๋ถˆํ•„์š”ํ•œ ๋ฆฌ๋ Œ๋”๋ง ํ•ด๊ฒฐํ•˜๊ธฐ!)
Computer Programming/React 2023. 5. 20. ๋ฆฌ์•กํŠธ์˜ ๋ Œ๋”๋ง ์ˆœ์„œ์™€ ๋ Œ๋”๋ง ์ตœ์ ํ™”ํ•˜๋Š” ๋ฒ• (memoization์„ ํ†ตํ•ด ๋ถˆํ•„์š”ํ•œ ๋ฆฌ๋ Œ๋”๋ง ํ•ด๊ฒฐํ•˜๊ธฐ!) 1. ๋ฆฌ์•กํŠธ ๋ Œ๋”๋ง์˜ ์ˆœ์„œ ์•„๋ž˜ ์ฝ”๋“œ์—์„œ 4๊ฐ€์ง€ console.log() ๋ฌธ์ด ์–ด๋–ป๊ฒŒ ์ถœ๋ ฅ๋ ์ง€ ์˜ˆ์ƒํ•ด๋ณด์ž. import React, { useState } from 'react'; import Login from './components/Login/Login'; import Home from './components/Home/Home'; import MainHeader from './components/MainHeader/MainHeader'; import { useEffect } from 'react'; function App() { const [isLoggedIn, setIsLoggedIn] = useState(false); console.log("in function") useEffect(() =>..

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”

*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*
*