자바스크립트 패키지 매니저, PNPM 란?

목차

· PNPM이란?

· PNPM을 사용하는 이유, 그리고 특징

  · 중첩된 패키지는 단 한번만 설치한다, 저장 공간의 효율성을 제공해준다.

  · 타 패키지 매니저에 비해 좋은 성능(속도)를 가지고 있다.

· PNPM 설치 방법

· PNPM 사용기

---

PNPM이란?

PNPM이란 2017년에 npm과 yarn의 비효율을 개선한 빠르고 효율적인 자바스크립트 패키징 매니저이다.

여기서 비효율이란, npm으로 여러 프로젝트를 관리하다보면 각 프로젝트마다 모두 같은 의존성을 사용하는 경우가 있다. 이때, 모두 같은 의존성을 사용하기 때문에 이는 중복을 의미한다. 이를 테면 react 프로젝트 100개가 로컬에 있을 수 있다. 이때, npm이나 yarn으로는 100개의 프로젝트 모두 node_modules 디렉토리에 각각 리액트 라이브러리를 모두 설치한다. 결과적으로 로컬 하드 디스크에는 실질적으로 똑같은 파일이 100 중복이 발생하며 설치되는 것이다.

PNPM을 사용하는 이유, 그리고 특징

위에서 짧게 언급을 한 것처럼 PNPM을 사용하는 가장 큰 이유는 빠르고, 효율적인 디스크 사용이 가능하며 그 외에도 모노레포 지원 등 여러 장점을 가지고 있다.

[1] 중첩된 패키지는 단 한번만 설치한다, 저장 공간의 효율성을 제공해준다.

PNPM은 홈 디렉토리의 글로벌 저장소인 `~/.pnpm-store`에 모든 패키지를 저장하는 저장소를 두고, 중첩된 패키지는 단 한번만 설치한다.

content addressable file store 방식
: 단순하게 파일 이름으로 해당 파일을 접근하는 것이 아니라, 각각의 의존성 파일에 hash id를 부여하고 관리한다. 이 과정에서 중복되는 패키지는 동일한 hash id를 얻게 된다.

필요한 프로젝트마다 이 주소를 이용하여 node_modules 폴더에 symbolic(sym) link를 만들어 연결해준다.

예를 들어 lodash를 사용하는 패키지 100개가 있다고 가정을 했을 때, npm 또는 yarn을 사용할 경우, 각 폴더별로 lodash 패키지가 100개가 복사된다. 반면에 pnpm은 lodash를 단 한번만 설치하고, 다른 100개의 프로젝트에는 위에서 언급한 심링크(sym link)로 연결하여 용량 측면에서 효율적으로 패키지를 관리한다.

만약 특정 프로젝트만 다른 버전의 라이브러리를 사용하는 경우에는 저장소에 있는 라이브러리가 업데이트 되는 것이 아닌, 다른 버전의 라이브러리만 새롭게 추가되어 다른 프로젝트가 버전 호환에 있어 문제가 생기지 않도록 해준다.

[2] 타 패키지 매니저에 비해 좋은 성능(속도)를 가지고 있다.

PNPM 공식 레포지토리에 의하면 PNPM은 다른 자바스크립트 패키지 매니저에 비해 최대 2배 이상 빠르다고 한다. 

이렇게 빠른 이유는, 각 의존성 설치가 병렬적으로 이루어지기 때문이다. NPM 같은 경우 모든 의존성을 resolve하고, 모든 패키지가 resolve되어야 fetch 되고, 또 모든 패키지가 fetch 되어야 disk에 쓰여지는 구조이다. 하나의 패키지라도 처리되는 속도가 느려진다면 전체 속도도 느려지기 때문이다.

 

위의 장점들을 정리하자면, 아래와 같이 정리를 할 수 있다.

1) 불필요한 I/O 과정을 없애고, 빠르고 효율적이다.
2) 패키지 중복 설치를 하지 않음으로서 사용 용량이 적다.
3) NPM과 사용방법이 그리 크게 차이 나지 않는다.
4) packge.json 에 peer dependency를 명시하지 않으면 모노레포를 사용할 수 없는 PNPM 만의 엄격함을 갖고 있다.

PNPM 설치 방법

다른 여타 패키지 매니저들과 설치 방법과 커맨드들은 정말 간단하다. PNPM 공식 사이트에서도 정말 편하게 관련 내용들을 알려주고 있는데, 영문이 많은 페이지 치고 정말 직관적으로 알려주고 있기 때문에 NPM에서 PNPM으로 마이그레이션을 진행했을 때 정말 도움이 많이 되었다. 그 중 많이 사용하는 커맨드들을 살펴보자면 아래와 같다.

$ pnpm install // 전체 설치

$ pnpm add <pkg> : pkg(패키지) 설치

$ pnpm <cmd> // ex) pnpm start, pnpm dev .. etc

PNPM 사용기

회사에서 NPM 라이브러리를 개발 이슈를 맡아 진행을 하고 있다. 프로젝트를 빠르고 가볍게 사용하고자 성능에 대한 부분들을 많이 찾아보고 있던 도중, 사이드 프로젝트에서 PNPM을 우연히 마주쳐 이번 기회에 PNPM으로 마이그레이션을 진행해보았는데, webpack과 같이 사용을 하다보니 아직 무거운 프로젝트가 아니다 보니 가볍게 느껴지는 것이 사실이다. PNPM의 개념부터 차근차근 알아가보았고, 다음은 NPM 패키지 매니저에서 어떻게 PNPM으로 마이그레이션을 진행했는지에 대한 포스팅을 진행할 예정이다. 앞으로는 PNPM을 자주 한번 사용을 해보며 친숙해지려고 한다 =)

---

레퍼런스

pnpm CLI | pnpm

Javascript 패키지 매니저 pnpm, pnpm이란?, pnpm사용이유, pnpm 설치방법, pnpm 사용방법

 

[패키지 매니저] npm, yarn, pnpm, yarn-berry