본문 바로가기

CS36

브라우저 살펴보기4 - 컴포지터가 사용자 입력을 받았을 때 기술글을 보고 정리하였음(https://d2.naver.com/helloworld/6204533)이 글은 사용자 입력(input)을 받았을 때 컴포지터가 어떻게 부드러운 상호작용이 이루어지게 하는지 알아보고 있음기술글이 2019년도에 작성된 글이기 때문에 현재와는 많이 다른점이 있을것이기에 이런 흐름으로 만들어졌다고 이해하고 현재와 다른점이 있다는것을 생각하면서 봐야함(크롬에 많은 버전 업데이트가 있었기 때문) 컴포지터가 사용자 입력을 받았을 때 ▶ 브라우저 관점에서 입력 이벤트 '입력 이벤트(input event)'라는 말을 들었을 때 입력란에서 일어나는 값 입력이나 마우스 클릭만 생각할 수 있음하지만 브라우저의 관점에서 입력이란 모든 사용자의 제스처를 의미마우스 휠을 스크롤하는 것도 입력 이벤트이고,.. 2024. 6. 5.
브라우저 살펴보기3 - 렌더러 프로세스의 내부동작 기술글을 보고 정리하였음(https://d2.naver.com/helloworld/5237120)이 글은 렌더러 프로세스가 HTML 문서를 받았을 때 어떤 절차를 거쳐 화면을 구성하는지 설명하고 있음기술글이 2019년도에 작성된 글이기 때문에 현재와는 많이 다른점이 있을것이기에 이런 흐름으로 만들어졌다고 이해하고 현재와 다른점이 있다는것을 생각하면서 봐야함(크롬에 많은 버전 업데이트가 있었기 때문) 렌더러 프로세스의 내부 동작 렌더러 프로세스는 여러 측면에서 웹 페이지의 성능에 영향을 끼침 ▶ 렌더러 프로세스는 웹 콘텐츠를 처리렌더러 프로세스는 탭 내부에서 발생하는 모든 작업을 담당렌더러 프로세스의 메인 스레드가 브라우저로 전송된 대부분의 코드를 처리간혹 웹 워커나 서비스 워커를 사용하는 경우에는 워커 .. 2024. 6. 4.
브라우저 살펴보기2 - 내비게이션 과정에서 일어나는 일 기술글을 보고 정리하였음(https://d2.naver.com/helloworld/2922312) 저번에 이어 웹 사이트를 표시하기 위해 각 프로세스와 스레드가 어떻게 통신하는지 좀 더 깊게 알아보고 있음 기술글이 2019년도에 작성된 글이기 때문에 현재에는 사용되지 않는 이벤트등이 기재되어있어 이런 흐름으로 페이지 이동을 한다고 생각하면 될듯 (크롬에 많은 버전 업데이트가 있었기 때문)내비게이션 과정에서 일어나는 일브라우저의 주소 표시줄에 URL을 입력하면 브라우저가 인터넷에서 데이터를 가져와서 페이지를 표시함이 동작에서 사용자가 사이트를 요청하고 브라우저가 페이지 렌더링을 준비하는 과정(= 내비게이션 = 사이트간의 이동)에 초점을 맞춰 살펴볼것임▶ 브라우저 프로세스에서 시작 브라우저 프로세스가 탭 영.. 2024. 6. 4.
브라우저 살펴보기 - CPU, GPU, 메모리 그리고 다중 프로세스 아키텍처 기술글을 보고 정리하였음(https://d2.naver.com/helloworld/2922312)Chrome을 중심으로 최신 브라우저를 들여다보며 웹페이지가 어떤 단계를 거쳐 화면에 그려지는지를 설명하고 있음기술글이 2019년도에 작성된 글이기 때문에 현재와는 많이 다른점이 있을것이기에 이런 흐름으로 만들어졌다고 이해하고 현재와 다른점이 있다는것을 생각하면서 봐야함(크롬에 많은 버전 업데이트가 있었기 때문)CPU, GPU, 메모리 그리고 다중 프로세스 아키텍처컴퓨터의 핵심은 CPU와 GPU브라우저가 실행되는 환경을 이해하려면 몇 가지 컴퓨터 부품과 그 기능을 이해해야 함▶ CPU CPU (central processing unit, 중앙처리장치)는 컴퓨터의 두뇌라 할 수 있음CPU 코어는 여러 종류의 작.. 2024. 6. 4.
브라우저 동작 오픈소스 렌더링 엔진의 소스코드를 분석하여 어떻게 브라우저가 동작하는지 파악한 이스라엘 개발자가 게시한 글을 번역한 기술글(https://d2.naver.com/helloworld/59361)을 공부하면서 작성한 글기술글이 2019년도에 작성된 글이기 때문에 내용이 옛날 내용이라는 댓글 발견(흐름은 그대로니 웹킷이나 파이어폭스가 어떻게 동작하는것보다 브라우저의 기본구조나 각 동작과정에 대해 이해하는 정도가 좋을듯!!)[ 브라우저의 주요 기능 ]브라우저의 주요 기능은 사용자가 선택한 자원을 서버에 요청하고 브러우저에 표시하는 것자원은 보통 HTML문서지만 PDF나 이미지 또는 다른 형태일 수 있음. 자원의 주소는 URI에 의해 정해짐 브라우저는 HTML과 CSS 명세에 따라 HTML 파일을 해석해서 표시하.. 2024. 6. 3.
애자일(Agile) 방법론과 TDD & Scrum [ 애자일(Agile) 방법론 ] 소프트웨어 개발 방식의 하나로, 작업 계획을 짧은 단위로 세우고 제품을 만들고 고쳐 나가는 사이클을 반복함으로써 고객의 요구 변화에 유연하고 신속하게 대응하는 개발 방법론쉽게 말하면, 일정한 주기를 가지고 빠르게 제품을 출시하여 고객의 요구사항, 변화된 환경에 맞게 요구를 더하고 수정해나가는 탄력적인 방법론 Agile는 기민한, 날렵한이라는 뜻으로 좋은 것을 빠르게 취하고 유연하고 효율적으로 개발할 수 있도록 만드는 다양한 방법론을 통칭해 일컫는 말임애자일 프레임 워크애자일 방법론을 따르는 개발 기법ex) Scrum, kanban, XP(eXtreme Programming) 등등 애자일은 어떠한 규정이나 툴이 아니며 개발 업무는 어떤 방식으로 진행되는 것이 좋은지에 대한.. 2024. 4. 12.
메모리 관리 [ 메모리 관리 ]  각각의 프로세스는 독립된 메모리 공간을 갖고, 운영체제 혹은 다른 프로세스의 메모리 공간에 접근할 수 없는 제한이 걸려있음. 단지, 운영체제 만이 운영체제 메모리 영역과 사용자 메모리 영역의 접근에 제약을 받지 않기 때문에 운영체제에서 메모리를 관함. 또한, 멀티프로그래밍 환경으로 변화하면서 한정된 메모리를 효율적으로 사용해야 했고, 운영체제가 이를 어떻게 관리하는지에 대한 관리방법이 중요해짐 즉, 어떤 프로그램이든 프로세스가 되어 프로세서에 적재되기 위해서는 메모리에 적재되어야 실행이 가능함따라서 메모리는 중요한 작업 공간이고 한정된 메모리를 다중 프로그래밍 환경에서 이용하기 위해서는 여러 프로세스가 함께 메모리를 사용하므로 효율적인 관리를 해야함 이러한 메모리 관리를 위해 메모리.. 2024. 3. 10.
CPU, 메모리 개념 [ CPU ]CPU는 각종 연산을 수행하고 기억장치에 기억되어 있는 명령어들을 수행하는 컴퓨터 시스템을 이루는 핵심 부품즉, CPU는 컴퓨터의 두뇌로 메모리에 저장된 명령어를 읽어 들이고, 읽어 들인 명령어를 해석하고 실행하는 부품 ▶ CPU 구조내부 구성은 크게 산술/논리 연상 장치(ALU), 제어 장치와 레지스터로 구성되어 있음 산술논리 장치(Arithmetic Logic Unit, ALU)쉽게 말해 계산기로 가산기, 보수기, 누산기, 기억레지스터, 데이터 레지스터 등으로 구성캐시나 메모리로 부터 읽어 온 데이터는 레지스터에 저장숫자의 산술연산과 배타적 논리합, 논리곱 같은 논리연산을 계산을 담당하는 장치배타적 논리합 - true 연산, 배타적 논리곱 - and 연산레지스터(Register)CPU가 .. 2024. 3. 2.
Socket [ Socket ] 소켓(Socket)은 TCP/IP 기반 네트워크 통신에서 데이터 송수신의 마지막 접점. 즉 네트워크 상에서 돌아가는 두 개의 프로그램 간 양방향 통신의 하나의 엔드 포인트 - 엔드포인트 아이피 주소와 포트 번호의 조합을 의미. 모든 TCP 연결은 2개의 엔드 포인트로 유일하게 식별되어질 수 있음 따라서 클라이언트와 서버 간 여러 개의 연결이 맺어질 수 있음 소켓은 클라이언트 소켓과 서버 소켓으로 구분되며, 소켓간 통신을 위해서는 네트워크상에서 클라이언트와 서버에 해당되는 컴퓨터를 식별하기 위한 IP주소와 해당 컴퓨터내에서 현재 통신에 사용되는 응용프로그램을 식별하기 위한 포트번호가 사용됨 소켓통신은 이러한 소켓을 통해 서버-클라이언트간 데이터를 주고받는 양방향 연결 지향성 통신을 말함.. 2024. 2. 4.

티스토리툴바