CS TIL

이재하·2023년 10월 26일
0

항해99

목록 보기
46/48
post-thumbnail
post-custom-banner

브라우저의 작동 방식

  1. 주소 입력: 사용자가 브라우저의 주소창에 URL을 입력합니다.
  2. DNS 조회: 주어진 도메인 이름이 IP 주소로 변환됩니다. 만약 브라우저 캐시에 해당 도메인에 대한 IP가 저장되어 있다면 DNS 조회를 건너뛸 수 있습니다.
  3. TCP 연결: 브라우저는 서버의 IP 주소로 TCP 연결을 설정합니다.
  4. HTTP 요청: 브라우저는 요청된 리소스에 대한 HTTP 요청을 서버에 전송합니다.
  5. 서버 응답: 서버는 요청된 리소스와 함께 HTTP 응답을 반환합니다.
  6. 렌더링: 브라우저는 HTML 응답을 파싱하고 렌더링 과정을 시작합니다.
    • DOM 생성: HTML 문서를 파싱하여 Document Object Model (DOM) 트리를 생성합니다.
    • CSSOM 생성: 외부 CSS 파일 및 인라인 스타일을 파싱하여 CSS Object Model (CSSOM) 트리를 생성합니다.
    • 렌더 트리 생성: DOM 및 CSSOM을 결합하여 렌더 트리를 생성합니다.
    • 레이아웃: 각 요소의 크기와 위치를 계산합니다.
    • 페인트: 렌더링된 요소를 화면에 그립니다.
  7. 자바스크립트 실행: 외부 JavaScript 파일과 인라인 스크립트가 실행됩니다. JavaScript는 DOM 및 CSSOM을 수정할 수 있으므로 렌더링 과정에 영향을 미칠 수 있습니다.
  8. 리소스 로딩: 브라우저는 이미지, CSS 파일, JavaScript 파일 등의 추가 리소스를 요청하고 로드합니다.

쿠키와 세션

쿠키 (Cookie):

  • 쿠키는 클라이언트(브라우저)에 저장되는 작은 텍스트 파일입니다.
  • 이름, 값, 만료 날짜, 경로, 도메인 등의 정보를 포함할 수 있습니다.
  • 사용자가 웹 사이트를 방문할 때마다 서버에 전송되어 사용자 식별, 세션 트래킹, 정보 저장 등의 용도로 사용됩니다.

세션 (Session):

  • 세션은 서버 측에서 유지되는 사용자 정보 저장소입니다.
  • 사용자 별로 고유한 세션 ID가 생성되고, 이 ID는 쿠키를 통해 클라이언트에 저장됩니다.
  • 서버는 이 세션 ID를 사용하여 사용자의 세션 데이터에 액세스합니다.

쿠키와 세션의 차이점:

  1. 저장 위치: 쿠키는 클라이언트에, 세션은 서버에 저장됩니다.
  2. 보안: 쿠키는 클라이언트에 저장되기 때문에 상대적으로 취약할 수 있습니다. 반면, 세션은 서버에 저장되므로 더 안전합니다.
  3. 생명주기: 쿠키는 만료 날짜를 설정할 수 있습니다. 만료 날짜가 지나면 삭제됩니다. 세션은 사용자가 브라우저를 종료할 때 일반적으로 종료됩니다 (하지만 세션 타임아웃 설정으로 변경할 수 있습니다).
  4. 데이터 크기: 쿠키는 데이터 크기에 제한이 있습니다 (일반적으로 4KB). 세션은 서버의 메모리나 디스크에 저장되므로 더 큰 데이터를 저장할 수 있습니다.

간단히 말하면, 쿠키는 브라우저에 저장되는 작은 데이터 조각이며, 세션은 서버에 저장되는 사용자 정보입니다.

post-custom-banner

0개의 댓글