본문 바로가기

게시판12

WebSocket 웹 소켓📡 웹소켓웹소켓은 클라이언트와 서버 간의 양방향 통신을 가능하게 하는 프로토콜이다  전통적인 HTTP 통신HTTP(Hypertext Transfer Protocol)는 클라이언트(ex. 웹 브라우저)가 서버에 요청(request)을 보내면 서버가 응답(response)을 보내는 방식으로 동작한다이 방식은 기본적으로 클라이언트가 먼저 요청을 보내야만 서버가 응답하는 단방향 방식이다 그렇기에 클라이언트가 서버로부터 데이터를 받으려면 먼저 요청을 보내야하므로,데이터를 실시간으로 받아야 하는 상황에서는 부적합하다빈번한 요청으로 인해 네트워크 트래픽이 증가되고 서버에게 부담이 된다실시간 통신에는 조금 느리고 비효율적인 것이다 SSE와 웹소켓SSE(Server-Send Events)는 서버가 클라이언트에게 단방향으로 .. 2024. 6. 16.
자바스크립트 Scope Scope (스코프: 유효범위)자바스크립트의 스코프는 변수가 어디서 접근 가능한지를 결정하고, 변수의 생성부터 소멸까지의 과정을 관리한다스코프는 변수 이름 충돌을 방지하고 메모리 관리를 자동화(메모리 절약)하여 개발자가 더 효율적으로 코드를 작성할 수 있도록 한다  스코프의 종류자바스크립트에는 세 가지 주요 스코프 유형이 있다전역 스코프 (Global Scope)함수 스코프 (Function Scope)블록 스코프 (Block Scope, ES6부터 도입) 전역 스코프 (Global Scope)전역 스코프는 코드 어디에서나 접근할 수 있는 변수를 정의하는 범위이다전역 변수는 페이지가 로드되면 생성되고, 페이지가 닫힐 때까지 존재한다 함수 스코프 (Function Scope)함수 스코프는 함수 내에서 정의.. 2024. 6. 16.
자바스크립트 주요 개념 자바스크립트는 웹 개발에서 필수적인 언어다HTML, CSS와 함께 사용되며, 웹 사이트의 대부분이 자바스크립트를 사용하여 웹 페이지의 동작을 제어한다 React와 같은 라이브러리, Vue와 같은 프레임워크는 자바스크립트 코드를 래핑하고 확장하여 그 기능을 극대화한다이러한 도구들은 근본적으로 자바스크립트를 기반으로 하며,상태 관리와 이벤트 처리 역시 자바스크립트의 원리에 기초한다 이러한 라이브러리나 프레임워크는 자바스크립트의 기본 개념을 확장하여,웹 애플리케이션을 더 효율적으로 개발할 수 있도록 돕는다  자바스크립트에서 Deep 하게 공부할 주제들은 다음과 같다 자바스크립트 주요 개념변수 (Variables) - var, let, const   자바스크립트에서 변수를 선언하는 방법은 var, let, co.. 2024. 6. 8.
프론트엔드 성능 최적화 웹 성능 최적화는 중요하다Why? 사용자 경험(UX) 향상 가입률, 전환율 향상 이탈율 감소→ 비즈니스 성과 ↑  웹 성능 최적화는 크게 2가지 측면(로딩 성능, 렌더링 성능)을 고려한다로딩 성능다운로드해야 하는 리소스 수 줄이기  불필요한 리소스 제거, 최소화  필요한 리소스만 선택적으로 로드리소스 크기 줄이기  이미지 파일 크기 줄이고 최적화된 포맷 사용  텍스트 파일을 압축하여 전송 크기 줄이기코드 분할  필요한 시점에만 로드될 수 있도록리소스 우선순위 설정  중요한 리소스를 먼저 다운로드하여 주요 콘텐츠 빠르게 접근렌더링 성능자바스크립트 코드의 효율성  잘 작성된 코드는 화면 렌더링 속도를 높이고 사용자 상호작용을 원활하게 만듦이미지 사이즈 최적화  이미지 파일 크기를 줄여 로드 시간을 단축코드 .. 2024. 6. 6.