๋กœ๋”ฉ์†๋„๊ฐœ์„ 

CSR์˜ ๋Œ€ํ‘œ์ ์ธ ์ดˆ๊ธฐ ๋กœ๋”ฉ์†๋„๋ฅผ ๊ฐœ์„ ํ•˜๊ธฐ ์œ„ํ•œ ์ž‘์—…๋“ค์„ ์ˆ˜ํ–‰ํ•ด๋ณด์•˜๋‹ค. 1. React.lazy์™€ Suspense ์ ์šฉํ•˜๊ธฐ SPA์˜ ๋Œ€ํ‘œ์ ์ธ ๋‹จ์ ์œผ๋กœ, ์ตœ์ดˆ ๋กœ๋“œ์‹œ ํ•„์š”ํ•˜์ง€ ์•Š์„ ์ˆ˜ ์žˆ๋Š” ๋ชจ๋“  ํŒŒ์ผ์„ ๋‹ค์šด๋ฐ›๊ธฐ ๋•Œ๋ฌธ์—, ์ดˆ๊ธฐ ๋กœ๋”ฉ์†๋„๊ฐ€ ๊ธธ์–ด์ง„๋‹ค๋Š” ์ ์ด ์žˆ๋‹ค. ์ด๋ฅผ ๊ฐœ์„ ํ•˜๊ธฐ ์œ„ํ•œ ๋Œ€ํ‘œ์ ์ธ ํ•ด๊ฒฐ๋ฐฉ๋ฒ•์ค‘ ํ•˜๋‚˜๊ฐ€ lazy Loading์ด๋‹ค. ๋™์  load  ํ•ด๋‹น ๋ชจ๋“ˆ์ด ํ•„์š”ํ•  ๋•Œ๋งŒ ๋กœ๋“œ → ์ฝ”๋“œ ์Šคํ”Œ๋ฆฌํŒ…(code splitting)๊ณผ ์ง€์—ฐ ๋กœ๋”ฉ(lazy loading)์„ ๊ฐ€๋Šฅ → ์‚ฌ์šฉ์ž๊ฐ€ ํŠน์ • ํŽ˜์ด์ง€๋‚˜ ๊ธฐ๋Šฅ์— ์ ‘๊ทผํ•  ๋•Œ ํ•„์š”ํ•œ ๋ฆฌ์†Œ์Šค๋งŒ ๋‹ค์šด๋กœ๋“œ๋ฉ๋ƒฅ์ƒํ™œ ์„œ๋น„์Šค์˜ ๋ผ์šฐํŠธ๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์ •์˜๋˜์–ด ์žˆ๋‹ค.const PATHS = { main: "/main", logIn: "/", signUp: "/signup", f..
Yuuuki
'๋กœ๋”ฉ์†๋„๊ฐœ์„ ' ํƒœ๊ทธ์˜ ๊ธ€ ๋ชฉ๋ก