μΌ | μ | ν | μ | λͺ© | κΈ | ν |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
- jsx
- wai-aria
- νλ‘κ·Έλλ¨Έμ€
- git
- ν μ€νΈ μμ
- Effect Hook
- μ€ν μ΄μΈ μ½λ42κΈ°
- μ맨ν±μμ
- Study
- Cmarket
- React
- css animation
- fetch api
- WEB
- μ»΄ν¨ν° 곡ν
- μ μ΄μ½₯ λμ¨
- BFSμ DFS
- λ²λ€λ§
- props drilling
- μ€ν μ΄μΈ μ½λ
- Lifting state
- νΌν° λͺ¨λΉ
- prototype
- λ²μ§ λͺ¨ν
- κ³ μ°¨ν¨μ
- css
- html
- νΌν° λͺ¨λΉμ λ²μ§ λͺ¨ν
- JavaScript
- State
- Today
- Total
roqkf
[μ΅μ ν] Optimization λ³Έλ¬Έ
π μ΅μ ν(Optimization)
- μ£Όμ΄μ§ μν©μμ μνλ κ°μ₯ μλ§μ κ²°κ³Όλ₯Ό μ»μ μ μλλ‘ μ²λ¦¬νλ κ³Όμ
- μ΅μ νλ νμ©λ μμμ νκ³ λ΄μμ μ£Όμ΄μ§ μꡬμ¬νμ λ§μ‘±μν€λ©΄μ μ΅μ μ κ²°κ³Όλ₯Ό μ»λ κ³Όμ
-μμ΅κ³Ό κ΄λ ¨λλ λΆμΌμμλ μ΄μ΅μ μ΅λλ‘ λ΄λ κ³Όμ μ λ§νκΈ°λ νλ€. λ€μν λΆμΌμ λμ λ°λΌ λ€λ₯΄κ² μ μν μ μκ³ λ¬Όλ₯(logistics), μ€κ³(design) λ¬Έμ λ±μ μμ©λλ€.
λΆμΌμ λ°λΌμ μλ―Έκ° μ‘°κΈμ© λ¬λΌμ§κΈ΄ νμ§λ§, μ΅μ νλ λ³΄ν΅ μ£Όμ΄μ§ 쑰건μΌλ‘ μ΅λ ν¨μ¨μ λΌ μ μλλ‘ νλ κ²μ μλ―Ένλ€.
λ¬Όλ₯μ μ μλ‘ λ€μ΄λ³΄μ. λ¬Όλ₯μ μμλ μνμ νΉμ±, μΆλ°μ§μ λμ°©μ§μ μμΉ, μ΄μ‘ μλ¨μ μλ, μ΄μ‘ λΉμ©, λμ°©ν΄μΌ νλ κΈ°ν λ± κ³ λ €ν΄μΌ νλ μ¬λ¬ μ‘°κ±΄μ΄ μ‘΄μ¬νλ€. μ΄ μ‘°κ±΄λ€ μλμμ κ°λ₯ν μ μ λΉμ©μΌλ‘ μ ν΄μ§ μκ° λ΄μ μ΄μ‘μ΄ μλ£λ μ μλ μ΅μ μ λ΅μμ μ°Ύμκ°λ κ²μ λ¬Όλ₯ μ΅μ νλΌκ³ ν μ μλ€. κ°μ 물건μ΄λΌλ λμ°© κΈ°νμ΄ κΈΈλ€λ©΄ λλ €λ λΉμ©μ΄ μ λ ΄ν μ΄μ‘ μλ¨μ μ ννλ κ²μ΄, λμ°© κΈ°νμ΄ μ§§λ€λ©΄ λΉμΈλλΌλ κΈ°ν λ΄μ λμ°©ν μ μλ μ΄μ‘ μλ¨μ μ ννλ κ²μ΄ μ£Όμ΄μ§ μν©μμ κ°μ₯ ν¨μ¨μ μΈ, μ΅μ μ λ΅μμΌ κ²μ΄λ€.
μ»΄ν¨ν° 곡νμμμ μ΅μ νλ κ°λ₯ν μ μ 리μμ€λ₯Ό μλͺ¨νλ©΄μ κ°λ₯ν ν λΉ λ₯΄κ² μνλ κ²°κ³Όλ₯Ό μ»μ μ μλλ‘ νλ κ²μ μλ―Ένλ€. μκ³ λ¦¬μ¦ λ¬Έμ λ₯Ό νΈλ κ²μ μκ°νλ©΄ μ΄ν΄νκΈ° μ½λ€. μνλ κ²°κ³Όκ° λμ¨λ€λ©΄, λ©λͺ¨λ¦¬λ₯Ό μ‘°κΈμ΄λΌλ λ μλͺ¨νκ±°λ μ°μ° νμκ° ν λ²μ΄λΌλ λ μ μ μ½λκ° λ ν¨μ¨μ μ΄κ³ μ΅μ νλ μ½λμ΄λ€. λ μ μ λΉμ©, λ μ μ μκ°μ μλͺ¨νκΈ° λλ¬Έμ΄λ€. λ¬Όλ‘ μ»΄ν¨ν° μ±λ₯μ μ κ·Έλ μ΄λνλ©΄ κ°μ μ½λλ₯Ό μ¬μ©νλλΌλ λ λΉ λ₯΄κ² κ²°κ³Όλ₯Ό μ»μ μ μλ€. νμ§λ§ μκ³ λ¦¬μ¦ λ¬Έμ μ κ²°κ³Όλ₯Ό λΉ λ₯΄κ² νμΈνκΈ° μν΄ λΆνμ μ κ·Έλ μ΄λνλ κ²μ λΉμ©λ λ§μ΄ λ€κ³ , μ κ·Έλ μ΄λν μνμμλ μ΅μ νλμ§ μμ μ½λλ³΄λ€ μ΅μ νλ μ½λκ° λ λΉ λ₯Ό ν λ, κΈ°λ³Έμ μΌλ‘ λ ν¨μ¨μ μΈ μ½λλ₯Ό μμ±νκΈ° μν΄μ λ Έλ ₯νλ κ²μ΄ μ’λ€.
κ·Έλ λ€λ©΄ μΉ κ°λ°μμμ μ΅μ νλ 무μμ μλ―Έν κΉ?
μ£Όμ΄μ§ 쑰건 μλμμ μ΅λν λΉ λ₯΄κ² νλ©΄μ νμνλλ‘ λ§λλ κ²μ΄λ€.
π μ΅μ νμ νμμ± λ° ν¨κ³Ό
1. μ΄νλ₯ κ°μ
μΉ κ°λ°μμμ μ΅μ νλ νλ©΄μ μ΅λν λΉ λ₯Έ μλλ‘ νμνκ² νλ κ² μ΄λΌκ³ νλ€. μ΄λ μ΅μ νκ° μλμ§ μμ μΉ νμ΄μ§λ νλ©΄ λ‘λ©μ μκ°μ΄ κ±Έλ¦°λ€λ λ»μΌλ‘λ λ³Ό μ μλ€. νλ©΄μ λΆλ¬μ€λ μκ°μ΄ κΈΈμ΄μ§λ©΄ μ¬μ©μκ° νμ΄μ§λ₯Ό μ΄νν νλ₯ μ΄ λμμ§λ€. μ¬κΈ°μ μ΄ν μ΄λ λ°©λ¬Έμκ° μΉ μ¬μ΄νΈμ 첫 νμ΄μ§μμ μλ¬΄λ° μνΈμμ©λ νμ§ μκ³ μ’ λ£νλ κ²μ μλ―Ένλ€.
ꡬκΈμ μ‘°μ¬ κ²°κ³Όμ λ°λ₯΄λ©΄ νμ΄μ§ λ‘λκ° 3μ΄ μ΄μ 걸리면 53%μ μ¬μ©μκ° μ¬μ΄νΈλ₯Ό μ΄ννλ€κ³ νλ€. λν νμ΄μ§ λ‘λ μκ°μ΄ κΈΈμ΄μ§λ©΄ μ¬μ΄νΈ λ°©λ¬Έμκ° μ΄νλ₯ μ΄ νλ°μ μΌλ‘ μ¦κ°νλ€κ³ νλ€. νμ΄μ§ λ‘λ μλκ° 1μ΄μμ 3μ΄λ‘ λμ΄λλ©΄ μ΄νλ₯ μ 32%, 5μ΄λ‘ λμ΄λλ©΄ 90%, 6μ΄λ‘ λμ΄λλ©΄ 106%, 10μ΄λ‘ λμ΄λλ©΄ 123%κΉμ§ μ¦κ°νλ κ²μΌλ‘ λνλ¬λ€.
κ°κ° 2016λ λ, 2017λ λμ μ‘°μ¬ κ²°κ³ΌμΈ λ§νΌ νμ¬λ μΈν°λ· μλκ° λ λΉ¨λΌμ‘μ ν λ, μ¬λλ€μ μ‘°μ¬ κ²°κ³Όλ³΄λ€ λ λΉ λ₯΄κ² μ΄νν κ°λ₯μ±μ΄ λλ€. κ±°κΈ°λ€ μλλ₯Ό μ€μνλ νκ΅μ λ ν° νμΌλ‘ μ΄νλ₯ μ΄ μ¦κ°ν κ²μΌλ‘ μμν μ μλ€. μ΄μ¬ν λ§λ μΉ μ¬μ΄νΈκ° λ‘λ©μ΄ λ리λ€λ μ΄μ λ‘ μ¬μ©μκ° μ΄ννκ² λλ€λ©΄ μ λ§ μμν μΌμ΄λ€. νμ§λ§ λ°λλ‘, μΉ μ¬μ΄νΈμ μ±λ₯ μ΅μ νλ₯Ό ν΅ν΄ νμ΄μ§ λ‘λ© μλλ₯Ό μ€μ΄λ©΄, μ¬μ©μμ μ΄νλ₯ μ ν¨κ³Όμ μΌλ‘ μ€μΌ μ μλ€λ μλ―Έμ΄κΈ°λ νλ€. μ¬κΈ°μ μ΅μ νμ νμμ±μ μΏλ³Ό μ μλ€.
2. μ νμ¨ μ¦κ°
μ΄νλ₯ μ΄ μ€μ΄λ€λ©΄, μ νμ¨μ΄ λμμ§ νλ₯ λ 컀μ§λ€. μ νμ¨ μ΄λ, μΉ μ¬μ΄νΈλ₯Ό λ°©λ¬Έν μ¬μ©μ μ€ νμκ°μ , μν ꡬ맀, κ²μκΈ μ‘°ν, λ€μ΄λ‘λ λ±μ νμλ₯Ό ν λ°©λ¬Έμμ λΉμ¨μ μλ―Ένλ€. λ무λ λΉμ°ν μ΄μΌκΈ°μ΄λ€. νλ©΄μ΄ λ‘λ©λλλΌ μ λλ‘ λ¨μ§λ μλ μνμμλ νμ κ°μ μ κ³ μ¬νκ³ λ²νΌ νλ ν΄λ¦νλ κ²λ λΆκ°λ₯νκΈ° λλ¬Έμ΄λ€. λ¬Όλ‘ νλ©΄μ΄ μ λλ‘ νμλλ€κ³ ν΄λ λ°©λ¬Έμλ₯Ό μ€μ μλΉμ€ μ΄μ©μλ‘ μ ννκ² νλ μΌμ μ΄λ €μ΄ μΌμ΄λ€. νμ§λ§ μ΄νν΄λ²λ¦° μ¬μ©μμ μ νμ¨μ 0%μ΄λ€. μ νμ¨μ λλ € μλΉμ€ μ¬μ©μλ₯Ό λ리기 μν΄μλ μ΄νλ₯ μ μ€μ¬μΌ νλ€.
3. μμ΅ μ¦λ
λΉ λ₯Έ μΉ μ¬μ΄νΈ λ‘λ© μλλ μμ΅ μ¦λκΉμ§ μ΄μ΄μ§ μ μλ€. μ΄νλ₯ κ°μ, μ νμ¨ μ¦κ°λ νΈλν½ μ¦λ λ° νμ μ μ¦κ°λ‘ μ΄μ΄μ§κ³ , μ΄λ κ³§ μμ΅ μ¦λλ₯Ό μλ―Ένλ€. μ€μ λ‘ λ‘λ© μλκ° 1μ΄ λΉ¨λΌμ‘μ λ μλ§μ‘΄ νλ§€λμ 1%, κ΅¬κΈ κ²μλμ 0.2%, μλ§νΈμ μ νμ¨μ 2% μ¦κ°νλ€κ³ νλ€. νΌμΌν°μ§λ‘ 보면 ν¬μ§ μμ 보μ΄μ§λ§, μ΄ μμΉλ₯Ό λμΌλ‘ νμ°νλ©΄ κ°κ° 68μ΅ λ¬λ¬, 4μ΅ 5μ²λ§ λ¬λ¬, 2μ΅ 4μ²400λ§ λ¬λ¬μ λ§€μΆ μ¦κ°λΌκ³ νλ€. 1μ΄ μ°¨μ΄λ‘ μ΄λ§μ΄λ§ν μμ΅μ΄ μλ€ κ°λ€ νλ κ²μ΄λ€. κΌ μλ§μ‘΄μ΄λ μλ§νΈμ²λΌ κ·λͺ¨κ° ν¬μ§ μμ μλΉμ€λΌλ, λ‘λ© μλμ μ°¨μ΄λ μ΄μ²λΌ μ μλ―Έν μμ΅ μ°¨μ΄λ₯Ό λΌ μ μλ€.
4. μ¬μ©μ κ²½ν(UX) ν₯μ
μ΅μ νλ ν¨κ³Όμ μΈ UX κ°μ μλ¨μ΄λ€. νμ΄μ§ λ‘λ©μ΄ λΉ λ₯Όμλ‘ UXλ ν₯μλκΈ° λλ¬Έμ μ΄λ―Έ νμ΄μ§ λ‘λ μλκ° λΉ λ₯Έ νΈμ΄λΌκ³ ν΄λ μ΅μ νλ₯Ό ν΅ν΄ UXκ° λμ± ν₯μν μ μλ€. λ§μ½ λ‘λ©μ΄ μ€λ 걸릴 κ²½μ°, μ€νΌλ, νλ‘κ·Έλ μ€ λ°, μ€μΌλ ν€κ³Ό κ°μ΄ λ‘λ© μ€μμ μλ €μ£Όλ UIλ₯Ό λ¨Όμ νμνμ¬ λ°©λ¬Έμκ° μ‘°κΈ λ μΈλ΄μ¬μ κ°κ³ κΈ°λ€λ¦¬κ² νλ λ°©λ²λ μλ€. νμ§λ§ μ΄λ¬ν λ°©λ²μ μ΅μ νλ₯Ό ν΅ν΄ νμ΄μ§ λ‘λ μλ μ체λ₯Ό μ΅λν λΉ λ₯΄κ² νλ κ²λ³΄λ€ UXμ μ’λ€κ³ λ³Ό μλ μλ€. λν λ°©λ¬Έμμ 체λ₯ μκ°μ΄ μ’ λ λμ΄λ λΏ, νμ΄μ§ λ‘λ μλκ° κ°μ λμ§ μλλ€λ©΄ μ΄νλ₯ κ°μ κΉμ§ μ΄μ΄μ§κΈ°λ μ΄λ ΅λ€. λ°λΌμ μ΄νλ₯ κ°μμ UX ν₯μ ν¨κ³Όλ₯Ό λμμ 보기 μν΄μλ μΉ μ¬μ΄νΈ μ±λ₯ μ΅μ νλ₯Ό μ§ννλ κ²μ΄ κ°μ₯ μ’λ€.
'π» Development > κΈ°λ‘' μΉ΄ν κ³ λ¦¬μ λ€λ₯Έ κΈ
[μ΅μ ν] μΊμ κ΄λ¦¬ (0) | 2023.03.09 |
---|---|
[μ΅μ ν] Optimization κΈ°λ² (0) | 2023.03.09 |
[Testing] TDD (0) | 2023.03.01 |
[API] GraphQL (0) | 2023.03.01 |
[μ»΄ν¨ν° 곡ν] κ°λΉμ§ 컬λ μ (0) | 2023.03.01 |