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

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

 pnpm이란? (Performent Node Package Manager

pnpm이란 한마디로 표현하면 "빠르고 효율적인 javscript 패키지 매니저"라고 할 수 있습니다.

 pnpm 설치방법

아래와 같이 터미널에서 npm 명령어를 통해 pnpm을 설치할 수 있습니다.

npm install -g pnpm

npm 설치방법법은 https://nodejs.org/ 에서 설치파일을 다운 받아 nodejs를 설치하면 같이 설치됩니다.
자세한 내용은 https://devscb.tistory.com/53 를 참고할 수 있습니다.

 pnpm 사용방법

대표적인 명령어들은 다음과 같은 명령어를 통해 pnpm을 사용할 수 있습니다.

pnpm install #의존성 패키지 인스톨
pnpm add  #패키지 추가
pnpm  # 명령어 실행

npm과 비교하면 다음과 같습니다.

 

 

pnpm 명령어	npm 명령어
pnpm install	npm install
pnpm add [패키지명]	npm i [패키지명]
pnpm [커맨드명]	npm run [커맨드명]

 

 pnpm사용이유, pnpm 특징

pnpm을 사용하는 가장 큰 이유는 빠르고, 효율적인 디스크 사용이 가능하기 때문입니다.
각 내용에 대한 상세 내용은 아래에서 설명하겠습니다.
그 외에도 모노레포 지원 등 여러 장점이 있긴 하지만, 가장 큰 장점에 대해서만 설명해보겠습니다.

 pnpm특징 - 빠르다 : pnpm 속도 비교, benchmark, 벤치마크

pnpm 공식 github 레포에 따르면, pnpm은 다른 javascript 패키지매니저에 비해 최대 2배이상 빠릅니다.
( https://github.com/pnpm/pnpm )
아래는 공식 repo에 게시된 속도입니다.
각 명령어들을 처리하는 속도를 비교한 그래프로, 가로축은 실행시간을 의미합니다.
(짧을수록 빠름)

왜 이렇게 빠르냐면, 아래 그림과 같이 각 dependency마다 설치가 병렬적으로 수행되기 때문입니다.

npm 같은 경우, 모든 dependency를 resolve를 하고,
모든 패키지가 resolve되어야 fetch가 되고,
또 모든 패키지가 fetch 되어야 disk에 write되는 구조입니다.
하나의 패키지라도 처리되는 속도가 느려진다면 전체 속도도 크게 떨어지게 되겠지요.

이를 그림으로 표현하면 아래와 같습니다.

 pnpm특징 - 효율적인 디스크 사용.

npm/yarn 과 비교했을때, pnpm은 node_modules 폴더의 패키지는 중복으로 저장되지 않습니다
효율적인 디스크사용이 pnpm의 성능에도 크게 도움을 줍니다.
예를 들어 sample_1, sample_2, sample_n라는 프로젝트가 있다고 하고,
각 프로젝트가 pkg_1을 포함하고 있다고 합시다. pkg_1의 크기가 2MB라고 할때,
npm이나 yarn 의 경우는 아래와 같이 각 프로젝트별로 node_modules 폴더 안에 pkg_1을 포함하기에 총 6MB의 디스크를 차지하게 됩니다.

@startuml

package sample_1{
 package "node_modules" as n1{
    component "pkg_1(2MB)" as a
 }
}

package sample_2{
 package "node_modules" as n2{
    component "pkg_1(2MB)" as b
 }
}

package sample_n{
 package "node_modules" as n3{
    component "pkg_1(2MB)" as c
 }
}

sample_1 -[hidden]r-> sample_2

sample_2 -[hidden]r-> sample_n : ...

center footer https://devscb.tistory.com

@enduml

반면, pnpm의 경우엔 별도의 저장소가 있고,(.pnpm_store)
각 프로젝트에서는 pkg_1에 대한 바로가기를 만듭니다. (엄밀히 표현하면 심볼릭링크, symbolic link)
따라서 4MB(2MB*2)의 크기만큼 중복된 저장공간을 효율화 할 수 있습니다.
프로젝트가 많을수록 이 효과는 더욱 커지게 됩니다.

@startuml

package sample_1{
    package "node_modules" as n1{
    component "pkg_1(바로가기)" as a
    }
}

package sample_2{
    package "node_modules" as n2{
    component "pkg_1(바로가기)" as b
    }
}

package sample_n{
    package "node_modules" as n3{
    component "pkg_1(바로가기)" as c
    }
}

package .pnpm_store{
    package "node_modules" as n4{
        component "pkg_1(2MB)" as d
    }
}

a -> d
b -> d
c -> d

sample_1 -[hidden]r-> sample_2

sample_2 -[hidden]r-> sample_n : ...
sample_2 -[hidden]d-> .pnpm_store
center footer https://devscb.tistory.com

@enduml

 총평

front end쪽 개발은 사이드로 하고 있어서, 어떤 변화가 있는지 잘 못 따라 잡았는데,
최근에 우연히, 운좋게 pnpm을 알게 되었습니다.
한번 실제로 써보니 확실히 더 빠르게 프로젝트를 셋업할 수 있었습니다.
그리고 항상 node_modules 폴더 크기가 너무커서 불필요 프로젝트를 삭제할때마다 시간이 오래걸렸는데,
이 부분도 크게 향상되어서 만족스러웠습니다.
앞으로는 npm이나 yarn 을 쓰지 않고 pnpm을 쓰도록 해야겠습니다.

#pnpm,#node,#package,#manager,#javascript,#자바스크립트,#노드,#패키지,#매니저,#패키지매니저

https://devscb.com/post/135

Javascript package manager pnpm, what is pnpm?, reasons to use pnpm, how to install pnpm, how to use pnpm