본문 바로가기

전체 글72

JS33 - 11.JS engines Virtual Machine 가상 머신 가상머신: 주어진 컴퓨터 시스템의 가상 머신 또는 소프트웨어 구동 에뮬레이션 유형 Mac의 Parallels 프로세스 가상머신: 덜 기능적, 하나의 프로그램이나 프로세스만 실행할 수 있다. Windows의 Wine JS엔진은 JS 코드를 해석하고 실행하도록 특별히 설계된 프로세스 가상 머신의 일종이다. 웹 페이지를 구성하여 브라우저의 성능을 향상시키는 레이아웃 엔진과 코드를 해석하고 실행하는* 낮은 수준의 Javascript 엔진*을 구별하는 것이 중요하다. JS 엔진이란? 자바스크립트 코드를 마이크로프로세서가 이해할 수 있는 낮은 레벨 또는 기계 코드로 변환하는 프로그램입니다. 각 Javascript 엔진은 ECMAScript(스크립팅 언어 표준) 버전을 구현한다.. 2021. 6. 3.
JS33- 10.setTimeout, setInterval, requestAnimationFrame Scheduling 함수가 즉시 실행되지 않고 특정 시간에 실행되도록 결정하는 것. ( == scheduling a call) 둘 다 콜백이기 때문에 지연시간 0ms를 줘도 다른 기본 함수보다 늦게 실행됨 제로 타임 아웃 스케쥴링setTimeout (func, 0)(setTimeout (func)과 동일)은 “가능한 한 빨리, 그러나 현재 코드가 완료된 후에”호출을 스케쥴하는데 사용된다. 함수를 setInterval/setTimeout에 넘기면 내부 참조가 함수 안에 생기고 garbage collection을 회피함! CPU 자원 많이 먹는 수행을 setTimeout이용해서 분리시킬 수 있다. 모든 스케쥴링 방법은 정확한 지연을 보장하지 않는다. 브라우저 내부 타이머가 아래와 같은 이유로 느려질 수 있다.. 2021. 6. 2.
JS33 - 09.이벤트루프(Eventloop) 메시지 큐에 더 많은 메시지가 있는지 확인하는 루프 Javascript에서 비동기화를 허용하는 기본 모델 끊임없이 호출 스택이 비었는지에 대한 검사를 실행하는 프로세스(콜 스택이 비어 있으면 호출 대기 중인 함수가 있는지 확인한다.) 모든 요청마다 새 스레드가 생성되는 스레드 모델과 달리 단일 스레드에서 실행되므로 오버헤드가 발생하지 않는다. 특징 동시성(Concurrency) 자바스크립트 런타임은 한 번에 한 가지만 할 수 있고, 다른 코드를 실행하는 동안에는 Ajax 호출을 할 수 없으며, 다른 코드를 실행하는 동안에는 setTimeout 할 수 없지만 브라우저를 통해 이 모든 것을 할 수 있다. 브라우저를 사용하면 다른 코드를 실행하는 동안 Ajax 호출을 할 수 있으며 다른 코드를 실행하는 동안 .. 2021. 6. 2.
2021 정보처리기사 1회 합격 후기 및 공부법 공부법 공유 2020 수제비 정보처리기사 실기(1권+2권 합본세트) NCS 반영! 출제기준으로 전면개편한 교재이다. NCS 기반 반영 문제(예상문제 340제, 단원종합문제 360제, 모의고사 100제, 2020년기출문제)를 수록하였다. 수제비는 합격만을 위한 다양한 학습 콘텐츠 www.yes24.com 교재: 2020 수제비 정보처리기사 필기 + 실기 이 교재를 선택한 이유는 다음과 같다. 필기와 실기 합본으로 교재 간 내용에 일관성이 있다. 개정된 정보처리기사, NCS가 반영된 2020년 교재다. 활발하게 운영되고 있는 수제비 네이버 카페에서 지속적으로 예상문제를 풀고, 질의응답이 가능하다. 현재 2020년 데이터를 추가한 2021년판이 출시되었으니, 만약 구매한다면 최신판을 구매하면 좋을 것 같다. .. 2021. 6. 2.
렌더링과 Virtual DOM 1. 렌더링 과정 1. DOM(Document Object Model), CSSOM(CSS Object Model) 생성 가장 첫번째 단계는 서버로부터 받은 HTML, CSS를 다운로드 받습니다. 그리고 HTML, CSS파일은 단순한 텍스트이므로 연산과 관리가 유리하도록 Object Model로 만들게 됩니다. HTML CSS 파일은 각각 DOM Tree와 CSSOM으로 만들어집니다. DOM(좌) CSSOM(우)을 시각화 한 그림 - 출처 : http://bit.ly/3137pmh 각 문서(HTML, CSS)가 어떻게 파싱되고 어떻게 DOM Tree가 되는지 자세한 과정은 Google 개발자 문서를 통해 확인할 수 있습니다. 여기서 좀더 TMI를 추가하자면 렌더링 엔진은 더 나은 사용자경험을 위해 가능한.. 2021. 6. 2.
웹소켓(Web socket)이란? 1. 웹소켓이란? 웹소켓(WebSocket)은 하나의 TCP 접속에 전이중 통신 채널을 제공하는 컴퓨터 통신 프로토콜이다. Transport protocol의 일종, 웹 버전의 TCP 또는 Socket 서버와 클라이언트 간에 Socket Connection을 유지해서 언제든 양방향 통신 또는 데이터 전송이 가능하도록 하는 기술 Real-time web application구현을 위해 널리 사용되어지고 있다. (SNS어플리케이션, LoL같은 멀티플레이어 게임, 구글 Doc, 증권거래, 화상채팅 등) HTTP와 마찬가지로 OSI 제7계층에 속하며, 제4계층 TCP에 의존한다. 2. 사용하는 이유? 웹 어플리케이션에서 기존의 서버와 클라이언트 간의 통신은 대부분 HTTP를 통해 이루어 졌으며 HTTP는 Req.. 2021. 6. 2.