์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 

์‹œ๊ฐ„์˜ ๋งˆ๋ฒ•์‚ฌ RxJS - setTimeout ์€ No! ๋ชจ๋“  ๋น„๋™๊ธฐ ์ž‘์—…๋“ค์„ ํ•œ๋ฐฉ์— ํ•ด๊ฒฐํ•˜์ž

Javascript๋ฅผ ๋น„๋กฏํ•œ ๋งŽ์€ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด์—์„œ ๋น„๋™๊ธฐ์ž‘์—…์€ ๊ฐ€์žฅ ๊นŒ๋‹ค๋กญ๊ณ  ์†Œํ”„ํŠธ์›จ์–ด์˜ ๋ณต์žก๋„๋ฅผ ์˜ฌ๋ฆฌ๋Š” ์š”์†Œ ์ค‘ ํ•˜๋‚˜์ž…๋‹ˆ๋‹ค. setTimeout, setInterval ๊ณผ ๊ฐ™์€ ์›์‹œ์ ์ธ ๋น„๋™๊ธฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ์€ ๋ฒ„๋ฆฌ๊ณ  RxJS ๋ฅผ ํ†ตํ•ด ๋ณต์žกํ–ˆ๋˜ ๋น„๋™๊ธฐ์ž‘์—…๋“ค์„ ์†์‰ฝ๊ฒŒ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Thumbnail

์ดˆ๊ธ‰์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[ํ’€์Šคํƒ, ๊ฐœ๋ฐœ ยท ํ”„๋กœ๊ทธ๋ž˜๋ฐ] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๊ฑธ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์–ด์š”

  • "3๋ถ„์— ํ•œ๋ฒˆ์”ฉ ์ฃผ์‹ ๊ฑฐ๋ž˜์†Œ์™€ ๊ฑฐ๋ž˜๋ฅผ ์‹œ์ž‘ํ•˜๋˜ ๊ฑฐ๋ž˜๋ฅผ ํ• ๋•Œ๋งˆ๋‹ค 1000๋ฒˆ์˜ API ์ฝœ์„ 100๋ฒˆ์”ฉ ๋น„๋™๊ธฐ์ ์œผ๋กœ 1์ดˆ์— ํ•œ๋ฒˆ์”ฉ API ์ฝœ์„ ํ•˜๊ณ ์‹ถ์–ด" ์™€ ๊ฐ™์€ ๋ณต์žกํ•œ ๋น„๋™๊ธฐ ์ž‘์—…์„ ํ•œ์ค„์˜ ์ฝ”๋“œ๋กœ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • ์‹œ๊ฐ„์„ ๋„˜๋‚˜๋“œ๋Š” ์•„๋ฌด๋ฆฌ ๋ณต์žกํ•œ ๋น„๋™๊ธฐ ์ž‘์—…์„ ๊น”๋”ํ•˜๊ฒŒ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๋Š” ์Šคํ‚ฌ์„ ๋ฐฐ์šฐ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

  • Javascript์˜ Observable์„ ์ดํ•ดํ•˜๊ณ  Javascript์—์„œ ์–ด๋–ค ์‹์œผ๋กœ ๋น„๋™๊ธฐ ์ž‘์—…์ด ์ฒ˜๋ฆฌ๋˜๋Š”์ง€ ์•Œ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋น„๋™๊ธฐ ์ž‘์—…์„ ๋”์šฑ ์‰ฝ๊ณ  ๋น ๋ฅด๊ฒŒ!
์‹œ๊ฐ„์˜ ๋งˆ๋ฒ•์‚ฌ, RxJS๋กœ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•ด๋ณด์„ธ์š”.

ํ‰์†Œ์— ์—ฌ๋Ÿฌ๊ฐ€์ง€ ์ข…๋ฅ˜์˜ ๋น„๋™๊ธฐ ํ”„๋กœ๊ทธ๋ž˜๋ฐ์— ์ง€์นœ ๋งŽ์€ ๋ถ„๋“ค์„ ์œ„ํ•œ ๊ฐ•์ขŒ์ž…๋‹ˆ๋‹ค.

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

์˜ˆ๋ฅผ ๋“ค์–ด ์›นํŽ˜์ด์ง€๋ฅผ ๋งŒ๋“ค ๋•Œ โ€œ์œ ์ €๊ฐ€ ํด๋ฆญ์„ ํ•œ ๋’ค์— 5์ดˆ ๋™์•ˆ 1์ดˆ์— ํ•œ ๋ฒˆ์”ฉ ํ™”๋ฉด์„ ๊นœ๋ฐ•์ด๊ฒŒ ํ•˜๊ณ , 5์ดˆ๊ฐ€ ์ง€๋‚˜๋ฉด ์ƒˆ๋กœ์šด ํŒ์—…์„ ๋„์šฐ์„ธ์š”โ€ ์™€ ๊ฐ™์€ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ ํƒœ์Šคํฌ๋ฅผ ํ•œ๋‹ค๋˜์ง€, ํ˜น์€ โ€œ5ms์— ํ•œ๋ฒˆ์”ฉ API ๋ฅผ ์กฐํšŒํ•˜๋Š” ๊ฒƒ์„ ๊พธ์ค€ํžˆ ํ•˜๋˜ ์š”์ฒญ์ด ์˜ฌ๋•Œ๋งˆ๋‹ค ์š”์ฒญ์˜ ๊ฒฐ๊ณผ๋ฅผ ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค์— ์“ฐ์„ธ์š”โ€ ์™€ ๊ฐ™์ด ๋ฐ์ดํ„ฐ ์ˆ˜์ง‘์— ์žˆ์–ด์„œ ๋น„๋™๊ธฐ์ž‘์—…์„ ํ• ๋•Œ๊ฐ€ ๊ทธ ์˜ˆ์ž…๋‹ˆ๋‹ค.

๋งŽ์€ ๊ฐœ๋ฐœ์ž ๋ถ„๋“ค์ด ์ด๋Ÿฐ ํƒœ์Šคํฌ๋ฅผ ๋งก์„ ๋•Œ๋งˆ๋‹ค ์Šค๋ ˆ๋“œ๋ฅผ ๊ด€๋ฆฌํ•˜๊ณ  time.sleep ์ฒ˜๋Ÿผ ์ปดํ“จํ„ฐ ๋ฆฌ์†Œ์Šค๋ฅผ ๋‚ญ๋น„ํ•˜๋Š” ๋ฐฉ์‹์˜ ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ํ•˜๊ณ  ์žˆ๊ณ , ๋˜ ๋งŽ์€ ๋ถ€๋‹ด๊ฐ์„ ๋Š๋ผ๊ณ  ๊ณ„์‹  ๊ฒƒ ๊ฐ™์•„ ์ด ๊ฐ•์˜๋ฅผ ๋งŒ๋“ญ๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”!

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • ์•„๋ฌด๋ฆฌ ๋ณต์žกํ•œ ๋น„๋™๊ธฐ ์ž‘์—…๋„ ํ•œํ์— ๋๋‚ด๊ณ  ์‹ถ์œผ์‹  ๋ถ„๋“ค

  • time.sleep ํ•จ์ˆ˜๋ฅผ ์“ฐ๋ฉด์„œ ์ด๊ฒƒ์ด ์ตœ์„ ์ธ๊ฐ€ ๊ณ ๋ฏผํ•˜์…จ๋˜ ๊ฐœ๋ฐœ์ž ๋ถ„๋“ค

  • ๋น„๋™๊ธฐ์ž‘์—…์ด ํ•„์š”ํ•  ๋•Œ๋งˆ๋‹ค ๊ธด์žฅํ•˜์…จ๋˜ ๋ถ„๋“ค

  • ํ”„๋กœ๊ทธ๋žจ ์•ˆ์—์„œ ์‹œ๊ฐ„์„ ์ž์œ ๋กญ๊ฒŒ ๊ฐ€์ง€๊ณ  ๋†€๊ณ  ์‹ถ์œผ์‹  ๋ถ„๋“ค

์„ ์ˆ˜ ์ง€์‹,
ํ•„์š”ํ• ๊นŒ์š”?

  • Javascript

์•ˆ๋…•ํ•˜์„ธ์š”
๋‚˜๋ฌด์ž…๋‹ˆ๋‹ค.

155

๋ช…

์ˆ˜๊ฐ•์ƒ

7

๊ฐœ

์ˆ˜๊ฐ•ํ‰

2

๊ฐœ

๋‹ต๋ณ€

4.3

์ 

๊ฐ•์˜ ํ‰์ 

1

๊ฐœ

๊ฐ•์˜

๋ชจ๋ฐ”์ผ ์„œ๋น„์Šค ์Šคํƒ€ํŠธ์—…์„ ์šด์˜ํ•˜๋‹ค ๋ธ”๋ก์ฒด์ธ ๊ธฐ์ˆ ์— ๋งค๋ฃŒ๋˜์–ด ๋ธ”๋ก์ฒด์ธ ์Šคํƒ€ํŠธ์—…๊ณผ ์œ ๋ช… ๊ฐ€์ƒํ™”ํ ๊ฑฐ๋ž˜์†Œ์—์„œ ๋ฐฑ์—”๋“œ ์—”์ง€๋‹ˆ์–ด๋กœ ๊ทผ๋ฌดํ–ˆ์Šต๋‹ˆ๋‹ค.

ํ˜„์žฌ๋Š” ํ‡ด์‚ฌ ํ›„ ์•”ํ˜ธํ™”ํ ๋ฐ ์ฃผ์‹ ํŠธ๋ ˆ์ด๋”ฉ, ๊ฐœ์ธ ์‚ฌ์ด๋“œ ํ”„๋กœ์ ํŠธ ๋“ฑ์œผ๋กœ ์ƒˆ๋กœ์šด ํ”„๋กœ์ ํŠธ๋ฅผ ์ค€๋น„ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

์งง์ง€์•Š์€ ๊ธฐ๊ฐ„ ๊ฐœ๋ฐœ์„ ํ•ด์˜ค๋ฉด์„œ ํ•ญ์ƒ ์ƒˆ๋กœ์šด ๊ธฐ์ˆ ์„ ๋ฐฐ์šฐ๋Š” ๊ฒƒ์„ ์ฆ๊ฒผ๊ณ , ๊ตญ๋‚ด ๊ฐœ๋ฐœ์ž๋“ค ์‚ฌ์ด์—์„œ๋„ ํ•ด์™ธ์˜ ์ตœ์‹  ๊ธฐ์ˆ ์ด ๋น ๋ฅด๊ฒŒ ์ „ํŒŒ๋˜๊ณ  ๊ณต์œ ๋˜๋Š” ๊ฒƒ์„ ์ถ”๊ตฌํ•˜์—ฌ ํ•ญ์ƒ ์ƒˆ๋กญ๊ณ  ์œ ์ตํ•œ ๊ฐœ๋ฐœ ๊ฐ•์˜๋ฅผ ์ œ์ž‘ํ•ด ๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค:)

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

12๊ฐœ โˆ™ (1์‹œ๊ฐ„ 48๋ถ„)

๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์•„์ง ์ถฉ๋ถ„ํ•œ ํ‰๊ฐ€๋ฅผ ๋ฐ›์ง€ ๋ชปํ•œ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.
๋ชจ๋‘์—๊ฒŒ ๋„์›€์ด ๋˜๋Š” ์ˆ˜๊ฐ•ํ‰์˜ ์ฃผ์ธ๊ณต์ด ๋˜์–ด์ฃผ์„ธ์š”!