목록2024/02 (5)
hmk run dev
Process OS가 관리하는 단위, 프로그램 실행의 단위 프로세스라는 것은 기본적으로 연산할 작업을 뜻하기도 한다. 동시에 여러개의 프로세스가 실행된다면 이를 멀티프로세싱이라고 한다. Thread 프로세스가 하나가 있다면 그안에 스레드는 최소 1개 이상이 있다. 스레드는 프로세스 내의 하나의 실행 흐름, 코드 실행의 흐름이라고 봐도 무방하다. 한 프로세스 내부에 스레드는 N개가 될 수 있다. 이를 멀티 스레딩 이라고 하는데 스레드들은 동시에 그리고 각자 작동한다. Virtual Memory 하드웨어 수준에서 CPU 같은 전산자원이 존재하고 CPU에 코어가 4개가 있다고 가정해보자, 연산들은 주로 CPU와 RAM(1차 메모리)을 사용해서 처리된다. 어떤 프로세스가 존재한다면, 프로세스 내부엔 여러 연산 ..
성능 측정 & 개선이 필요한 이유 출처 - akamai 프론트엔드 성능 추상화 이미지 로딩 최적화 브라우저 기준 최적화의 문제점 사용자 기준 최적화 프리 렌더러 PWA 사례 이미지 스프라이트 브라우저 기준 최적화 브라우저 기준의 최적화는 보편적으로 Navigation Timing 모델에 따른 것이다. 왼쪽의 노란 부분이 리소스 타이밍 부분이며 tcp를 포함한 네트워킹을 하는 부분 사실 프론트가 리소스 타이밍에서 최적화할 부분은 크지않다. 신경써야 할 부분은 processing & load Processing 렌더 트리 완성하고 js파싱까지 완료하는 작업 어떤것을 그릴 준비가 완료됨을 의미 Load 이미지 등의 리소스를 로드 하는 작업 유저는 빈 화면이 보이는 것을 원하지 않음 두 이벤트의 시점을 앞당기고..
CommonJS: - 파일 시스템에서 파일을 로드한다. - 파일을 불러오는 동안 주 스레드를 차단한다. - 그렇기에 파일 로드 - 구문 분석 - 인스턴스화 - 평가가 각 파일마다 바로 실행된다. - 그렇기에 모듈 지정자에 변수를 넣을 수 있다. - export 객체에 값을 복사해서 넣는다. - 장점 널리 지원되는 표준: Node.js에서 기본적으로 사용되는 모듈 시스템이기 때문에 Node.js 환경에서는 자연스럽게 사용됩니다. 동기적 로딩: CommonJS는 동기적으로 모듈을 로딩하기 때문에, 런타임에서 모듈이 필요한 시점에 동기적으로 로딩할 수 있습니다. - 단점 1. 파일 시스템에서 파일을 로드한다. 2. 비동기적 로딩의 부재: 브라우저 환경에서는 비동기적으로 모듈을 로딩할 수 있는 ESM과는 달리,..
client와 server가 통신을 한다고 가정해보자 그리고 client가 server에 file하나를 요청한 상황 Server 소켓과 서버 서버에서 어떤 프로그램이 작동을 하고 있다. 서버에는 socket이 하나 열려있는 상태 그리고 해당 socket으로 통신을 할 예정 소켓의 본질은 파일 서버는 프로세스 프로세스가 파일에 할 수 있는 오퍼레이션은 기본적으로 RWX(Read, Write, Execute) 읽는다, 쓴다라는 개념은 소켓통신인 경우에 조금 다른 개념을 뜻한다. 읽는다는, Receive 쓴다는, Send 즉, 서버 프로세스가 소켓에다 대고 I/O를 한다고 할 수 있다. 파일 처리 기본적으로 서버는 HDD에 파일을 저장하고 있을 것이다. 그리고 파일은 파일 시스템에 의해 관리되고 있을 것인데..
네이버 이미지 검색이 어떻게 동작하는지 살펴보다 내부적으로 특정 hashkey를 생성 후 header에 넣어서 이미지 검색을 요청하는 듯해 보였다. 특별히 네트워크 요청을 날리는 것 같아 보이지 않아 fe 측에서 만들어주는 키라고 판단이 되어 이벤트핸들러를 찾아내, 개발자 도구 디버깅 툴로 hashkey를 만드는 로직을 찾아낸 방법을 기록해 봅니다. 일단 네이버 이미지 검색은 이미지의 영역을 지정해 특정 api를 호출해 지정된 영역의 이미지데이터를 이용해 검색이 이뤄지는데, 아마 내부적으로 이미지의 특정 부분이 중요하다고 판단하는 내부 알고리즘이 있는 것 같다. 일단 이 포스트는 웹 디버깅에 대해 포스트 하는 내용이니까, 각설하고 이미지 검색 api는 영역지정 부분의 영역을 재지정할 때 호출한다! 즉, ..