Wah, pnpm, Anda Sungguh Pantas: Cara Menggunakannya pada Heroku

Jika anda seorang pembangun Node.js , maka anda sudah biasa dengan npm dan Yarn . Anda mungkin mempunyai pendapat yang kuat tentang menggunakan satu daripada yang lain. Selama bertahun-tahun, pembangun telah bergelut dengan kelebihan — dalam storan cakera dan masa bina — apabila bekerja dengan pengurus pakej Node.js, terutamanya npm .

Kemudian, bersama datang pnpm , pengurus pakej yang mengendalikan storan pakej secara berbeza, menjimatkan ruang pengguna dan mengurangkan masa binaan. Begini cara pnpm menerangkan perbezaannya :

“Apabila anda memasang pakej, kami menyimpannya di kedai global pada mesin anda, kemudian kami membuat pautan keras daripadanya dan bukannya menyalin. Untuk setiap versi modul, hanya ada satu salinan yang disimpan pada cakera. Apabila menggunakan npm atau benang contohnya, jika anda mempunyai 100 pakej menggunakan lodash, anda akan mempunyai 100 salinan lodash pada cakera. pnpm membolehkan anda menjimatkan gigabait ruang cakera!”

Tidak menghairankan bahawa pnpm semakin mendapat perhatian, dengan semakin ramai pembangun menjadikannya pengurus pakej pilihan mereka. Seiring dengan kadar penggunaan yang semakin meningkat itu, ramai pembangun yang menjalankan apl mereka pada Heroku (seperti saya) ingin melihat pnpm disokong.

Nasib baik, pnpm tersedia melalui Corepack , yang diedarkan dengan Node.js. Jadi, setakat Mei 2024, pnpm kini tersedia di Heroku !

Dalam siaran ini, kami akan membincangkan perkara yang diperlukan untuk bermula dengan pnpm di Heroku. Dan, kami juga akan mempamerkan beberapa faedah storan dan masa bina yang anda peroleh daripada menggunakannya.

Primer Pantas di pnpm

pnpm telah diwujudkan untuk menyelesaikan isu pengurus pakej Node.js yang telah lama wujud mengenai storan berlebihan dan ketidakcekapan dalam pengendalian pergantungan . npm dan Yarn menyalin kebergantungan ke dalam setiap projek node_modules . Sebaliknya, pnpm menyimpan semua pakej untuk semua projek dalam satu kedai global dan kemudian mencipta pautan keras ke pakej ini daripada menyalinnya. Apakah maksud ini?

Katakan kita mempunyai projek Node.js yang menggunakan lodash . Sememangnya, projek itu akan mempunyai folder node_modules , bersama-sama dengan subfolder yang dipanggil lodash , diisi dengan fail. Tepatnya, [email protected] mempunyai 639 fail dan subfolder lain dipanggil fp , dengan 415 fail lagi.

Itu lebih seribu fail untuk lodash sahaja!

Saya mencipta enam projek Node.js: dua dengan pnpm, dua dengan npm dan dua dengan Yarn. Setiap daripada mereka menggunakan lodash . Mari kita lihat maklumat untuk hanya satu daripada fail dalam folder kebergantungan lodash .

 ~/six-projects$ ls -i npm-foo/node_modules/lodash/lodash.js 14754214 -rw-rw-r-- 544098 npm-foo/node_modules/lodash/lodash.js ~/six-projects$ ls -i npm-bar/node_modules/lodash/lodash.js 14757384 -rw-rw-r-- 544098 npm-bar/node_modules/lodash/lodash.js ~/six-projects$ ls -i yarn-foo/node_modules/lodash/lodash.js 14760047 -rw-r--r-- 544098 yarn-foo/node_modules/lodash/lodash.js ~/six-projects$ ls -i yarn-bar/node_modules/lodash/lodash.js 14762739 -rw-r--r-- 544098 yarn-bar/node_modules/lodash/lodash.js ~/six-projects$ ls -i pnpm-foo/node_modules/lodash/lodash.js 15922696 -rw-rw-r-- 544098 pnpm-foo/node_modules/lodash/lodash.js ~/six-projects$ ls -i pnpm-bar/node_modules/lodash/lodash.js 15922696 -rw-rw-r-- 544098 pnpm-bar/node_modules/lodash/lodash.js

Fail lodash.js bersaiz lebih sedikit daripada setengah megabait. Kami tidak melihat pautan lembut, jadi pada pandangan pertama, nampaknya setiap projek mempunyai salinan fail ini sendiri. Walau bagaimanapun, itu sebenarnya tidak berlaku.

Saya menggunakan ls dengan bendera -i untuk memaparkan inod fail lodash.js . Anda boleh lihat dalam projek pnpm-foo dan pnpm-bar , kedua-dua fail mempunyai inode yang sama ( 15922696 ). Mereka menunjuk ke fail yang sama! Itu tidak berlaku untuk npm atau Yarn.

Jadi, jika anda mempunyai sedozen projek yang menggunakan npm atau Yarn, dan projek tersebut menggunakan lodash , maka anda akan mempunyai sedozen salinan berbeza lodash , bersama-sama dengan salinan daripada dependensi lain dalam projek yang sendiri menggunakan lodash . Dalam pnpm, setiap projek dan pergantungan yang memerlukan versi lodash khusus ini menunjuk kepada salinan global yang sama, tunggal.

Kod untuk [email protected] bersaiz kurang daripada 5 MB. Adakah anda lebih suka mempunyai 100 salinan berlebihan pada mesin anda, atau hanya satu salinan global?

Pada penghujung hari, pemasangan kebergantungan dengan pnpm adalah lebih pantas, memerlukan ruang cakera yang lebih sedikit dan sumber yang lebih sedikit. Untuk pembangun yang bekerja merentasi berbilang projek atau mengurus kebergantungan pada platform awan, pnpm menawarkan cara yang lebih ramping dan pantas untuk mengurus pakej. Ini menjadikan pnpm ideal untuk persekitaran penggunaan yang diperkemas seperti Heroku.

Adakah anda bersedia untuk mula menggunakannya? Mari kita lihat bagaimana.

Bermula Dengan pnpm

Berikut ialah versi Node.js yang kami gunakan pada mesin kami:

 $ node --version v20.18.0

Dayakan dan Gunakan pnpm

Seperti yang kami nyatakan di atas, Corepack disertakan dengan Node.js, jadi kami hanya perlu menggunakan corepack untuk mendayakan dan menggunakan pnpm. Kami mencipta folder untuk projek kami. Kemudian, kami menjalankan arahan ini:

 ~/project-pnpm$ corepack enable pnpm ~/project-pnpm$ corepack use pnpm@latest Installing [email protected] in the project... Already up to date Done in 494ms

Ini menjana fail package.json yang kelihatan seperti ini:

 { "packageManager": "[email protected]+sha512.22721b3a11f81661ae1ec68ce1a7b879425a1ca5b991c975b074ac220b187ce56c708fe5db69f4c962c989452eee76c82877f4ee80f474cebd61ee13461b6228" }

Ini juga menjana fail pnpm-lock.yaml .

Seterusnya, kami menambah kebergantungan pada projek kami. Untuk tujuan tunjuk cara, kami menyalin senarai dependencies dan devDependencies yang terdapat dalam fail package.json penanda aras ini pada GitHub . Sekarang, fail package.json kami kelihatan seperti ini:

 { "version": "0.0.1", "dependencies": { "animate.less": "^2.2.0", "autoprefixer": "^10.4.17", "babel-core": "^6.26.3", "babel-eslint": "^10.1.0", ... "webpack-split-by-path": "^2.0.0", "whatwg-fetch": "^3.6.20" }, "devDependencies": { "nan-as": "^1.6.1" }, "packageManager": "[email protected]+sha512.22721b3a11f81661ae1ec68ce1a7b879425a1ca5b991c975b074ac220b187ce56c708fe5db69f4c962c989452eee76c82877f4ee80f474cebd61ee13461b6228" }

Kemudian, kami memasang pakej.

 ~/project-pnpm$ pnpm install

Membandingkan Perintah Biasa

Penggunaan untuk pnpm agak serupa dengan npm atau benang, jadi ia harus intuitif. Di bawah ialah jadual yang membandingkan penggunaan berbeza untuk arahan biasa (diambil daripada siaran ini ).

Perbandingan Kelajuan Binaan Heroku

Memandangkan kami telah menunjukkan cara untuk menyediakan projek dan berjalan dengan pnpm (ia agak mudah, bukan?), kami ingin membandingkan masa binaan untuk pengurus pakej yang berbeza apabila berjalan pada Heroku. Kami menyediakan tiga projek dengan kebergantungan yang sama — menggunakan npm, Benang dan pnpm.

Mula-mula, kami log masuk ke Heroku CLI ( heroku login ).

Kemudian, kami mencipta aplikasi untuk projek. Kami akan menunjukkan langkah-langkah untuk projek npm.

 ~/project-npm$ heroku apps:create --stack heroku-24 npm-timing Creating ⬢ npm-timing... done, stack is heroku-24 https://npm-timing-5d4e30a1c656.herokuapp.com/ | https://git.heroku.com/npm-timing.git

Kami menemui pek binaan yang menambah cap masa pada langkah binaan dalam log Heroku supaya kami boleh mengira masa binaan sebenar untuk projek kami. Kami ingin menambahkan buildpack itu pada projek kami dan menjalankannya sebelum buildpack standard untuk Node.js . Kami melakukannya dengan dua arahan berikut:

 ~/project-npm$ heroku buildpacks:add \ --index=1 \ https://github.com/edmorley/heroku-buildpack-timestamps.git \ --app pnpm-timing ~/project-npm$ heroku buildpacks:add \ --index=2 heroku/nodejs \ --app npm-timing Buildpack added. Next release on npm-timing will use: 1. https://github.com/edmorley/heroku-buildpack-timestamps.git 2. heroku/nodejs Run git push heroku main to create a new release using these buildpacks.

Itu sahaja! Kemudian, kami menolak kod untuk projek yang diuruskan oleh npm kami.

 ~/project-npm$ git push heroku main ... remote: Updated 4 paths from 5af8e67 remote: Compressing source files... done. remote: Building source: remote: remote: -----> Building on the Heroku-24 stack remote: -----> Using buildpacks: remote: 1. https://github.com/edmorley/heroku-buildpack-timestamps.git remote: 2. heroku/nodejs remote: -----> Timestamp app detected remote: -----> Node.js app detected ... remote: 2024-10-22 22:31:29 -----> Installing dependencies remote: 2024-10-22 22:31:29 Installing node modules remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 added 1435 packages, and audited 1436 packages in 11s remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 184 packages are looking for funding remote: 2024-10-22 22:31:41 run `npm fund` for details remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 96 vulnerabilities (1 low, 38 moderate, 21 high, 36 critical) remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 To address issues that do not require attention, run: remote: 2024-10-22 22:31:41 npm audit fix remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 To address all issues possible (including breaking changes), run: remote: 2024-10-22 22:31:41 npm audit fix --force remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 Some issues need review, and may require choosing remote: 2024-10-22 22:31:41 a different dependency. remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 Run `npm audit` for details. remote: 2024-10-22 22:31:41 npm notice remote: 2024-10-22 22:31:41 npm notice New minor version of npm available! 10.8.2 -> 10.9.0 remote: 2024-10-22 22:31:41 npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.9.0 remote: 2024-10-22 22:31:41 npm notice To update run: npm install -g [email protected] remote: 2024-10-22 22:31:41 npm notice remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 -----> Build remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 -----> Caching build remote: 2024-10-22 22:31:41 - npm cache remote: 2024-10-22 22:31:41 remote: 2024-10-22 22:31:41 -----> Pruning devDependencies remote: 2024-10-22 22:31:44 remote: 2024-10-22 22:31:44 up to date, audited 1435 packages in 4s remote: 2024-10-22 22:31:44 remote: 2024-10-22 22:31:44 184 packages are looking for funding remote: 2024-10-22 22:31:44 run `npm fund` for details remote: 2024-10-22 22:31:45 remote: 2024-10-22 22:31:45 96 vulnerabilities (1 low, 38 moderate, 21 high, 36 critical) remote: 2024-10-22 22:31:45 remote: 2024-10-22 22:31:45 To address issues that do not require attention, run: remote: 2024-10-22 22:31:45 npm audit fix remote: 2024-10-22 22:31:45 remote: 2024-10-22 22:31:45 To address all issues possible (including breaking changes), run: remote: 2024-10-22 22:31:45 npm audit fix --force remote: 2024-10-22 22:31:45 remote: 2024-10-22 22:31:45 Some issues need review, and may require choosing remote: 2024-10-22 22:31:45 a different dependency. remote: 2024-10-22 22:31:45 remote: 2024-10-22 22:31:45 Run `npm audit` for details. remote: 2024-10-22 22:31:45 npm notice remote: 2024-10-22 22:31:45 npm notice New minor version of npm available! 10.8.2 -> 10.9.0 remote: 2024-10-22 22:31:45 npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.9.0 remote: 2024-10-22 22:31:45 npm notice To update run: npm install -g [email protected] remote: 2024-10-22 22:31:45 npm notice remote: 2024-10-22 22:31:45 remote: 2024-10-22 22:31:45 -----> Build succeeded! ...

Kami melihat masa untuk langkah berikut, sehingga mesej Build succeeded hampir tamat:

• Installing dependencies
• Build
• Pruning devDependencies
• Caching build

Secara keseluruhan, dengan npm, binaan ini mengambil masa 16 saat.

Kami menjalankan persediaan yang sama untuk projek yang diuruskan oleh pnpm, juga menggunakan pek bina masa.

 ~/project-pnpm$ heroku apps:create --stack heroku-24 pnpm-timing ~/project-pnpm$ heroku buildpacks:add \ --index=1 \ https://github.com/edmorley/heroku-buildpack-timestamps.git \ --app pnpm-timing ~/project-pnpm$ heroku buildpacks:add \ --index=2 heroku/nodejs \ --app pnpm-timing ~/project-pnpm$ git push heroku main … remote: 2024-10-22 22:38:34 -----> Installing dependencies remote: 2024-10-22 22:38:34 Running 'pnpm install' with pnpm-lock.yaml … remote: 2024-10-22 22:38:49 remote: 2024-10-22 22:38:49 dependencies: remote: 2024-10-22 22:38:49 + animate.less 2.2.0 remote: 2024-10-22 22:38:49 + autoprefixer 10.4.20 remote: 2024-10-22 22:38:49 + babel-core 6.26.3 … remote: 2024-10-22 22:38:51 -----> Build succeeded!

Untuk binaan yang sama dengan pnpm, ia hanya mengambil masa 7 saat.

Penjimatan masa, kami dapati, bukan hanya untuk pemasangan awal itu. Binaan seterusnya, yang menggunakan cache pergantungan, juga lebih pantas dengan pnpm.

Kesimpulan

Apabila saya mula-mula memulakan pembangunan Node.js , saya menggunakan npm. Beberapa tahun yang lalu, saya bertukar kepada Benang, dan itulah yang saya gunakan. . . sehingga baru-baru ini. Kini, saya telah bertukar kepada pnpm. Pada mesin tempatan saya, saya dapat mengosongkan ruang cakera yang besar. Pembinaan juga lebih pantas. Dan kini, dengan sokongan Heroku untuk pnpm, ini menutup gelung supaya saya boleh menggunakannya secara eksklusif daripada pembangunan tempatan sehinggalah ke penempatan dalam awan.

Selamat mengekod!