15 个有趣的 JavaScript 与 CSS 库

 

字数1741 阅读1872 评论5 喜欢122

15 个有趣的 JavaScript 与 CSS 库

在十一月份的前端技术列表中，咱们整合了一些使人感到惊叹的 GitHub 项目，其中包含了新的 CSS 框架、node.js包管理器，以及用于实现图标、加载效果、工具提示的纯 CSS 解决方案。

那么，让咱们一块儿来看看吧。Have Fun ！

---

1. Wing

Wing

Wing 是一个微型（压缩后仅有4KB）响应式的 CSS 框架，它提供了一个 12 列响应式网格以及基础的样式组件集，可为你的建站工做打下坚实的基础。固然，这个项目最酷的地方在于，它绝大多数的 HTML 元素都是自动样式化的，而不须要任何额外的类。但愿你会喜欢！

HERE：Wing 项目地址

2. Shave

Shave

Shave 是一个零依赖、轻量级的 JavaScript 插件，它能截断多行文本，以适应基于 max-height 设定好的 html 元素，并将原始文本字符串存储在隐藏的<span>元素中，以便你的文本可以完整地保留在页面中。Shave 不依赖任何库，同时它在 jQuery 中提供了一个独立版本的插件。

HERE：Shave 项目地址

3. Cerebral

Cerebral

一个 JavaScript MVC 应用程序状态管理器，而且它有独立的调试器。在 Cerebral 中，应用程序的状态被存储在单个的树模型中，该模型管理着全部服务器端和客户端的状态。

而调试器具备对模型、控制器以及视图的实时管理权限。

HERE：Cerebral 项目地址

4. Wenk

Wenk

Wenk 是一个轻量级纯 CSS 写的文本工具提示库。虽然它的压缩版仅有700字节，但它依然可以管理并提供一些定制选项。诸如不一样提示工具的大小、位置和文本对齐。

HERE：Wenk 项目地址

5. CSS Loader

CSS Loader

CSS Loader 是一个很是有用加载器。它容许开发人员利用纯 CSS 文件，以及一个空<div>元素即可以快速的建立加载指示器。

HERE：CSS Loader 项目地址

6. Yarn

Yarn

相信近期 Facebook 推出的开源 Node.js 包管理器 Yarn，你们已经有所耳闻了。它具有强大的缓存系统，可以大大下降包的安装时间，而且可以为参与一个项目的全部用户维持相同的节点模块（node_modules）目录结构，有助于减小难以追踪的 bug 和在多台机器上复制。

虽然，它与 NPM 产生背景不一样，但使用 Yarn 几乎能够等同于使用 NPM ，开发人员须要更快的了解它哦！

HERE：Yarn 项目地址

7. Canvas Gauges

Canvas Gauges

Canvas Gauges 是一个利用纯 JavaScript 和 HTML5 Canvas（画布）打造的可彻底自定义的仪表，你能够用它来建立诸如机动车速度表、温度计等类型的测量设备。

因为它的代码量很小，而且没有依赖，同时适用于物联网设备。你能够经过网站的示例来了解它。

HERE：Canvas Gauges 项目地址

8. CSS Icon

CSS Icon

CSS Icon 是一个汇聚了500+ 纯 CSS 代码实现的图标集网站。使用起来也十分简单，当你点击了某一个图标，便会弹出图标对应的 HTML 与 CSS 代码，同时你能够直观的了解到 CSS 代码的什么部分，实现了图标的哪些元素。

如此棒的项目，是否是得给满分呢？快来 Enjoy吧！

HERE：CSS Icon 项目地址

9. CurrencyFormatter.js

CurrencyFormatter.js

CurrencyFormatter.js 是一款简单实用的纯 JS 格式化货币库。它支持 155 种不一样国家的货币格式，以及超过 700 种不一样语言的本地化设置。

此外，它还能处理某些不采用的货币格式，功能很是强大。

HERE：CurrencyFormatter.js 项目地址

10. KUTE.js

KUTE.js

一款具备高性能的原生 JavaScript 动画引擎：KUTE.js. 它的核心库提供了全部基本的动画方法，你能够添加许多插件来丰富 KUTE 的功能。同时，它还具有单独的扩展，能够同时与jQuery、SVG、CSS属性等一块儿工做。

HERE：KUTE.js 项目地址

11. Vue Material

Vue Material

Vue Material 是一个根据 Material Design 规范构建的轻量级 Vue.js 框架。它旨在提供一组可重用的高品质组件和一系列 UI 元素，经过 Vue2.0 支持现代的 Web 浏览器来构建应用程序。

该库也很容易实现，除了 Vue.js 以外没有任何依赖。

HERE：Vue Material 项目地址

12. Test Cafe

Test Cafe

Test Cafe 是一个纯 Node.js 编写的用于测试 Web 应用程序端到端的解决方案。它基于 Node.js，而且不须要安装 NPM 包以外的任何东西——不须要浏览器插件以及编译器。

一旦你编写了测试，运行 Test Cafe，它将为你进行浏览器测试、收集结果并建立报告。

HERE：Test Cafe 项目地址

13. Core.css

Core.css

Core.css 是一个用于构建响应式网站的轻量级框架。它压缩后仅有 1.3kb，同时它没有预先设定的元素和内置动画。因此适用于搭建任何小型的 Web 项目。

HERE：Core.css 项目地址

14. Flv.js

Flv.js

B站相信你们都不会陌生，而 Flv.js 就是由 bilibili 网站开源的 HTML5 Flash 视频（FLV）播放器，纯原生 JavaScript 开发（ECMAScript 6 编写） ，没有用到 Flash。

它的工做原理是 Flv.js 在 JavaScript 中流式解析 flv 文件流，并实时转封装为 fmp4 ，经过 Media Source Extensions 喂给浏览器，实现了 FLV 格式视频的播放。

HERE：Flv.js 项目地址

15. Next.js

Next.js

Next.js 是一个基于 React 的通用 JavaScript 框架。它提供了一种便利的方式来建立新的 JavaScript Web 应用程序。开发人员没必要在搭建 Webpack 或 Babel 的配置上花费太多的时间了。

HERE：Next.js 项目地址

译者注：关于 Next.js 的详细介绍能够看这里。

以上就本文全部的分享，但愿你能找到适合你项目的前端库。

---

若是以为文章不错，不妨点个赞。^_^

注：本文版权归原做者全部。如需转载译文，烦请注明出处，谢谢！

英文原文：15 Interesting JavaScript and CSS Libraries for November 2016
做者：Danny Markov
译者：IT程序狮
译文源自：http://www.jianshu.com/p/f651fc45e586