前端高效開發(fā)js庫
前言
喝水不忘挖井人，本篇文章是轉(zhuǎn)載了前端大佬 徐小夕 的文章 《前端高效開發(fā)必備的 js 庫梳理》
js常用工具類
js常用工具類.png
- lodash 一個(gè)一致性、模塊化、高性能的 JavaScript 實(shí)用工具庫。
- ramda 一個(gè)很重要的庫，提供了許多有用的方法，每個(gè) JavaScript 程序員都應(yīng)該掌握這個(gè)工具
- day.js 一個(gè)輕量的處理時(shí)間和日期的 JavaScript 庫，和 Moment.js 的 API 設(shè)計(jì)保持完全一樣, 體積只有2kb
- big.js 一個(gè)小型，快速的JavaScript庫，用于任意精度的十進(jìn)制算術(shù)運(yùn)算
- qs 一個(gè) url參數(shù)轉(zhuǎn)化(parse和stringify)的輕量級js庫
dom庫
dom庫.png
- JQuery 封裝了各種dom/事件操作, 設(shè)計(jì)思想值得研究借鑒
- zepto jquery的輕量級版本, 適合移動端操作
- fastclick 一個(gè)簡單易用的庫，它消除了移動端瀏覽器上的物理點(diǎn)擊和觸發(fā)一個(gè) click 事件之間的 300ms 的延遲。目的就是在不干擾你目前的邏輯的同時(shí)，讓你的應(yīng)用感覺不到延遲，反應(yīng)更加靈敏。
文件處理
文件處理.png
- file-saver 一個(gè)在客戶端保存文件的解決方案，非常適合在客戶端上生成文件的Web應(yīng)用程序
- js-xlsx 一個(gè)強(qiáng)大的解析和編寫excel文件的庫
網(wǎng)絡(luò)請求
網(wǎng)絡(luò)請求.png
- Axios 一個(gè)基于 Promise 的 HTTP 庫，可用在 Node.js 和瀏覽器上發(fā)起 HTTP 請求，支持所有現(xiàn)代瀏覽器，甚至包括 IE8+
- Superagent 基于Ajax的優(yōu)化, 可以與 Node.js HTTP 客戶端搭配使用
- fly.js 一個(gè)基于promise的http請求庫, 可以用在node.js, Weex, 微信小程序, 瀏覽器, React Native中
動畫庫
動畫庫.png
- Anime.js 一個(gè)JavaScript動畫庫，可以處理CSS屬性，單個(gè)CSS轉(zhuǎn)換，SVG或任何DOM屬性以及JavaScript對象
- Velocity 一個(gè)高效的 Javascript 動畫引擎，與jQuery的 $.animate() 有相同的API, 同時(shí)還支持彩色動畫、轉(zhuǎn)換、循環(huán)、畫架、SVG支持和滾動等效果
- Vivus 一個(gè)零依賴的JavaScript動畫庫，可以讓我們用SVG制作動畫，使其具有被繪制的外觀
- GreenSock JS 一個(gè)JavaScript動畫庫，用于創(chuàng)建高性能、零依賴、跨瀏覽器動畫，已在超過400萬個(gè)網(wǎng)站上使用, 并且可以在React、Vue、Angular項(xiàng)目中使用
- Scroll Reveal 零依賴，為 web 和移動瀏覽器提供了簡單的滾動動畫，以動畫的方式顯示滾動中的內(nèi)容
- Kute.js 一個(gè)強(qiáng)大高性能且可擴(kuò)展的原生JavaScript動畫引擎，具有跨瀏覽器動畫的基本功能
- Typed.js 一個(gè)輕松實(shí)現(xiàn)打字效果的js插件
- fullPage.js 一個(gè)可輕易創(chuàng)建全屏滾動網(wǎng)站的js滾動動畫庫, 兼容性無可替代
- iscroll、better-scroll 移動端使用的一款輕量級滾動插件
鼠標(biāo)/鍵盤相關(guān)
鼠標(biāo)鍵盤.png
- KeyboardJS 一個(gè)在瀏覽器中使用的庫（與node.js兼容）.它使開發(fā)人員可以輕松設(shè)置鍵綁定和使用組合鍵來設(shè)置復(fù)雜的綁定.
- SortableJS 功能強(qiáng)大的JavaScript 拖拽庫
圖形/圖像處理庫
圖形處理庫.png
- html2canvas 一個(gè)強(qiáng)大的使用js開發(fā)的瀏覽器網(wǎng)頁截圖工具
- dom-to-image一個(gè)可以將任意DOM節(jié)點(diǎn)轉(zhuǎn)換為用JavaScript編寫的矢量（SVG）或光柵（PNG或JPEG）圖像的庫
- pica 一個(gè)在瀏覽器中調(diào)整圖像大小，而不會出現(xiàn)像素失真，處理速度非常快的圖片處理庫
- Lena.js 一個(gè)輕量級的可以給你圖像加各種濾鏡的js庫
- Compressor.js 一個(gè)使用本地canvas.toBlob API進(jìn)行圖像有損壓縮的js庫
- Fabric.js 一個(gè)易于使用的基于HTML5 canvas元素的圖片編輯器
- merge-images 一個(gè)將多張圖片合并成一張圖的js插件
- cropperjs 一款強(qiáng)大的圖片裁切庫, 支持靈活的圖片裁切方式
- Grade 一個(gè)基于圖像中的前2種主要顏色生成互補(bǔ)漸變背景的庫
- echarts一個(gè)基于 JavaScript 的開源可視化圖表庫
總結(jié)
有幸看到大佬的分享，很多庫在開發(fā)過程中都有使用過，但是自己從來沒有去歸納記錄，每次需求過來的時(shí)候才去找。后續(xù)也會補(bǔ)充一些自己用到過的好用庫，以后有需求功能就先翻看一下。
結(jié)尾
再次鳴謝大佬的技術(shù)分享
作者：徐小夕
鏈接：https://juejin.cn/post/6898962197335490573
來源：稀土掘金
