英文 | https://javascript.plainenglish.io/10-javascript-plugins-that-every-web-developer-should-know-a1cd6449a661

翻譯 | 楊小二

那些從事 Web 開發(fā)工作的人肯定會(huì)注意到 JavaScript 的多功能性。與 ASP 或 PHP 不同，這種客戶端編程語言為開發(fā)人員提供了多種可應(yīng)用于項(xiàng)目的功能。

如果我們正在處理數(shù)據(jù)并希望豐富網(wǎng)站的設(shè)計(jì)，JavaScript 將是我們創(chuàng)建優(yōu)質(zhì)網(wǎng)站的最大盟友。另一方面，前端開發(fā)人員有時(shí)可能會(huì)使用更多陳詞濫調(diào)的語言。

今天，我會(huì)跟你分享10款，對(duì)于我來講，是比較好用的一些JavaScript 插件。我認(rèn)為每個(gè) Web 開發(fā)人員都應(yīng)該了解它們的用處。然而，我把他們都列舉出來了，希望這些JavaScript 插件，對(duì)你有所幫助。

1、Egg

地址：https://github.com/eggjs/egg

你還記得80年代的老虎機(jī)嗎？一直有傳言說引入了帶有按鈕的序列，視頻游戲中會(huì)出現(xiàn)新內(nèi)容。當(dāng)然，有時(shí)它是真的，有時(shí)它只是一個(gè)簡(jiǎn)單的流程。使用Egg插件，你可以輸入計(jì)算機(jī)中稱為“復(fù)活節(jié)彩蛋”的內(nèi)容，讓你的訪問者大吃一驚，并增加你網(wǎng)站的神秘感。

2、Layzr

地址：https://github.com/callmecavs/layzr.js/

你可能聽說過Layzr，知道它是很棒的 JavaScript 插件。Layzr 通過將圖像的加載延遲到圖形窗口內(nèi)來提高網(wǎng)頁的速度。在用戶為顯示這些圖像進(jìn)行必要的滾動(dòng)之前，不會(huì)在網(wǎng)站上向它們收費(fèi)。那么這是否合乎邏輯，如果我們看不到它們，為什么要加載它們？想了解更多的內(nèi)容，請(qǐng)點(diǎn)擊上面的鏈接地址進(jìn)行閱讀學(xué)習(xí)。

3、Elevator 

地址：https://github.com/tholman/elevator.js

Elevator 是一個(gè) JavaScript 插件，你可以使用它來實(shí)現(xiàn)網(wǎng)頁上非常流行的典型“Up”。使用此控件，你可以非常順利地返回頁面頂部。但事情并不止于此。電梯的主要特點(diǎn)之一是，當(dāng)你裝貨時(shí)，我會(huì)播放電梯里的音樂。是的，正如你所聽到的。你一定要試試。

4、Dense

地址：https://github.com/gocom/dense

使用 Dense，你可以在任何設(shè)備上顯示視網(wǎng)膜圖像。這是一個(gè)適用于所有瀏覽器的 jQuery 插件。如果你想將圖像顯示為項(xiàng)目并且在任何移動(dòng)設(shè)備上都可以，你可以嘗試 Dense。這是最好的選擇。

5、FullPage

地址：https://github.com/alvarotrigo/fullpage.js

曾經(jīng)想制作全屏網(wǎng)站但從未見過？你的網(wǎng)站上是否有任何無法使其看起來全屏的組件？使用 FullPage，它非?？?。只需調(diào)用腳本，然后……瞧！你的網(wǎng)站寬度為 100%。它還可用于創(chuàng)建顏色滑塊。

6、Guides

地址：https://ejulianova.github.io/guides/

我不使用任何網(wǎng)站編輯軟件，只使用筆記博客。盡管我是個(gè)堅(jiān)強(qiáng)的人，但我需要額外的功能來執(zhí)行我的設(shè)計(jì)。這些功能之一是規(guī)則，多虧了指南，我們可以為你的網(wǎng)站制定正確的規(guī)則。因此，我們?cè)僖膊粫?huì)遇到一個(gè)元素是否優(yōu)于另一個(gè)元素或哪個(gè)組件被抵消的問題。

7、Rainyday

地址：https://github.com/mubaidr/rainyday.js#rainydayjs

使用 Rainyday，你將有機(jī)會(huì)使用 JavaScript 和 HTML5 創(chuàng)建雨的效果和冷飲效果。這個(gè)工具與所有現(xiàn)代瀏覽器兼容。

8、Cluster

地址：https://www.npmjs.com/package/clusterjs

Cluster 將讓你更輕松地查看大型數(shù)據(jù)集。作為一個(gè)集群，我們可以看到一個(gè)帶有滾動(dòng)條的表格的信息，該滾動(dòng)條的行根據(jù)它們?cè)诒砀裰械奈恢眠M(jìn)行著色。第一行將沒有顏色，最后一行將被整體涂漆。

9、Trunk

地址：https://www.npmjs.com/package/trunk-js

Trunk 將幫助你調(diào)整你的內(nèi)容以適應(yīng)市場(chǎng)上不同尺寸的不同設(shè)備（PC、平板電腦、手機(jī)）。使你的頁面具有100% 響應(yīng)式性。

10、Vorlon

地址：https://www.npmjs.com/package/vorlon

Vorlon 是用于遠(yuǎn)程測(cè)試和調(diào)試 JavaScript 的工具。使用 NODE.JS 和 Socket.IO 進(jìn)行操作。如果你總是不在家并且必須調(diào)試促使你實(shí)施的代碼，那么你可以毫無問題地使用 Vorlon。

總結(jié)

以上就是每個(gè) Web 開發(fā)人員都應(yīng)該知道的 JavaScript 插件的工具。我希望你喜歡它們，并在你的個(gè)人和專業(yè)項(xiàng)目中使用它們。

感謝你的閱讀。

學(xué)習(xí)更多技能

請(qǐng)點(diǎn)擊下方公眾號(hào)