INP(Interaction to Next Paint)λ₯Ό μ΄ν΄νκ³ μ΅μ ν νκΈ°
Β
μ°λ¦¬κ° λλΆλΆμ μΉνμ΄μ§μμ 보λ΄λ μκ°μ 90%κ° νμ΄μ§ λ‘λ μ΄νλΌλ κ²μ μκ³ μμλμ? μ΄ μκ° λμ μ¬μ©μλ ν΄λ¦, ν, ν€λ³΄λ μ
λ ₯κ³Ό κ°μ μΌλ ¨μ μ‘μ
μ ν΅ν΄ μΉ μ¬μ΄νΈμ μνΈ μμ©ν©λλ€. μΉ μ¬μ΄νΈκ° μ΄λ¬ν μνΈ μμ©μ λλ¦¬κ² λ°μν μλ‘ μ¬μ©μκ° μΉ μ¬μ΄νΈμ λν΄ λΆμ μ μΈ μ¬μ©μ κ²½νμ ν κ°λ₯μ±μ΄ λμμ§λλ€.
Googleμ νμ΄μ§ μλ΅μ±(responsiveness)μ νκ°νκΈ° μν μλ‘μ΄ λ©νΈλ¦λ₯Ό λ§λλ λ° μλΉν μκ°μ ν¬μνμ΅λλ€. μ΄λ¬ν λ©νΈλ¦ μ€ νλλ FID(First Input Delay)μ
λλ€. FIDλ 첫 λ²μ§Έ μ μ μΈν°λμ
μ μ
λ ₯ μ§μ°μ μ‘μλ΄λ load responsiveness metric(λΆν μλ΅ λ©νΈλ¦)μ λ»ν©λλ€. κ·Έλ¬λ μ°λ¦¬λ μ μ μ 첫λ²μ§Έ μ‘μ
μ΄λ μ
λ ₯ μ§μ°λΏλ§ μλλΌ κ·Έ μ΄μμ μνλ§νλ μλ‘μ΄ μλ΅μ± μ§νκ° νμνλ€λ κ²μ μκ² λμμ΅λλ€.
μ 체 νμ΄μ§ μλ΅μ±μ μ’
ν©μ μΌλ‘ νκ°νκΈ° μν΄ μλ‘μ΄ INP(Interaction to Next Paint) λ©νΈλ¦μ λ§λ€μμ΅λλ€. INPλ λͺ¨λ νμ΄μ§ μνΈ μμ©μ μνλ§νλ©° μ
λ ₯ μ§μ°λ§ μΈ‘μ νλ κ²μ λμ΄μλλ€. μ΄ λ°νμμλ INPμ λν λͺ¨λ λ΄μ©, μλ λ°©μ, μ€μν μ΄μ , μΈ‘μ λ°©λ² λ° κ°μ λ°©λ²μ λν΄ μμλ΄
λλ€.
Β
μ λ λ―Έ μκ·Έλλ μΉ κ°λ°μμ΄μ μκ°μ
λλ€. κ·Έλ Responsible Javascript for A Book Apart (μ±
μκ°μλ μλ°μ€ν¬λ¦½νΈ νλ‘κ·Έλλ°)μ ν¬ν¨ν΄ μ¬λ¬ μ±
μ μ§ννμ΅λλ€. μ λ λ―Έλ μΈμ κ° λͺ¨λκ° μμ§ μκ°νλ λ²μ λ°°μ°μ§ μμ μΈλ΄ ν©μΌλ‘ μ΄μ¬ν μκ°μ΄λλλ€.
Β