2020年你應該關注這50款前端熱門工具，JavaScript外掛篇（一）

前端達人發表於2020-02-12

前端之所以有趣，就是每年有比較多新奇的外掛和工具讓我們去探索和研究。我們在開發前端應用時，自然少不了去找一些第三方外掛幫助我們提高開發效率。本文給大家介紹的這50款新工具，都是相當的新，都是去年的新專案，時間不會超過1年，希望通過我的介紹，你能找到適合的工具，應用到專案中。

1、autoComplete.js

官網地址：https://tarekraafat.github.io/autoComplete.js/

一款原生零依賴輕巧的自動建議 JavaScript 外掛，目前 github star 2.6k ,該外掛能夠很方便的整合到你的專案中，使用起來簡單易用,此外掛主要有以下特點：

原生javaScript指令碼
零依賴
簡單易用
體積小，壓縮版僅6KB
功能豐富
可定製

2、indigo-player

官網地址：https://github.com/matvp91/indigo-player

高度可擴充套件的現代JavaScript視訊播放器，一款現代感十足的 javaScript 播放器外掛，這款播放器功能十分齊全，能滿足你大部分的需求，甚至超出你的預期，使用十分簡單，開箱即用。此外掛主要有以下特點，足夠讓你心動：

支援選擇不同解析度的視訊
支援字幕功能
支援倍速播放
支援畫中畫播放
支援視訊中新增圖片和文字
支援 MPEG-DASH 流媒體格式（ MPEG-DASH + DRM ）
支援 HLS (HTTP Live Streaming) 動態位元速率自適應技術
支援穿插谷歌和自定義廣告
根據你的網路調整自適應的解析度
自定義視訊封面
自定義鍵盤功能鍵控制播放器
支援更改視訊容器的長款比例
初始自定義視訊播放的位置

還有更多的功能，等待著你來挖掘

3、simple-keyboard

官網地址：https://virtual-keyboard.js.org/

一款零依賴庫、效能高、支援自定義擴充套件的軟鍵盤外掛，幫你快速構建功能豐富的Web應用。此外掛主要有以下特點：

方便你整合到 Angular, React, Vue 和 Vanilla 專案中
靈活的設定引數和方法，定製個性化的軟鍵盤
基於彈性盒子佈局，易於整合和設計
支援外掛個性化外掛，比如自動更正、按照特定格式輸入（ Input Mask ）
支援自定義鍵盤樣式，自定義特殊鍵盤，以及個性化的佈局
支援多鍵盤例項
多裝置支援：PC端全鍵盤、手機端鍵盤(安卓、IOS)
支援背景暗黑樣式
支援數字鍵盤
國際化支援，比如法文、日文、俄語等

4、fslightbox.js

官網地址：https://fslightbox.com/

一款原生無需jQuery依賴的圖片幻燈外掛，簡單易用，功能強大，支援全屏展示，除了可以展示圖片，還可以新增文字和視訊，並支援縮圖片，同時方便整合到現有專案中，比如react、vue專案。

5、Rellax.js

官網地址：https://github.com/ChrisCavs/rallax.js

一款零依賴純原生 JavaScript 外掛，可以幫你快速實現滾動視差效果。該外掛效能出色及其易用的API，可以很容易使目標HTML元素實現視差效果，並且使用鏈式語法輕鬆實現回撥（when方法），核心方法包含：start/stop, speed 等。

6、FrenchKiss.js

官網地址：https://github.com/koala-interactive/frenchkiss.js

FrenchKiss.js是一個用JavaScript編寫的快速，輕量級的i18n庫，可在瀏覽器和 NodeJS 環境中使用。它為處理國際化提供了一個簡單且便捷的解決方案。到目前為止，FrenchKiss是目前最快的i18n JS軟體包，通過JIT編譯翻譯並執行基準測試，它的工作速度比任何其他類似的外掛快5至1000倍！