npm 模塊的規模和範圍是空前的,這也是 JavaScript 相對於其它程式語言的最大優勢之一。你對於 npm 模塊利用得越好,你就會成為一名更快更高產的開發人員。本文將介紹一些對於 NodeJS 和前端 JavaScript 開發價值非凡的通用模塊和工具,期望能夠對廣大讀者有所裨益。
本文所述僅代表作者個人觀點,主要聚焦於NodeJS 和前端 JavaScript 開發價值非凡的通用庫和工具。本文不會面面俱到,也不會包含任何特定用途的模塊,因為那種類型的列表雖然確實不錯但有點兒片面。
讓我們先來看看一些非常有用的命令行工具。
np - 一個更好的npm publish
如果你是一位 npm 模塊開發者,我強烈建議你檢出 np。因為它將版本衝突處理、添加 git 發布標記以及發布到 npm 的流程變得輕而易舉,特別是當你需要維護十來個以上模塊的時候。另外值得一提的是,Zeit 開發的 release 也是一個不錯的選擇。
yarn - 一個兼容 npm 的更好的包管理器。
儘管 npm v5 比之前版本快了很多,但我仍然認為 yarn 比 npm 更適合本地開發,因為 yarn 的速度和一致性更出色。無論使用哪種方式,你都是基於底層的同一個 npm 模塊庫,而且我個人認為,這兩者之間其實差不多,並沒有哪一個比另一個出色得多。你應該選擇最適合你的項目需求的包管理器。
我認為,在 2018 年,作為一名 JS 開發者,你最好同時熟悉npm和yarn,並且能夠在這兩者之間切換自如。
prettier - 一款偏執的代碼格式化工具。
Prettier 會解析你的代碼,然後按照它自己的規則重新列印你的代碼。它會根據最大行長度,在需要的時候進行換行。通過這樣,Prettier 可以強制使你的代碼風格保持一致。
我熱愛 eslint,也一直是 JavaScript Standard Style 的長期用戶。但是,像 prettier 和 gofmt 這樣的自動代碼格式化工具背後的理念具有無法抗拒的吸引力。
作為開發者,我們花費了太多時間和精力去操心代碼的風格樣式,而 prettier 則讓你減少在這方面的注意力,使你能夠專注於編寫什麼而不是如何編寫。
now - 非常簡單的部署工具。
考慮到簡單性、可靠性和功能集,Now 絕對是如今最好的免費部署系統。它對於測試靜態和動態發布非常有用,而且當你需要更多伺服器的時候,可以很好地擴展。你可以一直免費使用它,直到你需要擴展的時候才需要付費。
Node.js 和 JS 驅動的 Web 應用在它上面運行得非常好。另外,我還強烈推薦檢出 Zeit 提供的其它模塊,因為他們團隊是由一些社區最好的 JS 開發者組成的。
asciinema - 高質量終端會話的免費記錄工具。
可以查看我的上一篇博客《Making your Code Beautiful》(讓你的代碼更漂亮),詳細了解如何利用 asciinema 來生成高質量的代碼樣式和截屏。
這一節值得專門寫一篇完整的文章來進行介紹,尤其是現在,async & await 已經開始成為 JavaScript 並行編程的事實標準。
也就是說,如果你還沒有檢出 Sindre Sorhus 的 promise-fun 模塊,那麼我強烈推薦你檢出這個優秀的模塊。我對這些模塊唯一的抱怨是,它們好像不能在 create-react-app 和 rollup 之類的大部分前端工具鏈中開箱即用。
下面是一些最有用的模塊,它們支持 promise 和 async 風格的 Node 代碼:
pify - 將回調風格的函數 Promise 化。
有許多方法可以將函數從舊的回調方式轉變為 Promise 風格,但是我發現 pify 是其中最好用的。它很小,提供了一些不錯的細節,例如自動方法綁定,這在內置的 util.promisify 中是沒有的。
p-map - promise 並發管理。
並發很棒,但是大部分時候,無論是為了限制網絡帶寬或者計算資源,你都會想要設置一個實際的並行限制。p-map 在這方面非常突出。99% 的時候,我會用它來替代 Promise.all(...),因為 Promise.all(...) 不支持限制並行。
我在接觸 p-map 之前,自己創建了一個並行限制模塊 async-awiat-parallel,但我還是推薦你使用 p-map,因為它更好。😛
p-retry - 重試 promise 返回值函數或異步函數。
我一般用 p-retry 包裝所有 HTTP 請求和外部服務調用,給它們增加一層基本的健壯性。結合 p-map,你可以用可控的並行方式處理大批量的外部請求,而不需要太擔心偶然的傳輸錯誤、套接字掛斷或者伺服器超時。
p-timeout - 超過特定時間後使 promise 超時。
和 p-retry 一樣,p-timeout 通常是與第三方 API 和服務對接時,提高穩健性的必需模塊。你可以指定一個備選反饋,因為通常情況下,直接給出反饋比沒有明確時間提示的掛起等待或者等待超長時間之後才給出反饋要好得多。
p-cache 或者 p-memoize - 通過一個 LRU(Least Recently Used,最近最少使用)緩存來緩存異步函數結果。
許多這些 Promise 工具的目的,都給了我很多架構穩健微服務的啟發。在我的微服務架構中,每個外部依賴都可以被當作一個普通的接口,支持重試、超時、緩存、熔斷、回退等。
功能性的優雅降級通常比系統崩潰或者根本不響應更可取,因此,如果還不太熟悉微服務,可以檢出 p-cache 或 p-memoize,看看它們的設計決策是否也能夠幫助提升你的 Promise 處理能力。
有許多非常棒的網頁抓取工具,其中一些操作原始的 HTML,例如 cheerio;其中一些模擬了一個完整的瀏覽器環境,例如 puppeteer。你使用什麼工具取決於你的真實使用場景,因為用原始 HTML 更快也更輕量,而自動化一個無頭瀏覽器 (headless browser)雖然更穩健但也更笨重一些,不容易上手。
cheerio - 專門為伺服器端設計的快速、靈活、簡潔 的核心jQuery實現。
Cheerio 真的非常適合只想操作原始 HTML 的快速混雜的網頁抓取。它提供了一個穩健的類 jQuery 語法用來遍歷並操作 HTML 文檔。Cheerio 配合 request-promise-native 抓取遠程 HTML 文檔特別好用。
puppeteer - Chrome 無頭瀏覽器的 Node API。
和 cheerio 不一樣,puppeteer 是一個用來自動化 chrome 無頭瀏覽器實例的包裝器,非常適合現代的 JS 單頁應用。因為你就是在用 Chrome 本身,它對於解析、渲染和腳本執行的一致性支持非常棒。Chrome 無頭瀏覽器相對來說還比較新,但是它很可能會在接下來的幾年裡逐步淘汰較老的方案,例如 PhantomJS。
如果你需要持續抓取網站,自動化基於 Web 的工作流,或者捕捉截圖,puppeteer 是一個明顯的贏家,它會逐漸變得更受歡迎。
dotenv-safe - 從.env文件加載環境變量並確保它們都生效。
這個庫繼承了非常受歡迎的 dotenv 庫,通過一個.evn.example文件來強制所需的環境變量文件。像原來的 dotenv 模塊一樣,它提供了針對 Node 的快速、安全和穩健的環境變量支持。
它還可以通過在 now.json 中配置"dotenv": true來很好地與 Zeit 的 now.sh 部署腳本配合使用。
request 和 request-promise-native - 簡化的 HTTP 請求客戶端。
發起 HTTP 請求是一個非常普遍的操作,我的庫使用的是 request-promise-native,它用原生的 ES6 promise 包裝了原來的 request 模塊。95% 的時候,我都會 await promise 化的 HTTP 請求結果。其餘 5% 的時候,我會直接使用響應流,在這種情況下,我使用底層的 request 模塊,而不需要 Promise 支持。
通常情況下,為了穩健性,我會用 p-retry、p-timeout 和 p-cache 來一起包裝 request-promise-native 調用。
另外值得一提的是,支持 promise 的 got 也可以作為 request 的一個比較新的備選模塊,儘管我個人還沒怎麼用過這個模塊。
const request = require('request-promise-native')const html = await request('https://github.com')console.log(html)
這是用 request-promise-native 下載 HTML 文檔的一個例子
consolidate - 針對 Node 的模板引擎統一庫。
Consolidate 用來處理任何類型的後端模版(郵件、推特、原始 HTML 等)非常棒。我通常選擇 handlebars 作為我的模版引擎,但是無論怎樣,我總會用 consolidate 包裝我的模版用例,因為它提供了一種簡單一致的模版構建接口,而無論你在底層決定使用的是哪種模板引擎。
例如,我在 create-react-library 中使用 consolidate,來用這個庫相關的變量渲染 boilerplate 模板。
execa - 一個更好用的child_process。
如果你想要運行一個 shell 命令或者生成一個子進程,execa 會非常好用。
fs-extra - 一個更好的fs(文件流模塊),擁有額外的方法和 Promise 支持。
我發覺自己很少直接使用fs了。試過fs-extra後,你就再也不會回過頭用 fs 了。
D3(Data-Driven Documents,數據驅動文檔)是一個流行的用於數據可視化和動畫渲染的前端庫。它還包含一些非常棒的用於常見數學運算的單獨包,我一直都選擇用它們而不是其它可選模塊。
d3-random - 從各種分布中生成隨機數字。
當Math.random不好使的時候,試一試 d3-random 吧。它為各種常見分布提供了樣例,包括均勻分布、正態分布和指數分布。
d3-ease - 流暢的動畫功能。
d3-interpolate - 插入數字、顏色、字符串、數組、對象等任何東西!
這個庫提供了各種插入方法,用於在任意兩個值之間混入其它值。這些值可能是數字、顏色、字符串、數組或者深層嵌套的對象。
ava - 傑出的 JS 測試運行框架。
我使用的 Node.js 單元測試運行框架,是由 Sindre Sorhus 創建的另外一個工具。Ava 是一款比較新的測試運行框架,吸收了 mocha、tape、chai 和其它 JS 測試運行框架的優點,然後將所有這些優點拼在一起,形成一個非常棒的項目,並且配置了必要的默認值,可以讓它「剛剛好能夠工作」。
值得一提的是,Ava 的測試任務默認是並行運行的。針對一些使用場景,例如數據測試,單元測試的順序可能非常重要,你可以在文件級別關閉這個功能。
nock - 一個 HTTP 模擬庫
Nock 非常適合那些孤立地執行 HTTP 請求的測試模塊。如果你的 Node 模塊會發起 HTTP 請求,而你想要提供適當的單元測試,那麼 nock 是個不錯的選擇。
sinon - 一個 JS 測試庫
Sinon 是一個非常有用的工具庫,利用依賴注入來編寫孤立的測試。每個 Node 開發者都應該掌握這個工具。
我期望這篇分析文章能夠對你有所幫助,即使它只是讓你了解到一個你之前沒有聽說過的好用的模塊。我知道許多經驗豐富的有志向的開發者,會針對常見問題提出他們自己的解決方案。但是有些時候,如果已經有一些優秀的方案,使用這些方案而不是不斷重造輪子,也是不錯的。
NPM 庫的規模和範圍是空前的,而且我個人認為,這是 JavaScript 相比於其它程式語言的最大優勢之一。你對 npm 庫利用得越好,你就會成為一名更快更高產的開發人員。類似這樣的高階「軟」技能,是傳說中的 10x 程式設計師的特徵之一。
有哪些你喜愛的 npm 庫,我漏掉了嗎?在評論中分享你喜愛的庫,讓我知道吧!
https://hackernoon.com/javascipt-modules-worth-using-9aa7301e41ac
「前端之巔」是 InfoQ 旗下關注大前端技術的垂直社群。緊跟時代潮流,共享一線技術,歡迎關注。
PWA、Web 框架、UI 與動畫、Node... 大前端的下一站在哪裡?前端工程師的價值和成長路徑是什麼?GMTC2018 上,來自 Google、Facebook、BAT 等 60+ 國內外一線前端大牛,將與你面對面探討大前端領域最新技術趨勢和實踐,想要升職加薪就快來吧!掃描下方二維碼或點擊「閱讀原文」了解更多大會詳情!
目前大會 8 折熱銷中,團購更優惠,購票諮詢:18514549229(同微信)