true,falseλ₯Ό νλ¨νμΈμ.
1. μλ²λ‘λΆν° λ°μμ¨ μλ°μ€ν¬λ¦½νΈ νμΌμ λΈλΌμ°μ μ λ λλ§ μμ§μμν΄ νμ±λλ€.
2. μλ²λ‘λΆν° λ°μ΄ν°λ₯Ό λ°μμ¬λ λͺ¨λ λ°μ΄ν°(html,css,js,μ΄λ―Έμ§νμΌ λ±λ±.)λ₯Ό λμμ λ°μμ¨λ€.
true,falseλ₯Ό νλ¨νμΈμ.
1. HTTPλ μΉμμ μλ²μ ν΄λΌμ΄μΈνΈκ° ν΅μ νκΈ°μν νλ‘ν μ½(κ·μ½)μ΄λ€.
2. HTTP1.1μ λ€μ€ μμ²/μλ΅μ΄ κ°λ₯νλ€.
1.λνΈλ¦¬μλ ν¬ν¨λμ§λ§, λ λνΈλ¦¬μλ ν¬ν¨λμ§μλ λ
Έλλ€μ κ³ λ₯΄κ³ (1) κ·Έ μ΄μ μλν΄ μ€λͺ
νμμ€(2)
(1) head λμμ
(2) display : none; μμ±μ μ§λ λμμ
1.리λ λλ§μ΄ λ°μνλ μν©μλν΄ μ€λͺ
νμΈμ(μ΅μ 1κ°μ§)
javascript νκ·Έλ₯Ό bodyμ 맨 λ°μ λλ μ΄μ λ?
script tagμμ async μ deferμ΄ λ¬΄μμΈμ§ μ€λͺ
νκ³ , μ°¨μ΄μ μ μμ νμμ€.
display : none κ³Ό visibility : hiddenμ μ°¨μ΄μ μ λ λμ κ΄μ μμ μ°μμ€
λΈλΌμ°μ λ λλ§ μμμ λ§κ² λμ΄νμΈμ.
(a) Paint
(b) Layout
(c) DOM νΈλ¦¬, CSSOM νΈλ¦¬ μμ±
(d) λ λ νΈλ¦¬ μμ±
λΈλΌμ°μ μ λ λλ§ μμ§μ΄ HTML λ¬Έμλ₯Ό νμ±νμ¬ DOMμ λ§λλλ°, μ΄λμ HTML λ¬Έμμ λ³νλ₯Ό μμλλ‘ λμ΄νμΈμ.
(a) λ¬Έμμ΄
(b) λ
Έλ
(c) ν ν°
(d) λ°μ΄νΈ
λ€μ λ¬Έμ₯μ true, falseλ₯Ό νλ¨νμΈμ.
(1) λ λλ§ μμ§μ λͺ¨λ htmlμ νμ±ν λκΉμ§ κΈ°λ€λ¦¬μ§ μκ³ λΉλκΈ°μ μΌλ‘ Layout, Paint κ³Όμ μ μννλ€.
(2) HTML/CSS νμΌμ νμ± κ³Όμ μΌλ‘ 'λ°μ΄νΈ β λ¬Έμ β λ
Έλ β ν ν° β DOM/CSSOM'μ κ±°μΉλ€.
(3) HTMLμ νμ±νλ λμ style, css νκ·Έλ₯Ό λ§λλ©΄ HTML νμ± κ³Όμ μ μΌμ μ€λ¨νλ€.
(4) λ λ νΈλ¦¬λ meta νκ·Έ, script νκ·Έλ₯Ό ν¬ν¨ν λͺ¨λ λ
Έλλ‘ κ΅¬μ±λ νΈλ¦¬ ꡬ쑰μ μλ£κ΅¬μ‘°μ΄λ€.
(κ°) λ€μμ HTML, CSSλ₯Ό νμ±νλ κ³Όμ μμ μΈκΈλ ν€μλμ
λλ€. μλ§μ μμλ‘ λμ΄νμμ€.
(1) : DOM/CSSOM
(2) : ν ν°
(3) : λ¬Έμμ΄
(4) : λ°μ΄νΈ
(5) : λ
Έλ
(λ) λ€μ 보기μ true
, false
λ₯Ό νλ¨νμμ€.
(1) : λ¬Έλ²μ μλ―Έλ₯Ό κ°λ μ½λμ μ΅μ λ¨μλ₯Ό λ
ΈλλΌκ³ νλ€.
(2) : CSS, JavaScript νμ±νλ©΄μ DOMμ λ§λ€ μ μλ€.
(3) : μλ²λ‘λΆν° λ°μ HTML λ¬Έμλ₯Ό λΈλΌμ°μ κ° λ°μ΄νΈ(2μ§μ)ννλ‘ λ³ννλ€.
λ€μ 보기μ κ° μμ±μ΄ λ³νλμμ λ Reflow
μ Repaint
μ€ μ΄λ λ¨κ³λΆν° μ€νλλ μ§ κ³ λ₯΄μμ€
(1) : position
(2) : visibility
(3) : transform
(4) : width, height
(5) : opacity
(6) : background
(7) : overflow
(8) : color
(9) : cursor
λ€μ 보기μ true
, false
λ₯Ό νλ¨νμμ€.
(1) : μλ°μ€ν¬λ¦½νΈ νμΌμ λ‘λκ° μλ£λ μ§ν, μλ°μ€ν¬λ¦½νΈμ νμ±κ³Ό μ€νμ΄ λλ μμ±μ async μ΄νΈλ¦¬λ·°νΈμ΄λ€.
(2) : DOMμ λμ μΌλ‘ μ‘°μν μ μλ DOM APIλ JavaScript μμ§μμ μ 곡νλ€.
(3) : μλ°μ€ν¬λ¦½νΈμ νμ±κ³Ό μ€ν μμλ λ°μ΄νΈμ½λ μμ± β ν ν¬λμ΄μ§ β νμ± μ΄λ€.