推荐15个JavaScript和CSS库(2018年3月)

2,150 阅读4分钟
原文链接: www.zcfy.cc
原文出处 15 Interesting JavaScript and CSS Libraries for March 2018

我们 Tutorialzine 的任务是让你紧跟最前沿、最酷炫的 Web 开发趋势。因此我们每月都会从我们偶然发现的,或者是我们认为值得你关注的资源中,手工挑选一批最好的资源集合,发布出来与你们分享。


basic-scroll-new.png

BasicScroll

这款插件让你能在你的设计中添加视差滚动动效。你可以直接在 CSS 中使用相应的变量或属性,或者在 JS 中使用以获得更好的动画效果。它运行起来非常顺滑,而且没有任何框架依赖,能很好地应用在桌面和移动设备上,并且支持触控事件。


proton-native.png

Proton Native

Proton native 允许你为全平台创建原生桌面应用。它使用和 React Native 相同的语法,支持现有的 React 库,如 Redux,并且兼容大多数 Node.js 包。它使用原生组件,electron 不再是必须的。


normalize-css.png

Normalize.css

Normalize.css 是 现代化的 CSS reset 库。它为 HTML 元素默认样式提供了更好的跨浏览器一致性,最小化了浏览器的差异,提升了可用性。


fork-awesome.png

Fork Awesome

这是一个拥有超过 600 个 SVG 图标的大型图标库。样式自定义非常方便,比如修改颜色、尺寸、阴影等,兼容所有框架。该图标库完全免费,无需 JavaScript 并且在 Retina 屏上效果令人惊艳。


filepond.png

Filepond

Filepond 是一个用于文件上传的极小的 JavaScript 库。它提供很多种上传方式:你可以拖拽、复制粘贴文件,浏览文件系统,或者,去用一用这个库的 API。它 gzip 后仅有 21KB,内置图片优化和自动图片尺寸调整。


headless-chrome.png

Headless Chrome Crawler

这是一款用 Headless Chrome 开发的 web 爬虫。它简单的 API 能让你很方便地创建并发、重试和延时方法。它支持深度优先和广度优先爬虫算法,支持插件式缓存存储,例如 Redis,支持导出 CVS 和 JSON 格式。


pressure.png

Pressure.js

一款用于处理 force touch, 3D touch 和 pointer pressure 的 JS 库。它拥有和大多数浏览器兼容的简洁 API,内置压感设备识别工具。它还支持多指触控。


loaders-css.png

Loaders.css

一个有趣的纯 css 加载动画集合。它使用和自定义起来都非常简单方便。它包含多种动画,例如变形、旋转、淡入等等。动画兼容所有现代浏览器,包括 IE9+。


react-slider.png

React Slider Kit

React slider kit 让你能在 react 应用中创建滑动条组件。它提供多种不同的滑条,例如 1D,2D,单滑条,范围滑条,水平和垂直滑条。你可以设置滑条的最小、最大值,初始值和步进值等。


nativescript-logo-new.png

NativeScript

这是一款使用 JavaScript 与 CSS 为 iOS 和 Android 创建移动应用的免费、开源框架。你只需使用 JavaScript 编写一次代码,框架会自动适配让它运行在所有设备上。它高度可扩展,你可以从 npm、CocoaPods 和 Gradle 安装使用成百上千的插件。


polacode-new.png

Polacode

Polacode 是一款 VisualStudio Code 扩展,有了它你可以给代码生成漂亮的截图,带上一些非常棒的视觉效果。它会隐藏编辑器的 UI 并给截图添加阴影、边距和圆角。


scratches-new.png

Scratches

Scratches 是一款简单的 JavaScript 和 Node.js 文本编辑器,当你一边敲代码时它会立即执行你的代码。它使用 Electron 构建而成,拥有干净的白色和黑色主题,在另一侧有一个预览窗口,可以实时看到代码的输出结果。


prompts.png

Prompts

Prompts 是一款十分容易上手的,致力于为命令行应用和工具创建漂亮的提示输入的JS 库。它十分轻量,所有实现代码均包含在库中,无任何外部依赖。该库专门使用了 promise 化接口,搭配 async/await 使用起来更棒。


list.png

List

该库为你提供了一个快速的函数式的数组替代品。因为它是 immutable 的,对于那些正在试验函数式编程的人来说,它是个非常棒的选择。List 使用 TypeScript 编写,实现了所有的 JavaScript 数组方法和许多额外的方法。


nerv-logo.png

Nerv

Nerv 是一款快速的、基于 virtual-dom 的 JavaScript 库,可用作 React 的替代品。它十分轻量,兼容 IE8 和 React 16,且提供客户端和服务端同构渲染。它支持很多 React 16 的特性,比如 Error Boundaries、Portals 以及许多其他的特性。