Flutter ๐Ÿ”ฅ reload๊ฐ€ ๊ฐ€๋Šฅํ•œ ์ด์œ 

Restl2seungยท2022๋…„ 3์›” 28์ผ
1
post-thumbnail

Hot Reload๋ž€?

ํ”Œ๋Ÿฌํ„ฐ๊ฐ€ ๋‚ด์„ธ์šฐ๋Š” ํฐ ์žฅ์ ์ค‘ ํ•˜๋‚˜์ด๋‹ค.
์ด ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•˜๋ฉด ์ฝ”๋“œ๋ฅผ ์ˆ˜์ •ํ–ˆ์„๋•Œ ์ฆ‰๊ฐ์ ์œผ๋กœ ๋ณ€๊ฒฝ ์‚ฌํ•ญ๋“ค์„ ์•ฑ์— ์ ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ ์ด๋•Œ ๋งค์šฐ ๋น ๋ฅธ ์†๋„๋กœ ์ ์šฉ๋˜๊ธฐ ๋•Œ๋ฌธ์— ๊ฐœ๋ฐœํ• ๋•Œ ์•„์ฃผ ํŽธํ•˜๊ณ  ํšจ์œจ์ ์ด๋‹ค.
ํ•œ๋ฒˆ ๋ง›๋ณด๋ฉด Hot reload๊ฐ€ ๋˜์ง€ ์•Š๋Š” ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์—์„œ๋Š” ๋งค์šฐ ๋ถˆํŽธํ•ด์ง„๋‹ค... ์Šคํ”„๋ง...

Hot Reload์˜ ์ž‘๋™์›๋ฆฌ

hot reload๊ฐ€ ์‹คํ–‰๋˜๋ฉด ํ˜„์žฌ ์‹คํ–‰๋˜๊ณ  ์žˆ๋Š” Dart ๊ฐ€์ƒ๋จธ์‹ (VM)์— ๋ณ€๊ฒฝ๋œ ์†Œ์Šค๋ฅผ ์ „๋‹ฌํ•œ๋‹ค. ๊ทธ๋Ÿฌ๋ฉด ๊ฐ€์ƒ๋จธ์‹ ์€ ์ƒˆ๋กœ์šด ๋ฒ„์ „์˜ ํ•„๋“œ ๋ฐ ํ•จ์ˆ˜๋กœ ํด๋ž˜์Šค๋ฅผ ์—…๋ฐ์ดํŠธํ•œ ํ›„ ์œ„์ ฏํŠธ๋ฆฌ๋ฅผ ์žฌ๋นŒ๋“œํ•œ๋‹ค. ์ด๋•Œ state๋ฅผ ์œ ์ง€ํ•˜๋ฉฐ main() ์ด๋‚˜ initState๋Š” ๋‹ค์‹œ ์‹คํ–‰๋˜์ง€ ์•Š๋Š”๋‹ค.
๊ทธ ์ด์œ ๋Š” hot reload ๊ณผ์ •์—์„œ๋Š” state ๊ฐ์ฒด๋ฅผ ์ƒˆ๋กœ ์ƒ์„ฑํ•˜์ง€ ์•Š๊ณ  ์›จ์ ฏ๋งŒ ๋ฆฌ๋นŒ๋“œํ•˜๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค.

Hot Reload๊ฐ€ ๊ฐ€๋Šฅํ•œ ์ด์œ 

๋จผ์ € ํ”Œ๋Ÿฌํ„ฐ๋Š” ๋””๋ฒ„๊ทธ ๋ชจ๋“œ์—์„œ hot reload๊ฐ€ ๊ฐ€๋Šฅํ•˜๊ณ  ๋ฆด๋ฆฌ์ฆˆ๋ชจ๋“œ์—์„œ๋Š” ๋ถˆ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.
๊ทธ ์ด์œ ๋Š” ๋‹คํŠธ ์ปดํŒŒ์ผ์— ์žˆ์Šต๋‹ˆ๋‹ค.
๋‹คํŠธ๋Š” dart2native๋ผ๋Š” ์ปดํŒŒ์ผ๋Ÿฌ๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค.
dart2native๋Š” AOT(Ahead-of-time) ๋ฐฉ์‹๊ณผ JIT(Just-In-Time) ๋ฐฉ์‹์ด ์žˆ๋Š”๋ฐ ์ƒํ™ฉ์— ๋”ฐ๋ผ์„œ ๋‹ค๋ฅธ ๋ฐฉ์‹์œผ๋กœ ์ปดํŒŒ์ผ์„ ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค.
๋””๋ฒ„๊ทธ ๋ชจ๋“œ์—์„œ๋Š” JIT, ๋ฆด๋ฆฌ์ฆˆ ๋ชจ๋“œ์—์„œ๋Š” AOT
์ด๋•Œ Hot reload๋Š” JIT ๋ฐฉ์‹์œผ๋กœ ์ปดํŒŒ์ผ ํ•˜๊ธฐ๋•Œ๋ฌธ์— ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.

JIT์™€ AOT์˜ ์ฐจ์ด

JIT์™€ AOT์˜ ๊ฐ€์žฅํฐ ์ฐจ์ด๋Š” ์ปดํŒŒ์ผ์„ ํ•˜๋Š” ์‹œ์ ์ž…๋‹ˆ๋‹ค.
JIT๋Š” ๋Ÿฐํƒ€์ž„ํ™˜๊ฒฝ์—์„œ ์ฝ”๋“œ๊ฐ€ ํ•„์š”ํ• ๋•Œ, ํ•„์š”ํ•œ ๋งŒํผ๋งŒ ์ปดํŒŒ์ผํ•ฉ๋‹ˆ๋‹ค. ๋‹ค์‹œ ๋งํ•ด ํ”„๋กœ๊ทธ๋žจ์ด ์‹คํ–‰ํ•˜๋Š” ๋„์ค‘์— ์ปดํŒŒ์ผ์„ ์ง„ํ–‰ํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค.
์ด ๋ฐฉ์‹์€ ๋น ๋ฅธ ๊ฐœ๋ฐœ ์†๋„๋ฅผ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ์™œ๋ƒ๋ฉด ํ•„์š”ํ•œ ๋ถ€๋ถ„๋งŒ, ํ™•์ธํ•˜๊ณ  ์‹ถ์€ ๋ถ€๋ถ„๋งŒ ์ปดํŒŒ์ผ ํ•˜๊ธฐ๋•Œ๋ฌธ์ด์ฃ ! ํ•˜์ง€๋งŒ ํ”„๋กœ๊ทธ๋žจ ๋‚ด์—์„œ ์ปดํŒŒ์ผ์ด ํ•„์š”ํ•œ ๋ถ€๋ถ„์„ ๋ฐฉ๋ฌธํ• ๋•Œ๋งˆ๋‹ค ์ปดํŒŒ์ผ์„ ํ•ด์ค˜์•ผํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์‹คํ–‰ ์†๋„๊ฐ€ ๋Š๋ฆฝ๋‹ˆ๋‹ค.
๋ฐ˜๋ฉด AOT๋Š” ํ”„๋กœ๊ทธ๋žจ์„ ์‹คํ–‰ํ•˜๊ธฐ ์ „์— ์ปดํŒŒ์ผํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. ์ด ๋ฐฉ์‹์€ ์‹คํ–‰ํ•˜๊ธฐ๊นŒ์ง€ ์‹œ๊ฐ„์ด ์˜ค๋ž˜ ๊ฑธ๋ฆฌ์ง€๋งŒ ์‹คํ–‰์ค‘์—๋Š” JIT๋ณด๋‹ค ๋‚˜์€ ํผํฌ๋จผ์Šค๋ฅผ ๋ณด์ด์ฃ ! ์™œ๋ƒํ•˜๋ฉด ์ด๋ฏธ ์ปดํŒŒ์ผ์„ ์™„๋ฃŒํ–ˆ๊ธฐ ๋•Œ๋ฌธ์ด์ฃ !

๊ทธ๋ž˜์„œ ํ”Œ๋Ÿฌํ„ฐ๋Š”?

๋””๋ฒ„๊ทธ ๋ชจ๋“œ์—์„œ๋Š” ๋น ๋ฅธ ์‹คํ–‰ ์†๋„์™€ Hot reload ๊ธฐ๋Šฅ์„ ์œ„ํ•ด JIT ๋ฐฉ์‹๋ฅผ ์‚ฌ์šฉํ•˜๊ณ 
๋ฆด๋ฆฌ์ฆˆ ๋ชจ๋“œ์—์„œ๋Š” ๋ณด์žฅ๋œ ์•ˆ์ •์„ฑ(๋ฏธ๋ฆฌ ์ปดํŒŒ์ผ์„ ํ•˜๊ธฐ๋•Œ๋ฌธ)๊ณผ ๋” ๋น ๋ฅธ ํผํฌ๋จผ์Šค๋ฅผ ์œ„ํ•ด AOT ๋ฐฉ์‹์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.

0๊ฐœ์˜ ๋Œ“๊ธ€