๋ฐœํ–‰์ผ:

์ˆ˜์ •์ผ:

๋ธ”๋กœ๊ทธ์— ์• ๋“œ์„ผ์Šค ๊ด‘๊ณ ๊ฐ€ ์•ˆ ๋‚˜์˜ฌ ๋•Œ, ์บ์‹œ๊ฐ€ ์›์ธ์ผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค

๋ธ”๋กœ๊ทธ์— Google AdSense(์• ๋“œ์„ผ์Šค) ๊ด‘๊ณ ๋ฅผ ์‚ฝ์ž…ํ•ด ์ˆ˜์ต์„ ๊ธฐ๋Œ€ํ•˜๊ณ  ์žˆ๋Š”๋ฐ, ์–ด๋А ๋‚ ๋ถ€ํ„ฐ ๊ด‘๊ณ ๊ฐ€ ๊ฐ„ํ—์ ์œผ๋กœ ๋ณด์ด์ง€ ์•Š๊ฑฐ๋‚˜ ์•„์˜ˆ ๋…ธ์ถœ๋˜์ง€ ์•Š๋Š” ํ˜„์ƒ์— ๋Œ€ํ•œ ๋งˆ์ง€๋ง‰ ๊ธ€์ž…๋‹ˆ๋‹ค.๊ด‘๊ณ  ์ฝ”๋“œ์—๋Š” ๋ฌธ์ œ๊ฐ€ ์—†๊ณ , ์Šน์ธ๋„ ์ •์ƒ์ธ๋ฐ ์ด์œ  ์—†์ด ๊ด‘๊ณ ๊ฐ€ ์‚ฌ๋ผ์ง„๋‹ค๋ฉด, ๊ทธ ๋ฐฐํ›„์—๋Š” ์บ์‹œ(Cache)๋ฌธ์ œ๊ฐ€ ์ˆจ์–ด ์žˆ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

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

๊ด‘๊ณ ๊ฐ€ ๋ณด์˜€๋‹ค ์•ˆ ๋ณด์˜€๋‹ค? ์บ์‹œ๊ฐ€ ์• ๋“œ์„ผ์Šค ๋…ธ์ถœ์„....

์บ์‹œ๋Š” ๋ฉ”๋ชจ๋ฆฌ, ๋””์Šคํฌ, ๋ธŒ๋ผ์šฐ์ €, ํ”„๋ก์‹œ, CDN, ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋“ฑ ๋‹ค์–‘ํ•œ ์œ„์น˜์— ์กด์žฌํ•˜๋ฉฐ, ์ด๋ฅผ ํ†ตํ•ด ์›น ํŽ˜์ด์ง€ ๋กœ๋”ฉ ์†๋„๋ฅผ ํฌ๊ฒŒ ํ–ฅ์ƒ์‹œ์ผœ์ค๋‹ˆ๋‹ค. ์ด๋Š” ๊ณง ์• ๋“œ์„ผ์Šค ๊ด‘๊ณ  ์ตœ์ ํ™”์™€๋„ ๋ฐ€์ ‘ํ•œ ๊ด€๋ จ์ด ์žˆ์Šต๋‹ˆ๋‹ค.

์ด๋ฒˆ ๊ธ€์—์„œ๋Š” ์• ๋“œ์„ผ์Šค ๊ด‘๊ณ ๊ฐ€ ์บ์‹œ๋กœ ์ธํ•ด ์ •์ƒ์ ์œผ๋กœ ๋กœ๋”ฉ๋˜์ง€ ์•Š๋Š” ๋Œ€ํ‘œ์ ์ธ ์›์ธ๊ณผ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•, ๊ทธ๋ฆฌ๊ณ  ๊ด‘๊ณ  ์ˆ˜์ต ์ €ํ•˜๋ฅผ ๋ง‰๊ธฐ ์œ„ํ•œ ์ตœ์ ํ™” ์ „๋žต๊นŒ์ง€ ์ž์„ธํžˆ ๋‹ค๋ฃจ์–ด ๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค.

์บ์‹œ(Cache)๋ž€?

์บ์‹œ๋Š” ์ž์ฃผ ์‚ฌ์šฉํ•˜๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ์ž„์‹œ๋กœ ์ €์žฅํ•ด๋‘์—ˆ๋‹ค๊ฐ€, ๋‹ค์Œ์— ๊ฐ™์€ ์š”์ฒญ์ด ์žˆ์„ ๋•Œ ๋” ๋น ๋ฅด๊ฒŒ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ฃผ๋Š” ์ž„์‹œ ์ €์žฅ ๊ณต๊ฐ„์ž…๋‹ˆ๋‹ค. ์‰ฝ๊ฒŒ ๋งํ•ด, ์ž์ฃผ ์ฝ๋Š” ์ฑ…์„ ์ฑ…์žฅ ๊นŠ์ˆ™ํ•œ ๊ณณ์— ๋‘๋Š” ๋Œ€์‹  ์ฑ…์ƒ ์œ„์— ์˜ฌ๋ ค๋‘๋Š” ๊ฒƒ๊ณผ ๊ฐ™์€ ์›๋ฆฌ์ž…๋‹ˆ๋‹ค.

์›น ํ™˜๊ฒฝ์—์„œ ์บ์‹œ๋Š” ์ฃผ๋กœ ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•ฉ๋‹ˆ๋‹ค:

  • ์›น ํŽ˜์ด์ง€ HTML
  • ์ด๋ฏธ์ง€, JS, CSS ํŒŒ์ผ
  • ์„œ๋ฒ„์—์„œ ์ž์ฃผ ๋ถˆ๋Ÿฌ์˜ค๋Š” DB ๋ฐ์ดํ„ฐ

๋ธ”๋กœ๊ทธ์— ์บ์‹œ๊ฐ€ ์ค‘์š”ํ•œ ์ด์œ 

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

์บ์‹œ์˜ ์žฅ์ ๊ณผ ๋‹จ์ 

์žฅ์  ๋‹จ์ 
ํŽ˜์ด์ง€ ๋กœ๋”ฉ ์†๋„ ๊ฐœ์„  ๋ณ€๊ฒฝ๋œ ์ฝ˜ํ…์ธ ๊ฐ€ ์ฆ‰์‹œ ๋ฐ˜์˜๋˜์ง€ ์•Š์Œ
์„œ๋ฒ„ ๋ถ€ํ•˜ ๊ฐ์†Œ ์ž˜๋ชป๋œ ์บ์‹œ๊ฐ€ ๋กœ๋”ฉ ์˜ค๋ฅ˜ ์œ ๋ฐœ ๊ฐ€๋Šฅ
์‚ฌ์šฉ์ž ๊ฒฝํ—˜ ํ–ฅ์ƒ ๋ธŒ๋ผ์šฐ์ €๋‚˜ ์„œ๋ฒ„์—์„œ ์บ์‹œ ์‚ญ์ œ ํ•„์š”ํ•  ์ˆ˜ ์žˆ์Œ
ํŠธ๋ž˜ํ”ฝ ๋น„์šฉ ์ ˆ๊ฐ ๋””๋ฒ„๊น…/ํ…Œ์ŠคํŠธ ์‹œ ์บ์‹œ๊ฐ€ ๋ฐฉํ•ด๊ฐ€ ๋˜๊ธฐ๋„ ํ•จ

์บ์‹œ์˜ ์ข…๋ฅ˜

1. ๋ฉ”๋ชจ๋ฆฌ ์บ์‹œ (Memory Cache)

RAM์— ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜์—ฌ ๋งค์šฐ ๋น ๋ฅธ ์†๋„๋กœ ์‘๋‹ตํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•˜๋Š” ์บ์‹œ์ž…๋‹ˆ๋‹ค. ์ฃผ๋กœ ์„œ๋ฒ„๋‚˜ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋‚ด๋ถ€์—์„œ ์‹ค์‹œ๊ฐ„ ์ฒ˜๋ฆฌ๊ฐ€ ํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ์— ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ์ปดํ“จํ„ฐ๋ฅผ ๊ป๋‹ค ์ผœ๋ฉด ์‚ฌ๋ผ์ง€๋Š” ํœ˜๋ฐœ์„ฑ ์บ์‹œ์ž…๋‹ˆ๋‹ค.

2. ๋””์Šคํฌ ์บ์‹œ (Disk Cache)

ํ•˜๋“œ๋””์Šคํฌ๋‚˜ SSD์— ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜์—ฌ, ํŽ˜์ด์ง€ ์žฌ๋ฐฉ๋ฌธ ์‹œ ๋น ๋ฅด๊ฒŒ ๋ถˆ๋Ÿฌ์˜ค๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. ๋ธŒ๋ผ์šฐ์ €๋‚˜ ์šด์˜์ฒด์ œ์—์„œ ์ด๋ฏธ์ง€, ์Šคํฌ๋ฆฝํŠธ, HTML ๋“ฑ์„ ์ €์žฅํ•  ๋•Œ ์‚ฌ์šฉ๋˜๋ฉฐ, ์žฌ๋ถ€ํŒ… ํ›„์—๋„ ๋ฐ์ดํ„ฐ๊ฐ€ ์œ ์ง€๋ฉ๋‹ˆ๋‹ค.

3. ๋ธŒ๋ผ์šฐ์ € ์บ์‹œ (Browser Cache)

์‚ฌ์šฉ์ž์˜ ์›น ๋ธŒ๋ผ์šฐ์ €์— ์›น ๋ฆฌ์†Œ์Šค(CSS, JS, ์ด๋ฏธ์ง€ ๋“ฑ)๋ฅผ ์ €์žฅํ•ด๋‘๊ณ , ์žฌ๋ฐฉ๋ฌธ ์‹œ ์„œ๋ฒ„์— ์žฌ์š”์ฒญํ•˜์ง€ ์•Š๊ณ  ๋น ๋ฅด๊ฒŒ ๋ณด์—ฌ์ฃผ๋Š” ์บ์‹œ์ž…๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž ๊ฒฝํ—˜ ๊ฐœ์„ ์— ๋งค์šฐ ํšจ๊ณผ์ ์ž…๋‹ˆ๋‹ค.

4. ํ”„๋ก์‹œ ์บ์‹œ (Proxy Cache)

ํ”„๋ก์‹œ ์„œ๋ฒ„(์ค‘๊ฐ„ ์„œ๋ฒ„)๊ฐ€ ์—ฌ๋Ÿฌ ์‚ฌ์šฉ์ž๋ฅผ ๋Œ€์‹ ํ•ด ์ฝ˜ํ…์ธ ๋ฅผ ์ €์žฅํ•˜๊ณ  ์žฌ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. ์ฃผ๋กœ ํšŒ์‚ฌ ๋‚ด๋ถ€๋ง, ISP ๋˜๋Š” CDN ๊ตฌ์กฐ์—์„œ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.

5. CDN ์บ์‹œ (Content Delivery Network Cache)

์ „ ์„ธ๊ณ„์— ๋ถ„์‚ฐ๋œ ์„œ๋ฒ„์— ์ฝ˜ํ…์ธ ๋ฅผ ์ €์žฅํ•ด๋‘๊ณ , ์‚ฌ์šฉ์ž์™€ ๊ฐ€๊นŒ์šด ์„œ๋ฒ„์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๋น ๋ฅด๊ฒŒ ์ œ๊ณตํ•˜๋Š” ์บ์‹œ ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. ๋Œ€๊ทœ๋ชจ ํŠธ๋ž˜ํ”ฝ ๋Œ€์‘์— ํšจ๊ณผ์ ์ž…๋‹ˆ๋‹ค.

6. ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ์บ์‹œ (Database Cache)

์ž์ฃผ ์‚ฌ์šฉ๋˜๋Š” ์ฟผ๋ฆฌ ๊ฒฐ๊ณผ๋‚˜ ํ…Œ์ด๋ธ” ์ผ๋ถ€ ๋ฐ์ดํ„ฐ๋ฅผ ๋ฏธ๋ฆฌ ๋ฉ”๋ชจ๋ฆฌ์— ์ €์žฅํ•ด๋‘๊ณ  ๋น ๋ฅด๊ฒŒ ์‘๋‹ตํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. DB ๋ถ€ํ•˜๋ฅผ ์ค„์ด๊ณ  ์‘๋‹ต ์†๋„๋ฅผ ๋†’์ด๋Š” ๋ฐ ์œ ์šฉํ•ฉ๋‹ˆ๋‹ค.

7. ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์บ์‹œ (Application Cache)

ํ”„๋ก ํŠธ์—”๋“œ ๋˜๋Š” ๋ฐฑ์—”๋“œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๋‚ด๋ถ€์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. API ์‘๋‹ต ๊ฒฐ๊ณผ๋‚˜ ๊ณ„์‚ฐ๊ฐ’์„ ์ž„์‹œ๋กœ ์ €์žฅํ•ด, ๋‹ค์‹œ ์‚ฌ์šฉํ•  ๋•Œ ์†๋„๋ฅผ ๋†’์ž…๋‹ˆ๋‹ค.

์บ์‹œ์— ์ €์žฅ๋œ ์• ๋“œ์„ผ์Šค js

์บ์‹œ์ข…๋ฅ˜ ์ €์žฅ ์œ„์น˜ ์ฃผ์š” ์šฉ๋„ ํŠน์ง• ๋ฐ ์žฅ์  ์‚ฌ์šฉ ์‚ฌ๋ก€
๋ฉ”๋ชจ๋ฆฌ ์บ์‹œ RAM ์‹ค์‹œ๊ฐ„ ์ฒ˜๋ฆฌ ์†๋„ ๋งค์šฐ ๋น ๋ฆ„, ํœ˜๋ฐœ์„ฑ ์„œ๋ฒ„ ์‘๋‹ต ์บ์‹œ, Redis, CPU ์บ์‹œ
๋””์Šคํฌ ์บ์‹œ HDD/SSD ์ •์  ๋ฆฌ์†Œ์Šค ์ €์žฅ ์†๋„ ๋ณดํ†ต, ๋ฐ์ดํ„ฐ ์ง€์†๋จ ๋ธŒ๋ผ์šฐ์ € ์บ์‹œ, OS ํŒŒ์ผ ์บ์‹œ
๋ธŒ๋ผ์šฐ์ € ์บ์‹œ ํด๋ผ์ด์–ธํŠธ ๋””์Šคํฌ ์›น ๋ฆฌ์†Œ์Šค ์ €์žฅ ์žฌ๋ฐฉ๋ฌธ ์‹œ ๋กœ๋”ฉ ์†๋„ ํ–ฅ์ƒ ์ด๋ฏธ์ง€, CSS, JS ์ €์žฅ
ํ”„๋ก์‹œ ์บ์‹œ ์ค‘๊ฐ„ ์„œ๋ฒ„ ๋‹ค์ˆ˜ ์‚ฌ์šฉ์ž ์š”์ฒญ ๊ณตํ†ต ์ฒ˜๋ฆฌ ์„œ๋ฒ„ ํŠธ๋ž˜ํ”ฝ ๊ฐ์†Œ ํšŒ์‚ฌ ๋„คํŠธ์›Œํฌ, ์บ์‹œ ์„œ๋ฒ„
CDN ์บ์‹œ ์ „ ์„ธ๊ณ„ ๋ถ„์‚ฐ ์„œ๋ฒ„ ์ฝ˜ํ…์ธ  ๊ธ€๋กœ๋ฒŒ ๋ฐฐํฌ ์ง€์—ฐ ์‹œ๊ฐ„ ๊ฐ์†Œ, ๋Œ€๊ทœ๋ชจ ํŠธ๋ž˜ํ”ฝ ๋Œ€์‘ Cloudflare, Akamai, CloudFront ๋“ฑ
๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ์บ์‹œ RAM ๋˜๋Š” ์™ธ๋ถ€ ์บ์‹œ ์ž์ฃผ ์“ฐ๋Š” ์ฟผ๋ฆฌ ๊ฒฐ๊ณผ ์ €์žฅ DB ๋ถ€ํ•˜ ๊ฐ์†Œ, ์‘๋‹ต ์†๋„ ํ–ฅ์ƒ Redis, Memcached
์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์บ์‹œ ์•ฑ ๋‚ด๋ถ€ ๋˜๋Š” ๋กœ์ปฌ ๋ฐ˜๋ณต๋˜๋Š” ๊ฒฐ๊ณผ ์žฌ์‚ฌ์šฉ ์—ฐ์‚ฐ ์ค„์ด๊ณ  ์†๋„ ํ–ฅ์ƒ React/Vue ์ƒํƒœ ์บ์‹œ, API ์‘๋‹ต ์ €์žฅ ๋“ฑ

๋น ๋ฅด๋ฉด ํ•ญ์ƒ ์ข‹๋‹ค? ์บ์‹œ(Cache)์˜ ๋ถ€์ •์  ์ธก๋ฉด๋„ ํ•จ๊ป˜ ๋ด์•ผ ํ•ฉ๋‹ˆ๋‹ค

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

ํ•˜์ง€๋งŒ ์—ฌ๊ธฐ์„œ ์งˆ๋ฌธ ํ•˜๋‚˜ ๋˜์ ธ๋ด…๋‹ˆ๋‹ค.

๋น ๋ฅด๋ฉด ํ•ญ์ƒ ์ข‹์€ ๊ฑธ๊นŒ์š”? ์บ์‹œ๋Š” ์–ธ์ œ๋‚˜ ์œ ์ตํ•˜๊ธฐ๋งŒ ํ• ๊นŒ์š”?

์†๋„์—๋งŒ ์ง‘์ค‘ํ•œ ๋‚˜๋จธ์ง€, ์บ์‹œ์˜ ๊ทธ๋ฆผ์ž๋Š” ๊ฐ„๊ณผ๋˜๊ธฐ ์‰ฝ์Šต๋‹ˆ๋‹ค.

์บ์‹œ๋กœ ์ธํ•ด ๋ฐœ์ƒํ•˜๋Š” ์ฃผ์š” ๋ฌธ์ œ์ 

1. ๋ณ€๊ฒฝ๋œ ๋‚ด์šฉ์ด ๋ฐ”๋กœ ๋ฐ˜์˜๋˜์ง€ ์•Š๋Š”๋‹ค

์บ์‹œ์˜ ๊ฐ€์žฅ ๋Œ€ํ‘œ์ ์ธ ๋‹จ์ ์€ ๋ฐ”๋กœ ์ฝ˜ํ…์ธ ์˜ ์ตœ์‹  ์ƒํƒœ๋ฅผ ๋ฐ˜์˜ํ•˜์ง€ ๋ชปํ•œ๋‹ค๋Š” ์ ์ž…๋‹ˆ๋‹ค.

  • ๋ธ”๋กœ๊ทธ์— ๊ธ€์„ ์ˆ˜์ •ํ–ˆ๋Š”๋ฐ๋„ ์ด์ „ ๋‚ด์šฉ์ด ๊ทธ๋Œ€๋กœ ๋ณด์ธ๋‹ค?
  • ์›น์‚ฌ์ดํŠธ ๋””์ž์ธ์„ ๋ฐ”๊ฟจ๋Š”๋ฐ๋„ ๋ณ€๊ฒฝ ์‚ฌํ•ญ์ด ์ ์šฉ๋˜์ง€ ์•Š๋Š”๋‹ค?

์ด๋Ÿฐ ํ˜„์ƒ์€ ๋Œ€๋ถ€๋ถ„ ๋ธŒ๋ผ์šฐ์ €๋‚˜ ์„œ๋ฒ„์˜ ์บ์‹œ๊ฐ€ ์ด์ „ ๋ฐ์ดํ„ฐ๋ฅผ ๋ณด์—ฌ์ฃผ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ํŠนํžˆ CSS๋‚˜ JS ํŒŒ์ผ์ฒ˜๋Ÿผ ์™ธ๋ถ€ ๋ฆฌ์†Œ์Šค์— ์บ์‹œ๊ฐ€ ์ ์šฉ๋˜๋ฉด, ์‚ฌ์šฉ์ž๋Š” ์˜ค๋žซ๋™์•ˆ ์ด์ „ ๋ฒ„์ „์˜ ์‚ฌ์ดํŠธ๋ฅผ ๋ณด๊ฒŒ ๋˜๋Š” ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

โœ” ํ•ด๊ฒฐํ•˜๋ ค๋ฉด? ์บ์‹œ๋ฅผ ๊ฐ•์ œ๋กœ ์ƒˆ๋กœ๊ณ ์นจ(Ctrl+F5)ํ•˜๊ฑฐ๋‚˜ ๋ฒ„์ „ ์ฟผ๋ฆฌ ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ๋ถ™์—ฌ์•ผ ํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ์ผ๋ฐ˜ ์‚ฌ์šฉ์ž๋Š” ์ด๋Ÿฐ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์„ ์•Œ์ง€ ๋ชปํ•˜๋ฏ€๋กœ, ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์— ์น˜๋ช…์ ์ธ ์˜ํ–ฅ์„ ์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

2. ๋””๋ฒ„๊น…์ด๋‚˜ ํ…Œ์ŠคํŠธ์— ๋ฐฉํ•ด๊ฐ€ ๋œ๋‹ค

์›น ๊ฐœ๋ฐœ์ž๋ผ๋ฉด ํ•œ ๋ฒˆ์ฏค ๊ฒช์–ด๋ดค์„ ๋ฌธ์ œ์ž…๋‹ˆ๋‹ค.

  • ์ฝ”๋“œ๋ฅผ ์ˆ˜์ •ํ–ˆ๋Š”๋ฐ๋„ ํ™”๋ฉด์ด ์•ˆ ๋ฐ”๋€๋‹ค?
  • ๋ฒ„๊ทธ๋ฅผ ๊ณ ์ณค๋Š”๋ฐ ์—ฌ์ „ํžˆ ๋ฌธ์ œ๊ฐ€ ์žฌํ˜„๋œ๋‹ค?

์‚ฌ์‹ค์€ ์ˆ˜์ •ํ•œ ํŒŒ์ผ์ด ์•„๋‹Œ, ์บ์‹œ๋œ ํŒŒ์ผ์ด ๊ณ„์† ๋กœ๋”ฉ๋˜๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ์ด๋กœ ์ธํ•ด ๋””๋ฒ„๊น… ํšจ์œจ์ด ๋–จ์–ด์ง€๊ณ , ๋ฌธ์ œ ํ•ด๊ฒฐ ์†๋„๊ฐ€ ์ง€์—ฐ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์บ์‹œ๊ฐ€ ๊ฐœ๋ฐœ๊ณผ ์œ ์ง€๋ณด์ˆ˜์˜ ํˆฌ๋ช…์„ฑ์„ ๊ฐ€๋ฆด ์ˆ˜ ์žˆ๋‹ค๋Š” ์ ๋„ ๋ถ„๋ช…ํ•œ ๋ฆฌ์Šคํฌ์ž…๋‹ˆ๋‹ค.

3. ์ž˜๋ชป๋œ ์บ์‹œ๋กœ ์ธํ•ด ์˜ค๋ฅ˜๋ฅผ ์œ ๋ฐœํ•  ์ˆ˜ ์žˆ๋‹ค

์บ์‹œ๋œ ๋ฐ์ดํ„ฐ๊ฐ€ ๋ถˆ์™„์ „ํ•˜๊ฑฐ๋‚˜ ์†์ƒ๋œ ๊ฒฝ์šฐ, ์‚ฌ์šฉ์ž๋Š” ์ž˜๋ชป๋œ ์ •๋ณด๋‚˜ ๊ธฐ๋Šฅ ์˜ค๋ฅ˜๋ฅผ ๊ฒฝํ—˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • ์˜ˆ: ์‡ผํ•‘๋ชฐ ์žฅ๋ฐ”๊ตฌ๋‹ˆ๊ฐ€ ๋น„์–ด ์žˆ๋Š”๋ฐ ๊ณ„์† ์ƒํ’ˆ์ด ๋‚จ์•„ ์žˆ๋Š” ์ƒํƒœ๋กœ ๋ณด์ด๋Š” ๊ฒฝ์šฐ
  • ์˜ˆ: ๋กœ๊ทธ์ธ ์ •๋ณด๊ฐ€ ์บ์‹œ๋˜์–ด ๋ณด์•ˆ์ƒ ๋…ธ์ถœ๋˜๋Š” ์ƒํ™ฉ

ํŠนํžˆ ๋ฏผ๊ฐํ•œ ๋ฐ์ดํ„ฐ๋‚˜ ๋กœ๊ทธ์ธ ๊ด€๋ จ ์บ์‹œ๋Š” ๋ณด์•ˆ ์ด์Šˆ๋กœ ์ง๊ฒฐ๋  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ, ์ฒ ์ €ํ•œ ๊ด€๋ฆฌ๊ฐ€ ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค.

4. ๋ถˆํ•„์š”ํ•˜๊ฒŒ ๋งŽ์€ ์ €์žฅ ๊ณต๊ฐ„์„ ์ฐจ์ง€ํ•œ๋‹ค

๋””์Šคํฌ ์บ์‹œ๋Š” ์‹œ๊ฐ„์ด ์ง€๋‚ ์ˆ˜๋ก ์šฉ๋Ÿ‰์ด ์Œ“์ž…๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž ๋ธŒ๋ผ์šฐ์ €๋‚˜ ์„œ๋ฒ„, CDN ๋“ฑ ๋ชจ๋“  ๋‹จ๊ณ„์—์„œ ์บ์‹œ๊ฐ€ ๋ˆ„์ ๋˜๋ฉด ์ €์žฅ ๊ณต๊ฐ„์ด ๋‚ญ๋น„๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • ์ผ๋ฐ˜ ์‚ฌ์šฉ์ž์˜ ๋ธŒ๋ผ์šฐ์ €์— ์ˆ˜๋ฐฑ MB ์ด์ƒ์˜ ์บ์‹œ ํŒŒ์ผ์ด ์Œ“์ด๋Š” ๊ฒฝ์šฐ
  • ์„œ๋ฒ„๋‚˜ CDN์—์„œ ์˜ค๋ž˜๋œ ์บ์‹œ๋ฅผ ์ •๋ฆฌํ•˜์ง€ ์•Š์•„ ์„ฑ๋Šฅ ์ €ํ•˜ ์œ ๋ฐœ

์บ์‹œ๋Š” '๋น ๋ฆ„'์˜ ๋Œ€๊ฐ€๋กœ '๋ถˆํŽธํ•จ'์„ ์œ ๋ฐœํ•  ์ˆ˜๋„ ์žˆ๋‹ค

์บ์‹œ๋Š” ๋ถ„๋ช…ํžˆ ์œ ์šฉํ•œ ๊ธฐ์ˆ ์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ '๋น ๋ฅด๋‹ค'๋Š” ์ด์œ ๋งŒ์œผ๋กœ ๋ฌด์กฐ๊ฑด ๊ธ์ •์ ์œผ๋กœ ๋ณด๊ธฐ์—๋Š” ๊ด€๋ฆฌ ๋ฆฌ์Šคํฌ์™€ ์‚ฌ์šฉ์ž ํ˜ผ๋ž€์„ ๋™๋ฐ˜ํ•ฉ๋‹ˆ๋‹ค.

๊ทธ๋ž˜์„œ ํ•„์š”ํ•œ ๊ฒƒ์€?

  • ์ ์ ˆํ•œ ๋งŒ๋ฃŒ ์‹œ๊ฐ„ ์„ค์ • (Cache-Control, Expires ํ—ค๋” ํ™œ์šฉ)
  • ์ •์  ํŒŒ์ผ์— ๋ฒ„์ „ ์ฟผ๋ฆฌ ๋ถ™์ด๊ธฐ (style.css?v=2.3)
  • ์บ์‹œ ๋ฌดํšจํ™” ์ „๋žต ์ˆ˜๋ฆฝ (์—…๋ฐ์ดํŠธ ์‹œ ์ž๋™ ์‚ญ์ œ ๋“ฑ)
  • ์‚ฌ์šฉ์ž์—๊ฒŒ ์ƒˆ๋กœ๊ณ ์นจ ์•ˆ๋‚ด (๊ณต์ง€ ๋˜๋Š” ์ž๋™ ๋ฆฌํ”„๋ ˆ์‹œ ๊ธฐ๋Šฅ)

์šฐ๋ฆฌ๋Š” ๋‹จ์ˆœํžˆ ์บ์‹œ๊ฐ€ ๋ฌด์—‡์ธ๊ฐ€๋ฅผ ์•Œ๊ธฐ ์œ„ํ•ด ์ด ๊ธ€์„ ์ฝ๋Š” ๊ฒƒ์ด ์•„๋‹™๋‹ˆ๋‹ค. ์ค‘์š”ํ•œ ๊ฒƒ์€ ์• ๋“œ์„ผ์Šค ๊ด‘๊ณ  ๋…ธ์ถœ ๋ฌธ์ œ์™€ ์บ์‹œ ์‚ฌ์ด์˜ ์—ฐ๊ด€์„ฑ์„ ์ดํ•ดํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค.

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

๊ด‘๊ณ ๋„ ๋งˆ์ฐฌ๊ฐ€์ง€์ž…๋‹ˆ๋‹ค. ๋ฐฉ๋ฌธ์ž์—๊ฒŒ ์ตœ์‹  ๊ด‘๊ณ ๊ฐ€ ์•„๋‹Œ, ์ด๋ฏธ ๋ณธ ๊ด‘๊ณ ๋‚˜ ์ž˜๋ชป๋œ ์บ์‹œ๋œ ๊ด‘๊ณ ๊ฐ€ ๊ณ„์† ๋…ธ์ถœ๋œ๋‹ค๋ฉด ํด๋ฆญ๋ฅ ์€ ์ž์—ฐ์Šค๋Ÿฝ๊ฒŒ ๋–จ์–ด์ง€๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

์ด ๋ฌธ์ œ์— ๋Œ€์‘ํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์€ ์•„๋ž˜์™€ ๊ฐ™์Šต๋‹ˆ๋‹ค.

์• ๋“œ์„ผ์Šค ์ตœ์ ํ™” ์• ๋“œ์„ผ์Šค ์Šคํฌ๋ฆฝํŠธ์— ๋‚ ์งœ ๋ฒ„์ „ ๋ถ™์ด๊ธฐ

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

์ฝ”๋“œ ์„ค๋ช…

์ด ์ฝ”๋“œ๋Š” ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜(IIFE) ๋ฐฉ์‹์œผ๋กœ ๊ตฌ์„ฑ๋˜์–ด ์žˆ์œผ๋ฉฐ, ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋™์ž‘์„ ํ•ฉ๋‹ˆ๋‹ค:

  1. new Date()๋กœ ํ˜„์žฌ ๋‚ ์งœ๋ฅผ ๊ฐ€์ ธ์˜ต๋‹ˆ๋‹ค.
  2. YYYYMMDD ํ˜•์‹์œผ๋กœ ๋‚ ์งœ ๊ฐ’์„ ์กฐํ•ฉํ•ฉ๋‹ˆ๋‹ค.
  3. Google AdSense ์Šคํฌ๋ฆฝํŠธ URL ๋์— &v=YYYYMMDD ํ˜•์‹์˜ ์ฟผ๋ฆฌ ๋ฌธ์ž์—ด์„ ์ถ”๊ฐ€ํ•ฉ๋‹ˆ๋‹ค.
  4. ํ•ด๋‹น ์Šคํฌ๋ฆฝํŠธ๋ฅผ head์— ๋น„๋™๊ธฐ(async) ๋ฐฉ์‹์œผ๋กœ ์‚ฝ์ž…ํ•ฉ๋‹ˆ๋‹ค.

์ฆ‰, ๋งค์ผ ์ƒˆ๋กญ๊ฒŒ ๋ณ€๊ฒฝ๋˜๋Š” URL์„ ์‚ฌ์šฉํ•จ์œผ๋กœ์จ ์บ์‹œ๋œ ์ด์ „ ์Šคํฌ๋ฆฝํŠธ ๋Œ€์‹  ํ•ญ์ƒ ์ตœ์‹  ๋ฒ„์ „์˜ ๊ด‘๊ณ  ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋„๋ก ์œ ๋„ํ•ฉ๋‹ˆ๋‹ค.

script
(() = {
 const d = document;
 const t = new Date();
 const v = t.getFullYear() + ('0' + (t.getMonth() + 1)).slice(-2) + ('0' + t.getDate()).slice(-2);
 const s = d.createElement('script');
 s.async = true;
 s.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxx&v=' + v;
 s.crossOrigin = 'anonymous';
 d.head.appendChild(s);
})();
/script

์‚ฌ์šฉ ๋ชฉ์  ๋ฐ ์žฅ์ 

๋ชฉ์  ์„ค๋ช…
๊ด‘๊ณ  ์Šคํฌ๋ฆฝํŠธ ์บ์‹œ ๋ฌด๋ ฅํ™” URL ๋’ค์— ๋‚ ์งœ ์ฟผ๋ฆฌ๋ฅผ ๋ถ™์ด๋ฉด ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ๋งค์ผ ์ƒˆ๋กœ ์š”์ฒญํ•จ.
๋กœ๋”ฉ ์ตœ์ ํ™” async ์†์„ฑ์œผ๋กœ ํŽ˜์ด์ง€ ๋ Œ๋”๋ง์„ ์ฐจ๋‹จํ•˜์ง€ ์•Š์Œ.
์ž๋™ํ™” ์ˆ˜๋™์œผ๋กœ ๋ฒ„์ „์„ ๊ฐฑ์‹ ํ•  ํ•„์š” ์—†์ด ์ž๋™ ๋ฐ˜์˜.
๋ณด์•ˆ ๊ฐ•ํ™” crossOrigin="anonymous" ์„ค์ •์œผ๋กœ ์™ธ๋ถ€ ๋ฆฌ์†Œ์Šค ๋กœ๋”ฉ ์‹œ ๋ณด์•ˆ ๊ฐ•ํ™”.

ํ‹ฐ์Šคํ† ๋ฆฌ ๋ธ”๋กœ๊ทธ ์šด์˜์ž๋ฅผ ์œ„ํ•œ ์ตœ์ ํ™” ์ฝ”๋“œ

"๋‹จ, ์ด ์ฝ”๋“œ๋Š” ํ‹ฐ์Šคํ† ๋ฆฌ์—์„œ ์• ๋“œ์„ผ์Šค ์ž๋™ ๊ด‘๊ณ  ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•˜์ง€ ์•Š๊ณ , ์ˆ˜๋™์œผ๋กœ ๊ด‘๊ณ ๋ฅผ ์šด์˜ํ•˜๋Š” ์šด์˜์ž์—๊ฒŒ ์œ ์šฉํ•ฉ๋‹ˆ๋‹ค."

script
(() = {
 const currentUrl = location.href;

 // ๋ฉ”์ธ ํŽ˜์ด์ง€ ๋˜๋Š” ์นดํ…Œ๊ณ ๋ฆฌ ํŽ˜์ด์ง€์—์„œ๋งŒ ์‹คํ–‰
 const isMainOrCategory =
 currentUrl === 'https://yourblog.tistory.com/' || // ์—ฌ๊ธฐ์— ์ž์‹ ์˜ ๋ธ”๋กœ๊ทธ ์ฃผ์†Œ ์ž…๋ ฅ
 currentUrl.includes('/category');

 if (!isMainOrCategory) return;

 // ์ค‘๋ณต๋œ adsbygoogle ์Šคํฌ๋ฆฝํŠธ ์ œ๊ฑฐ
 const existingScripts = document.querySelectorAll('script[src*="adsbygoogle.js"]');
 if (existingScripts.length 1) {
 for (let i = 1; i existingScripts.length; i++) {
 existingScripts[i].remove();
 }
 }

 // ๊ด‘๊ณ  ์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์—†์„ ๋•Œ๋งŒ ์‚ฝ์ž…
 if (existingScripts.length === 0) {
 const script = document.createElement('script');

 // ์˜ค๋Š˜ ๋‚ ์งœ (YYYYMMDD ํ˜•์‹) ์ฟผ๋ฆฌ ํŒŒ๋ผ๋ฏธํ„ฐ ์ƒ์„ฑ
 const now = new Date();
 const version =
 now.getFullYear() +
 String(now.getMonth() + 1).padStart(2, '0') +
 String(now.getDate()).padStart(2, '0');

 script.async = true;
 script.src =
 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxx&v=' +
 version;
 script.crossOrigin = 'anonymous';

 document.head.appendChild(script);
 }
})();
/script

๊ฐ„๋‹จ ์„ค๋ช…

  • ํŠน์ • ํŽ˜์ด์ง€์—์„œ๋งŒ Google AdSense ๊ด‘๊ณ  ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋™์ ์œผ๋กœ ์‚ฝ์ž…
    ์ด ์ฝ”๋“œ๋Š” ํ˜„์žฌ ํŽ˜์ด์ง€ URL์ด ๋ฉ”์ธ ํŽ˜์ด์ง€(https://yourblog.tistory.com/)์ด๊ฑฐ๋‚˜ ์นดํ…Œ๊ณ ๋ฆฌ ํŽ˜์ด์ง€(/category ๊ฒฝ๋กœ ํฌํ•จ)์ธ ๊ฒฝ์šฐ์—๋งŒ ์‹คํ–‰๋ฉ๋‹ˆ๋‹ค.
  • ์ค‘๋ณต ์‚ฝ์ž…๋œ adsbygoogle.js ์Šคํฌ๋ฆฝํŠธ ์ œ๊ฑฐ
    ํŽ˜์ด์ง€์— ์ด๋ฏธ adsbygoogle.js ์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์—ฌ๋Ÿฌ ๊ฐœ ์‚ฝ์ž…๋˜์–ด ์žˆ์„ ๋•Œ, ์ฒซ ๋ฒˆ์งธ ์Šคํฌ๋ฆฝํŠธ๋งŒ ๋‚จ๊ธฐ๊ณ  ๋‚˜๋จธ์ง€๋ฅผ ๋ชจ๋‘ ์ œ๊ฑฐํ•˜์—ฌ ๊ด‘๊ณ  ์ค‘๋ณต ๋กœ๋”ฉ์œผ๋กœ ์ธํ•œ ์˜ค๋ฅ˜๋ฅผ ๋ฐฉ์ง€ํ•ฉ๋‹ˆ๋‹ค.
  • ๊ด‘๊ณ  ์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์—†์œผ๋ฉด ์ƒˆ๋กœ ์‚ฝ์ž…
    adsbygoogle.js ์Šคํฌ๋ฆฝํŠธ๊ฐ€ ํŽ˜์ด์ง€์— ์—†์„ ๋•Œ, ์˜ค๋Š˜ ๋‚ ์งœ๋ฅผ ์ฟผ๋ฆฌ ํŒŒ๋ผ๋ฏธํ„ฐ(v=YYYYMMDD)๋กœ ๋ถ™์—ฌ์„œ ์ƒˆ๋กญ๊ฒŒ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋น„๋™๊ธฐ(async)๋กœ ์‚ฝ์ž…ํ•ฉ๋‹ˆ๋‹ค.
    ๋‚ ์งœ ์ฟผ๋ฆฌ ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ๋ถ™์ด๋Š” ์ด์œ ๋Š” ๋ธŒ๋ผ์šฐ์ €์™€ CDN ์บ์‹œ๋ฅผ ๋ฌด๋ ฅํ™”ํ•˜์—ฌ ๋งค์ผ ์ตœ์‹  ๊ด‘๊ณ  ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋กœ๋“œํ•˜๋„๋ก ํ•˜๊ธฐ ์œ„ํ•จ์ž…๋‹ˆ๋‹ค.
  • crossOrigin="anonymous" ์„ค์ •
    ์™ธ๋ถ€ ์Šคํฌ๋ฆฝํŠธ ๋กœ๋”ฉ ์‹œ ๋ณด์•ˆ์„ ๊ฐ•ํ™”ํ•˜๊ณ , CORS ์ด์Šˆ๋ฅผ ๋ฐฉ์ง€ํ•˜๊ธฐ ์œ„ํ•œ ์„ค์ •์ž…๋‹ˆ๋‹ค.

ํ‹ฐ์Šคํ† ๋ฆฌ ๋ธ”๋กœ๊ทธ์— ์Šคํฌ๋ฆฝํŠธ ์ ์šฉ ๋ฐฉ๋ฒ•

1. ํ‹ฐ์Šคํ† ๋ฆฌ ๊ด€๋ฆฌ์ž ํŽ˜์ด์ง€ ์ ‘์†

  • ํ‹ฐ์Šคํ† ๋ฆฌ ๋ธ”๋กœ๊ทธ ๊ด€๋ฆฌ์ž๋กœ ๋กœ๊ทธ์ธ ํ›„,
  • ์™ผ์ชฝ ๋ฉ”๋‰ด์—์„œ ๊พธ๋ฏธ๊ธฐ HTML/CSS ํŽธ์ง‘ ์œผ๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.

2. HTML ํŽธ์ง‘ ํ™”๋ฉด์—์„œ head ํƒœ๊ทธ ๋˜๋Š” body ํ•˜๋‹จ ์œ„์น˜ ์ฐพ๊ธฐ

  • head ์˜์—ญ์— ์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋„ฃ์œผ๋ฉด ํŽ˜์ด์ง€๊ฐ€ ๋กœ๋“œ๋  ๋•Œ ๋ฐ”๋กœ ์‹คํ–‰๋ฉ๋‹ˆ๋‹ค.
  • ๋ณดํ†ต head ํƒœ๊ทธ ๋‚ด๋ถ€ ๋˜๋Š” /body ๋ฐ”๋กœ ์œ„์— ์‚ฝ์ž…ํ•˜๋Š” ๊ฑธ ์ถ”์ฒœํ•ฉ๋‹ˆ๋‹ค.

3. ์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ ๋ถ™์—ฌ๋„ฃ๊ธฐ

  • ์•„๋ž˜ ์Šคํฌ๋ฆฝํŠธ ๋ณต์‚ฌ ํ›„,
  • ์ž์‹ ์˜ ๋ธ”๋กœ๊ทธ ์ฃผ์†Œ(https://yourblog.tistory.com/)์™€ ์• ๋“œ์„ผ์Šค ํผ๋ธ”๋ฆฌ์…” ID(ca-pub-xxxxxxxx)๋ฅผ ๊ผญ ์ˆ˜์ •ํ•˜์„ธ์š”!
  • ์ˆ˜์ •ํ•œ ์ฝ”๋“œ๋ฅผ head ํƒœ๊ทธ ์•ˆ์ด๋‚˜ /body ๋ฐ”๋กœ ์œ„์— ๋ถ™์—ฌ๋„ฃ์Šต๋‹ˆ๋‹ค.

์บ์‹œ๋Š” ์†๋„์™€ ์•ˆ์ •์„ฑ ์‚ฌ์ด์˜ ์ค„๋‹ค๋ฆฌ๊ธฐ

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

์บ์‹œ๋Š” ๋ถ„๋ช…ํžˆ ์›น ์„ฑ๋Šฅ์„ ๋†’์ด๋Š” ํ•ต์‹ฌ ๊ธฐ์ˆ ์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ๋ฌด์กฐ๊ฑด ๋น ๋ฅด๊ธฐ๋งŒ ํ•œ ๊ฒƒ์ด ์ •๋‹ต์€ ์•„๋‹™๋‹ˆ๋‹ค. ํŠนํžˆ ์• ๋“œ์„ผ์Šค ๊ด‘๊ณ ์™€ ๊ฐ™์ด ์‹ค์‹œ๊ฐ„์„ฑ์ด ์ค‘์š”ํ•œ ์š”์†Œ์—์„œ๋Š” ์บ์‹œ๊ฐ€ ์˜คํžˆ๋ ค ๋…ธ์ถœ ์˜ค๋ฅ˜๋ฅผ ์œ ๋ฐœํ•˜๊ณ  ์ˆ˜์ต ์ €ํ•˜๋กœ ์ด์–ด์งˆ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋”ฐ๋ผ์„œ ์• ๋“œ์„ผ์Šค ๊ด‘๊ณ  ์ตœ์ ํ™”๋ฅผ ์œ„ํ•ด์„œ๋Š” ์บ์‹œ์˜ ๊ตฌ์กฐ๋ฅผ ์ดํ•ดํ•˜๊ณ , ์ด๋ฅผ ์ „๋žต์ ์œผ๋กœ ์ œ์–ดํ•˜๋Š” ๊ฒƒ์ด ๋ฌด์—‡๋ณด๋‹ค ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค. ์†๋„์™€ ์ •ํ™•์„ฑ, ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ๊ท ํ˜• ์žˆ๊ฒŒ ๊ณ ๋ คํ•œ ์บ์‹œ ๊ด€๋ฆฌ๊ฐ€ ๊ณง ๋ธ”๋กœ๊ทธ ์ˆ˜์ต๊ณผ ์ง๊ฒฐ๋œ๋‹ค๋Š” ์ ์„ ๊ธฐ์–ตํ•˜์„ธ์š”.