Pace Check

• 학습 시 남과 비교할때, 그 상황을 잘 헤쳐나가는법 = 시간은 정직하다
  • 상대가 어떤 일을 나보다 뛰어나게 했다면 나는 그 일이 아닌 다른 일에선 내가 더 뛰어날것
  • 왜냐면 시간은 정직하기 때문 그는 A 에 시간을 쓴거고 나는 B 에 시간을 쓴 것

<aside> ⚠️ 실제 수업을 진행한 내용에서, 설명하며 이해를 돕기 위한 추가적인 내용들이 들어가있음

복습할때 심화 부분은 회색으로 표기하였으니 기본적으로 보지말고, 제대로 이해된자들만 볼 것

• 제대로 이해되지 않은 상태에서 심화 부분을 보면, 정말 쌓아올린 탑이 무너질 수 있음
  • 알아야할 개발 지식은 지수적(Exponential)으로 증가하는 경향이 있어서
  • 단순히 한줄뿐이라 하더라도, 한 단어뿐이더라도 새로 알아야할게 몇십개씩 생겨나기때문
• 정말 머리가 정말 아파질 수 있으니 제발 조심할 것 </aside>

0. 웹 성능 개선을 위한 HTTP Cache

웹 서버(혹은 WAS, 통칭)는 웹 브라우저 요청에 따라 그에 맞는 웹 페이지를 반환

• 웹의 본질은 요청을 보내고 응답을 받는것, 그 사이의 모든것
  • 응답 = HTTP Resource : 웹 페이지뿐만아니라 영상, 음성, 이미지 등 모두
• 웹의 성능은 요청을 보냈을때 응답을 가능한 빠르게 받는것 = 웹 페이지 로드 시간 단축
  • 웹 서버로부터 웹 페이지 로드 성능 개선 : SEO 를 위한 Performance Metrics
  • 웹 브라우저에서 웹 페이지 로드 성능 개선 : HTTP Cache

0.1. 매번 요청에 따른 웹 브라우저와 웹 서버의 부하

• 웹의 본질은 요청을 보내고 응답을 받는것, 그 사이의 모든것
  • 웹 브라우저 는 매번 웹 서버에게 요청해서 응답을 받아와야하고
  • 웹 서버 는 매번 웹 브라우저의 요청에 대해 응답을 만들고, 반환해야한다.
• 그래서, 웹 브라우저와 웹 서버는 너무 힘들다
  • 웹 브라우저 : 웹 페이지 로드 응답이 똑같다면, 웹 브라우저는 매번 웹 서버에게 받아올 필요가 없다.
    • 이전에 받았던 응답을 저장 후, 매번 요청할시 저장해놓은 응답을 재사용 반환하면 되지 않을까?
      1. HTTP Cache 중 Private (웹 브라우저 사이드 = 클라이언트 사이드)
  • 웹 서버 : 웹 페이지 로드 응답이 똑같다면, 웹 서버는 매번 웹 브라우저에게 만들어 반환할 필요가 없다.
    • 이전에 반환한 응답을 저장 후, 매번 요청받을시 저장해놓은 응답을 재사용 반환하면 되지 않을까?
      1. HTTP Cache 중 Shared (프록시 = CDN or Forward/Reverse Proxy)
      2. API Server 자체 Cache (서버 사이드 = Local or Global)

0.2. 웹 서버 부하 완화 및 웹 페이지 로드 성능 개선

0.2.1. 웹 브라우저 : 결과 “반환” 비용(시간, 네트워크)를 줄이자

웹 브라우저 캐시 흐름 : 캐시 후 0초 후 응답 = 네트워크 사용 X (0초) + 서버자원 사용 X (0초)

• 반복 : 웹 브라우저는 매번 똑같은 100MB 짜리 고양이 영상을 웹 서버로부터 받아온다.
  1. 네트워크 트래픽 및 비용 발생 문제
  2. 100MB 다운로드 완료까지 긴 대기시간 후에야 시청 가능 문제
• 이전에 받았던 100MB 짜리 고양이 영상을 재사용한다면?
  1. 네트워크 트래픽 및 비용 감소
  2. 100MB 다운로드 완료의 긴 대기시간 없이 바로 시청 가능 = 유저 경험 증진

0.2.2. 웹 서버 : 결과 “생성” 비용(노동, 자원)를 줄이자

웹 서버 캐시 흐름 : 캐시 후 3초 후 응답 = 네트워크 사용 O (3초) + 서버자원 사용 X (0초)