2024.01.22 TIL , 브라우저 동작 원리 / Socket 3

브라우저의 동작 원리

Node.js의 등장으로

자바스크립트는 웹 브라우저를 벗어나

서버 사이드 애플리케이션 개발에서도

사용되는 범용 개발 언어가 되었다.

 

그래도 가장 많이 사용 되는 분야는 웹 브라우저 환경이다.

웹페이지/애플리케이션 이다.

 

대부분의 프로그램 언어는 운영체제 위에서 실행 되지만,

웹 애플리케이션의 자바스크립트는 브라우저에서

HTML, CSS 와 함께 실행 된다.

 

핵심 기능은

사용자가 참조하고자 하는 웹페이지를 서버에 요청하고

서버의 응답을 받아 브라우저에 표시하는 것이다.

 

브라우저는 서버로부터 HTML, CSS, Javascript

이미지 파일 등을 응답 받는다.

 

HTML, CSS 파일은 렌더링 엔진의 HTML 파서와 

CSS 파서에 의해 파싱되어 DOM, CSSOM 트리로 변환되고

렌더 트리로 결합된다.

https://poiemaweb.com/js-browser

Javascript Environment | PoiemaWeb

 

 

 

브라우저는 이런 기본 구조를 가진다.

 

사용자 인터페이스,

브라우저 엔진,

렌더링 엔진,

통신,

UI 백엔드,

JS 인터프리터,

데이터 저장

 

https://blog.haeyum.me/cs/web/frontend/Browser/

[Web] 브라우저의 작동 원리

---

2. Socket 3

 

계속해서 소켓 시리즈.

socket.io 를 쓸 때는 http 모듈과 express 모듈을 혼합 사용한다.

 

commonJS
const httpServer = require("http").createServer();
const io = require("socket.io")(httpServer, {

ES6
import { createServer } from "http";
import { Server } from "socket.io";

const httpServer = createServer();
const io = new Server(httpServer, {