15 個有趣的 JavaScript 與 CSS 庫
在十一月份的前端技術(shù)列表中，我們整合了一些令人感到驚嘆的 GitHub 項(xiàng)目袜香，其中包含了新的 CSS 框架鲫惶、node.js包管理器，以及用于實(shí)現(xiàn)圖標(biāo)欢策、加載效果吆寨、工具提示的純 CSS 解決方案。
那么踩寇，讓我們一起來看看吧。Have Fun 辣卒！
--
Wing
Wing 是一個微型（壓縮后僅有4KB）響應(yīng)式的 CSS 框架，它提供了一個 12 列響應(yīng)式網(wǎng)格以及基礎(chǔ)的樣式組件集睛榄，可為你的建站工作打下堅(jiān)實(shí)的基礎(chǔ)荣茫。當(dāng)然场靴，這個項(xiàng)目最酷的地方在于，它絕大多數(shù)的 HTML 元素都是自動樣式化的旨剥，而不需要任何額外的類。希望你會喜歡魄咕！
HERE：Wing 項(xiàng)目地址
--
Shave
Shave 是一個零依賴阵谚、輕量級的 JavaScript 插件，它能截?cái)喽嘈形谋镜斓牛赃m應(yīng)基于 max-height 設(shè)定好的 html 元素嗡午，并將原始文本字符串存儲在隱藏的<span>元素中，以便你的文本能夠完整地保留在頁面中狸演。Shave 不依賴任何庫僻他，同時它在 jQuery 中提供了一個獨(dú)立版本的插件。
HERE：Shave 項(xiàng)目地址
--
Cerebral
一個 JavaScript MVC 應(yīng)用程序狀態(tài)管理器满哪，并且它有獨(dú)立的調(diào)試器。在 Cerebral 中哨鸭，應(yīng)用程序的狀態(tài)被存儲在單個的樹模型中，該模型管理著所有服務(wù)器端和客戶端的狀態(tài)活鹰。
而調(diào)試器具有對模型只估、控制器以及視圖的實(shí)時管理權(quán)限。
HERE：Cerebral 項(xiàng)目地址
--
Wenk
Wenk 是一個輕量級純 CSS 寫的文本工具提示庫赖舟。雖然它的壓縮版僅有700字節(jié)夸楣，但它依然能夠管理并提供一些定制選項(xiàng)。諸如不同提示工具的大小豫喧、位置和文本對齊。
HERE：Wenk 項(xiàng)目地址
--
CSS Loader
CSS Loader 是一個非常有用加載器讲衫。它允許開發(fā)人員利用純 CSS 文件孵班，以及一個空<div>元素便可以快速的創(chuàng)建加載指示器。
--
Yarn
相信近期 Facebook 推出的開源 Node.js 包管理器 Yarn枷畏，大家已經(jīng)有所耳聞了虱饿。它具備強(qiáng)大的緩存系統(tǒng)，能夠大大降低包的安裝時間渴肉，并且能夠?yàn)閰⑴c一個項(xiàng)目的所有用戶維持相同的節(jié)點(diǎn)模塊（node_modules）目錄結(jié)構(gòu)爽冕，有助于減少難以追蹤的 bug 和在多臺機(jī)器上復(fù)制。
雖然乌奇，它與 NPM 產(chǎn)生背景不同，但使用 Yarn 幾乎可以等同于使用 NPM 华弓，開發(fā)人員需要更快的了解它哦寂屏！
HERE：Yarn 項(xiàng)目地址
--
Canvas Gauges
Canvas Gauges 是一個利用純 JavaScript 和 HTML5 Canvas（畫布）打造的可完全自定義的儀表娜搂，你可以用它來創(chuàng)建諸如機(jī)動車速度表、溫度計(jì)等類型的測量設(shè)備考廉。
由于它的代碼量很小携御，并且沒有依賴，同時適用于物聯(lián)網(wǎng)設(shè)備啄刹。你可以通過網(wǎng)站的示例來了解它誓军。
HERE：Canvas Gauges 項(xiàng)目地址
--
CSS Icon
CSS Icon 是一個匯聚了500+ 純 CSS 代碼實(shí)現(xiàn)的圖標(biāo)集網(wǎng)站。使用起來也十分簡單捷雕，當(dāng)你點(diǎn)擊了某一個圖標(biāo)壹甥，便會彈出圖標(biāo)對應(yīng)的 HTML 與 CSS 代碼，同時你可以直觀的了解到 CSS 代碼的什么部分盹廷，實(shí)現(xiàn)了圖標(biāo)的哪些元素俄占。
如此棒的項(xiàng)目，是不是得給滿分呢缸榄？快來 Enjoy吧甚带！
HERE：CSS Icon 項(xiàng)目地址
--
CurrencyFormatter.js
CurrencyFormatter.js 是一款簡單實(shí)用的純 JS 格式化貨幣庫佳头。它支持 155 種不同國家的貨幣格式晴氨，以及超過 700 種不同語言的本地化設(shè)置。
此外亭珍，它還能處理某些不采用的貨幣格式枝哄，功能非常強(qiáng)大。
HERE：CurrencyFormatter.js 項(xiàng)目地址
--
KUTE.js
一款具有高性能的原生 JavaScript 動畫引擎：KUTE.js. 它的核心庫提供了所有基本的動畫方法众羡，你可以添加許多插件來豐富 KUTE 的功能蓖租。同時菜秦，它還具備單獨(dú)的擴(kuò)展尔店，可以同時與jQuery主慰、SVG、CSS屬性等一起工作该肴。
HERE：KUTE.js 項(xiàng)目地址
--
Vue Material
Vue Material 是一個根據(jù) Material Design 規(guī)范構(gòu)建的輕量級 Vue.js 框架藐不。它旨在提供一組可重用的高品質(zhì)組件和一系列 UI 元素雏蛮，通過 Vue2.0 支持現(xiàn)代的 Web 瀏覽器來構(gòu)建應(yīng)用程序。
該庫也很容易實(shí)現(xiàn)挑秉，除了 Vue.js 之外沒有任何依賴。
--
Test Cafe
Test Cafe 是一個純 Node.js 編寫的用于測試 Web 應(yīng)用程序端到端的解決方案夜惭。它基于 Node.js铛绰，并且不需要安裝 NPM 包之外的任何東西——不需要瀏覽器插件以及編譯器。
一旦你編寫了測試捂掰，運(yùn)行 Test Cafe，它將為你進(jìn)行瀏覽器測試、收集結(jié)果并創(chuàng)建報告。
--
Core.css
Core.css 是一個用于構(gòu)建響應(yīng)式網(wǎng)站的輕量級框架尤莺。它壓縮后僅有 1.3kb友酱，同時它沒有預(yù)先設(shè)定的元素和內(nèi)置動畫或详。所以適用于搭建任何小型的 Web 項(xiàng)目沈贝。
HERE：Core.css 項(xiàng)目地址
--
Flv.js
B站相信大家都不會陌生罩引，而 Flv.js 就是由 bilibili 網(wǎng)站開源的 HTML5 Flash 視頻（FLV）播放器剔桨，純原生 JavaScript 開發(fā)（ECMAScript 6 編寫） 树绩，沒有用到 Flash瘫俊。
它的工作原理是 Flv.js 在 JavaScript 中流式解析 flv 文件流胸哥，并實(shí)時轉(zhuǎn)封裝為 fmp4 ，通過 Media Source Extensions 喂給瀏覽器，實(shí)現(xiàn)了 FLV 格式視頻的播放。
HERE：Flv.js 項(xiàng)目地址
--
Next.js
Next.js 是一個基于 React 的通用 JavaScript 框架。它提供了一種便利的方式來創(chuàng)建新的 JavaScript Web 應(yīng)用程序。開發(fā)人員不必在搭建 Webpack 或 Babel 的配置上花費(fèi)太多的時間了淹遵。
HERE：Next.js 項(xiàng)目地址
譯者注：關(guān)于 Next.js 的詳細(xì)介紹可以看這里。
以上就本文所有的分享密幔，希望你能找到適合你項(xiàng)目的前端庫木柬。
如果覺得文章不錯，不妨點(diǎn)個贊速挑。_
注：本文版權(quán)歸原作者所有。如需轉(zhuǎn)載譯文，煩請注明出處断序，謝謝！
英文原文：15 Interesting JavaScript and CSS Libraries for November 2016
作者：Danny Markov
譯者：IT程序獅
譯文源自：http://www.reibang.com/p/f651fc45e586
來源：簡書
簡書著作權(quán)歸作者所有感论，任何形式的轉(zhuǎn)載都請聯(lián)系作者獲得授權(quán)并注明出處妥色。
