【譯】15個有趣的JS和CSS庫（2018.7）

Tutorialzine每個月都會給咱們精心挑選優秀的web開發資源，這些資源能夠幫助咱們解鎖最新和最炫酷的網絡開發姿式。前端er,讓咱們一塊兒先睹爲快吧！

Polly.js

polly是一個用於記錄，重放和模擬HTTP交互的開源庫。它提供了一套完善且易用的API來攔截、修改和附加事件，並更改配置來加快或減慢請求響應時間。而且使用Polly記錄的HTTP交互歷史能夠保存到瀏覽器的localstorage或本地存儲中。

react-easy-crop

一個經過簡單的交互來裁剪圖像的React組件，它很是易於使用，支持拖動和縮放交互，提供了像素和百分比的裁剪方式。你可使用任何圖像格式(jpeg，png，gif)。而且該組件支持移動端開發。

Cirrus

用於建立耳目一新且響應式web應用的CSS框架。它提供了建立漂亮的交互式設計所需的全部組件 - 按鈕，表單，動畫，表格，頁眉，頁腳等等。該框架很是輕量-你能夠只選取應用所需的組件文件，並且能夠自定義-全部組件可以使用CSS設置樣式，該框架兼容全部的現代瀏覽器。

repaintless

Repaintless.css是一款輕量級高性能的CSS3動畫庫。極易應用且內置了大量動效（fade-in, fade-out, rotate, pulse, slide ）等等。能夠經過更改scss變量（文件）來輕鬆定製動畫。

spritejs

Sprite是一款跨平臺2D渲染對象模型，爲圖形建立相似於DOM的對象模型，所以咱們能夠像建立DOM元素同樣建立Sprite元素，並將它們渲染到Cavans畫布上。支持服務端渲染，高性能的緩存策略，可擴展的事件機制。

Three Dots

Three Dots是一個CSS庫，由三個點建立的有趣加載特效。內置了大量的的動畫，並且能夠經過scss變量來輕鬆定製（顏色，寬度，高度，間距等）。

RModal.js

Rmodal.js是一個簡單且高性能的模態對話框。很是輕量（僅1.2KB），沒有外部依賴性。對Bootstrap和Animate.css友好。支持ES modules, CommonJS併兼容IE9以上版本的全部現代瀏覽器。

Jest

它是一個用於JavaScript代碼的測試工具。零配置，開箱即用。使用並行測試來最大化性能，內置的代碼覆蓋率報告並支持TypeScript或任何其餘編譯到JavaScript的語言。

Boxicons

一個很棒的開源圖標集，包含400多個圖標。您可使用自定義類來設置圖標的樣式（更改大小，添加邊框和動畫，旋轉或翻轉）。此圖標集中收藏了各式各樣的圖標，你頗有可能找到你心儀的圖標。

Web-Maker

Web Maker是供前端使用的離線編輯器。它內置了一個控制面板，能夠方便的添加JS和CSS庫，並支持HTML，CSS和JavaScript預處理器，項目的導入和導出，並能一鍵完成在CodePen中共享。

Odometer

Odometer是一個用來建立平滑的數字變換的組件庫（Javascript和CSS）。輕量，高性能，全部動畫採用CSS中transform實現。它支持Firefox，Safari，Chrome和IE8 +，而且在舊版瀏覽器上具備自動降級功能。

Gatsby

是一個快速生成靜態站點的工具。支持全部最新的Web技術如React，Webpack，JavaScript和CSS。並具備豐富的插件支持，支持從任何來源導入數據。 Gatsby專一於構建快速，高性能的站點，並且部署過程很是簡單。

Anime.js

Anime.js是一個很是輕量的JavaScript動畫庫，能夠處理任意的CSS屬性，以及SVG或DOM屬性。提供了大量的可自定義功能接口，如連接和同步多個動畫，播放，暫停和從新啓動等等。

DataTables

一款開源jQuery插件，能夠在HTML表單中添加高級功能。它內置了許多經常使用功能，如分頁，過濾，根據列排序等等，用戶能夠從表中獲取最多信息。它對移動設備友好，並且可擴展和具備對多語言支持特徵。

Shave

Shave是一個零依賴、輕量級的JavaScript插件，它用於截斷多行文本，以適應基於max-height設定好的html元素，並將原始文本字符串存儲在隱藏的元素中，以便你的文本可以完整地保留在頁面中。Shave很是輕量（1.5k），不依賴任何庫而且能與其餘javascript庫兼容。

寫在最後

週末看博客，忽然想起這系列文章的之前做者好像已經好久沒有更新了，恰好有看到這個系列，就想到譯一下，若是你們有興趣，歡迎你們留言。

原文：15 Interesting JavaScript and CSS Libraries for July 2018 - Tutorialzine