해당 포스트는 Puppeteer 에 대해 학습하기 위해 puppeteer 의 영어 문서를 토대로 부가적인 설명과 간단한 puppeteer의 사용 방법을 소개합니다. Puppeteer Puppeteer는 DevTools Protocol을 통해 Chrome 또는 Chromium을 제어하기 위한 API를 제공하는 node.js 라이브러리 입니다. 다양한 기능이 있지만 가장 큰 특징은 Headless로 실행될 수 있다는 점 입니다. puppeteer 문서에서 소개되는 대표적인 기능들은 아래와 같습니다. 1. SPA(Single-Page Application)를 크롤링하고 미리 렌더링된 컨텐츠 (SSR - Server Side Rendering)를 생성 할 수 있습니다. 2. 최신 자동 테스트 환경을 만듭니다. ..
rx를 사용하며 개발을 하면서 필요한 웬만한 기능들은 rx의 operator로 제공되고 있습니다. 따라서 이 operator 들만 잘 숙지하고 있으면 rx를 사용하며 기능이 부족하다 느끼는 경우는 거의 없을거라 생각합니다. 이번 포스팅에서는 수 많은 rxjs의 operator 중 가장 헷갈리는 map, flatMap, switchMap, concatMap, mergeMap에 대해 정리해보도록 하겠습니다. map map operator는 js의 array나 Java의 Stream과 같은 API를 사용해 보셨다면 이미 알고 있을거라 생각됩니다. map operator는 다른 API들과 동일하게 발생하는 요소들을 다른 값으로 변환해 줍니다. map operator는 아래 예제와 같이 발생하는 값을 다른 값으로..
최근 웹 프론트엔드에대해 더 깊게 학습하다보니 JavaScript 성능 최적화에도 관심을 가지게 되었습니다. 그 중 흥미롭게 공부한 내용을 정리하여 포스팅으로 작성하고자 합니다. 이번 포스팅은 JavaScript가 정적 타입 언어의 성능을 따라잡기 위해 필수적인 개념인 Hidden Class 에 대해 알아보도록 하겠습니다. Hidden Class 자바와 같은 정적 타입 언어의 경우 객체의 속성이 고정되어 있기 때문에 객체를 생성할때부터 메모리를 얼마나 할당해야 하는지 정확하게 파악할 수 있습니다. 따라서 객체의 속성을 저장하는 메모리를 연속되기 할당한 뒤 offset기반으로 빠르게 접근하여 사용할 수 있습니다. 하지만 JavaScript는 동적 타입 언어이기 때문에 객체를 생성할때에 메모리를 얼마나 할당..