关于前端:必须知道的JavaScript库-解决95问题的工具插件库-1

42次阅读

共计 7361 个字符,预计需要花费 19 分钟才能阅读完成。

前言

在研发周期缓和的背景下, 切记要防止工夫开销在 无用 工作上 (比方造轮子) 如何无效确认是否已有轮子, 本篇文章做一个 list 来帮忙大家。只须要记住上面的库就能够解决工作中 95% 日常问题。

以下所有链接均为源代码仓库。

– —

编辑器

  • ace:Ace,即 Ajax.org Cloud9 Editor。
  • CodeMirror:一个浏览器端的代码编辑器,用 JS 实现。
  • esprima:用于多用途剖析的 ECMAScript 解析器。
  • quill:一个带有 API 的跨浏览器富文本编辑器。
  • medium-editor:Medium.com 应用的所见即所得编辑器的克隆版。
  • pen:享受在线编辑(反对 markdown)。
  • jquery-notebook:一个易用的、简洁优雅的文本编辑器。灵感来源于 Medium。
  • bootstrap-wysiwyg:玲珑的、兼容 bootstrap 的所见即所得的富文本编辑器。
  • ckeditor-releases:实用于每个人的 web 文本编辑器。
  • editor:一个 markdown 编辑器,但仍在开发中。
  • EpicEditor:一个可嵌入的 JavaScript Markdown 的编辑器,领有分屏编辑、即时预览、主动保留草稿和离线反对等性能。
  • jsoneditor:查看、编辑和格式化 JSON 的 web 工具。
  • vim.js:领有长久化 ~/.vimrc 个性,反对 Vim 的 JavaScript 接口。
  • Squire:一个 HTML5 富文本编辑器。
  • TinyMCE:一个 JavaScript 富文本编辑器。
  • trix:由 Basecamp 制作,实用于每天写作的富文本编辑器。
  • Trumbowyg:一款轻量且惊人的所见即所得 JavaScript 编辑器
  • Draft.js:用于构建文本编辑器的 React 框架。
  • bootstrap-wysihtml5:一款简略丑陋的所见即所得编辑器。
  • wysihtml5:基于 HTML5,渐进加强的开源富文本编辑器,利用十分严苛的规定旨在生成合乎 HTML5 标准的标签,防止生成非标准标签和同行款式。
  • raptor-editor:Raptor,一款 HTML5 所见即所得内容编辑器!
  • popline:Popline 是一款 HTML5 富文本工具栏。
  • Summernote:一个极简的所见即所得编辑器。

文档

  • DevDocs:一款多合一接口文档阅读器,界面对立、高效、排版精良。
  • dexy:一款格局自在且文艺的文档工具,可用于编写任何蕴含代码的技术文档。
  • docco:一款快且脏、百来行、文艺范的文档生成器,用 Literate CoffeeScript 实现。
  • styledocco:依据样式表生成格调标准文档。
  • Ronn:构建手册。把对人类浏览敌对的简略文本文件转换成 roff 格式文件,便于终端显示,也能够转换为 HTML,便于 Web 端显示。
  • dox:一款 Node.js 开发的 JavaScript 文档生成器。Dox 不会生成构造款式严苛的文档,而是采纳 JSON 表示法,以实现 markdown 和 JSDoc 格调标签。
  • jsdox:一款将 JSDoc3 转换成 markdown 的文档生成器。
  • ESDoc:一款为 JavaScript 设计的优良文档生成器。
  • YUIDoc:一款提取源码正文生成接口文档的 Node.js 利用,性能相似 Javadoc and Doxygen。
  • coddoc:一款 jsdoc 解析库。Coddoc 与其余工具相比)的不同之处在于,它很容易扩大,通过 coddoc.addTagHandler 和 coddoc.addCodeHandler 来增加标签和代码解析器。Coddoc 还能够解析源码生成接口文档。
  • sphinx:一款让创立智能且丑陋文档更加简略的工具。
  • Using JSDoc
  • Beautiful docs:一款 markdown 格局文档阅读器。
  • documentation.js:反对 ES2015+ 和流正文的接口文档生成器。
  • jsduck:为 Sencha JavaScript 框架开发的接口文档生成器,当然其余框架也能用。
  • codecrumbs:一款用于学习和记录代码库的可视化工具,通过在源码中插入面包屑来实现性能。

文件

  • Papa Parse:一款弱小的 CSV 库,反对解析 CSV 文件 / 字符串,也能导出 CSV。
  • jBinary:对用申明式语法形容文件类型和数据结构的二进制文件,进行高级 I/O(加载、解析、操作、序列化、存储)操作。
  • diff2html:git 差别输入解析器,也是 HTML 丑化器。
  • jsPDF:一款 JavaScript PDF 文件生成器。
  • PDF.js:一个 JavaScript PDF 阅读器,社区驱动,Mozilla 反对。

函数式编程

  • underscore:JavaScript 的实用工具。
  • lodash:提供一致性、可定制、高性能和额定性能的实用库。
  • Sugar:一个扩大了原生对象性能的 JavaScript 库。
  • lazy.js:相似 Underscore,但性能更优越
  • ramda:一个针对 JavaScript 程序员的实用函数库。
  • mout:模块化的 JavaScript 工具库。
  • mesh:流数据同步工具。
  • preludejs:JavaScript 硬核函数式编程。
  • rambda:Ramda 疾速玲珑的替代品。

响应式编程

  • RxJs:对 JavaScript 进行响应式扩大。
  • Bacon:JavaScript 的 FPR(函数式响应式编程)库。
  • Kefir:受 Bacon.js 和 RxJS 启发的 FRP 库,专一于高性能和低内存耗费。
  • Highland:对 JavaScript 实用工具的从新思考,Highland 能轻易地治理同步和异步信息,而且仅应用规范 JavaScript 和类 Node 流。
  • Most.js:高性能 FRP 库。
  • Cycle.js:一款用于可预测代码的函数式和响应式 JavaScript 框架。
  • concent:相对是 ❤️ 最简略却 ⚡️ 最弱小的 react 状态治理开发框架,可预测、渐进式、高性能。

数据结构

数据结构库用于构建一个更简单的利用。

  • immutable-js:不可变的数据汇合,包含 Sequence、Range、Repeat、Map、OrderedMap、Set 和 sparse Vector。
  • mori:应用 ClojureScript 长久化数据结构和反对原生 JavaScript API 的库。
  • buckets:残缺的、通过充沛测试和文档齐备的数据结构的 JavaScript 库。
  • hashmap:简略的哈希映射实现,反对任何类型的键值。

日期

日期库。

  • moment:解析、验证、操作和显示日期。
  • moment-timezone:基于 moment.js 的时区库。
  • jquery-timeago:一款反对自动更新含糊工夫戳的 jQuery 插件(如:”4 分钟之前 ”)。
  • timezone-js:让 JavaScript Date 对象领有时区性能。应用 Olson zoneinfo 文件记录时区数据。
  • date:对人类敌对的 Date()。
  • ms.js:玲珑的毫秒转换工具。
  • countdown.js:超小倒计时。
  • timeago.js:一个十分轻量级(~1.7 Kb)的用于将工夫转化成 xxx 工夫前 格局的库。
  • fecha:轻量级日期格式化和解析库(约 2kb)。能够用来替换 moment.js 格式化和解析日期性能(moment.js 体积比拟大——译者注)。
  • date-fns:古代 JavaScript 日期性能库。
  • map-countdown:构建在 Google 地图上的浏览器倒计时。
  • dayjs:Day.js 是一款领有和 Moment.js 一样的现代化接口的日期库,但它仅仅有 2kb 大小,能够用来替换 Moment.js。

字符串

  • voca:一款超级好用的 JavaScript 字符串库。
  • selecting:一个容许你获取用户选定文本的库。
  • underscore.string:Underscore.js 的字符串操作扩大。
  • string.js:额定的 JavaScript 字符串办法。
  • he:强壮的 HTML 实体编码 / 解码器。
  • multiline:多行字符串。
  • query-string:解析和字符串化 URL 查问字符串。
  • URI.js:URL 操作库。
  • jsurl:轻量的 URL 操作库。
  • sprintf.js:实现字符串格式化。
  • url-pattern:比正则表达式匹配 url 或其它字符串更简略,字符串和数据可互相转化。
  • plexis:低保真、弱小、社区驱动的字符串操作库。

数字

  • Numeral-js:对数字进行格式化和操作的库。
  • chance.js:JavaScript 随机生成器,能够生成数字、字符串等。
  • odometer:晦涩的数字过渡成果。
  • accounting.js:对数字、金钱、货币进行格式化的轻量库,齐全本地化和无依赖。
  • money.js:一个玲珑(1kb)的货币转换库,实用于 web 和 nodeJS。
  • Fraction.js:一个有理数库。
  • Complex.js:一个复数库。
  • Polynomial.js:一个多项式库。
  • Quaternion.js:一款实用于 JavaScript 的四元数操作库。

存储

  • store.js:为所有浏览器封装了 LocalStorage,而没有应用 cookies 和 flash。隐秘地应用 localStorage、globalStorage 和用户数据。
  • localForage:改善后的离线存储。其封装了 IndexedDB、WebSQL 和 localStorage,领有操作简略和弱小的 API。
  • jStorage:jStorage 是一个简略的键值对数据库,用于在浏览器端存储数据。
  • cross-storage:取得权限后,能跨域名本地存储。
  • basket.js:用 localStorage 加载和缓存脚本的资源加载器。
  • bag.js:能够缓存脚本和加载资源,与 basket.js 类似,但减少了键值对接口和对 localStorage / websql / indexedDB 的反对。
  • basil.js:智能的 JavaScript 数据长久层库。
  • jquery-cookie:轻量简略的、用于读取、编辑和删除 cookie 的 jQuery 插件。
  • js-cookie:一款简略、轻量的 cookies 读写删 jQuery 插件。
  • Cookies:一个客户端 Cookie 操作库。
  • DB.js:基于 Promise 的、封装了 IndexedDB 的库。
  • lawnchair.js:简略的客户端 JSON 存储。
  • sql.js:基于 Emscripten 将 SQLite 编译成 JavaScript。
  • crumbsjs:一款轻量级原生 ES6 cookies 和本地存储 JavaScript 库。
  • awesome-web-storage:你必须晓得的所有客户端存储常识。

色彩

  • randomColor:JavaScript 色彩生成器。
  • chroma.js:领有各种各样色彩操作的 JavaScript 库。
  • color:JavaScript 色彩转换和操作库。
  • colors:更智能的默认 web 色彩。
  • PleaseJS:随机创立出赏心悦目的色彩和配色计划的 JavaScript 库。
  • TinyColor:疾速、笨重的色彩操作和转换库。
  • Vibrant.js:从图像提取次要色彩。

国际化和本地化

  • i18next:用 JavaScript 实现国际化(i18n)简略的办法。
  • polyglot:玲珑的国际化助手库。
  • babelfish:提供敌对易懂 API 的 i18n 库,并且内置多种反对。
  • ttag:基于 ES6 标签模板和优良的旧 GNU gettext,新潮的 JavaScript 国际化、本地化库。

控制流

  • async:实用于 node.js 和浏览器的异步工具库。
  • q:实现异步 promise 的 JavaScript 工具。
  • step:一款能够使逻辑执行更简略的异步控制流库。
  • contra:函数式格调实现的异步流控制。
  • Bluebird:功能齐全的 promoise 库,专一于性能变革和性能晋升。
  • when:疾速牢靠的、Promises/A+ 标准的 when() 实现,而且领有其它异步操作的优良个性。
  • ObjectEventTarget:为一般对象增加事件监听原型(就如浏览器 DOMElement 的 EventTarget 一样)。
  • sporadic:位于 promise 顶部的组合并发形象(就像流、协程和相似 Go channels 一样),反对 Node.js 和浏览器引擎。

路由

  • director:一个玲珑的、与 URL 同构的路由。
  • page.js:受 Express router 启发的小型客户端路由器(约为 1200 字节)。
  • pathjs:简略、轻量的 web 路由。
  • crossroads:JavaScript 路由。
  • davis.js:基于 pushState 可降级 RESTful 格调的 JavaScript 路由。
  • navaid:一款浏览器端的导航辅助零碎(也能够成为路由),体积才 850 字节!

安全性

  • DOMPurify:针对 HTML、MathML 和 SVG 的仅反对 DOM 的超疾速、高容错的 XSS 过滤器。
  • js-xss:通过白名单配置,即可过滤不信赖的 HTML(避免 XSS 攻打)。
  • xss-filters:Yahoo 出品的平安 XSS 过滤器。

日志

  • log:带款式的 Console.log。
  • Conzole:对 JavaScript 原生 console 对象办法和性能进行封装的 debug 面板,并将面板显示在页面内。
  • console.log-wrapper:将日志清晰地记录到 console,兼容所有浏览器。
  • loglevel:最轻量的 JavaScript 日志记录工具库,向封装后的 console.log 办法减少牢靠的日志等级。
  • minilog:轻量的、流式 API 显示的、可用于客户端和服务器端的日志记录库。
  • storyboard:通用日志库 + Chrome 扩大。提供一个繁多入口查看蕴含客户端和服务端的工作触发日志。

正则表达式

  • RegEx101:在线的 JavaScript 正则表达式测试器和调试器。同时也反对 Python、PHP 和 PCRE。
  • RegExr:用于创立、测试和学习正则表达式的 HTML/JS 工具。

语音命令

  • annyang:向网站增加语音命令的语音辨认库。
  • voix.js:向网站、app 或游戏增加语音命令的 JavaScript 库。

API

  • axios:基于 Promise 的 HTTP 客户端,实用于 Node.js 和 浏览器。
  • bottleneck:弱小的速度限制器,使调节流量变得更容易。
  • oauth-signature-js:实用于 node 和 浏览器的 OAuth 1.0a 签名生成器。
  • amygdala:为 Web 利用提供 RESTful HTTP 客户端解决方案。
  • jquery.rest:一个让 RESTful API 更易用的 jQuery 插件。
  • Rails Ranger:为 Ruby Tails 接口设计的严格的 REST 客户端。
  • wretch:一款玲珑的直觉语法系 fetch 性能封装包。
  • FarFetch:简略易用的古代 Fetch 接口封装,简化了文件上传。
  • Optic:Optic 用于对 API 自动测试和文档生成。
  • SWR:用于远端数据拉取的 React Hooks 库。

流媒体

  • Tailor:实用于前端微服务的流媒体布局服务,灵感来自 Facebook BigPipe。

视觉检测

  • tracking.js:在 web 上实现计算视觉的一种古代办法。
  • ocrad.js:基于 Emscripten 的 JavaScript OCR 实现。

机器学习

  • ConvNetJS:JavaScript 深度学习。在浏览器环境训练卷积神经网络(或者一般神经网络)。
  • DN2A:数字神经网络架构。
  • Brain.js:JavaScript 神经网络。
  • Mind.js:一款灵便的神经网络库。
  • Synaptic.js:实用于 Node.js 和浏览器的无架构神经网络库。
  • TensorFlow.js:一款用于在 浏览器和 Node.js 中训练和部署 ML 模型的 JavaScript 库。
  • ml5.js:敌对的 Web 端机器学习库。
  • Synapses:轻量级跨平台神经网络库。

浏览器检测

  • bowser:一个浏览器检测器,特点是玲珑疾速且 API 丰盛。

基准测试

  • benchmark.js:jsPerf.com 应用的基准测试库。
  • matcha:一款咖啡因驱动的基准测试简略实现。

动画

  • velocity:减速 JavaScript 动画。
  • jquery.transit:领有超级晦涩的 CSS3 变换和过渡成果的 jQuery 插件。
  • impess.js:在 HTML 文档里,使用 CSS3 变换和过渡制作相似 Prezi 的展示成果。
  • bounce.js:能够立即创立乏味的 CSS3 动画。
  • GreenSock-JS:实用于所有支流浏览器的高性能 HTML5 动画。
  • TransitionEnd:TransitionEnd 是一个使用 transitonend 事件的、跨浏览器的库。
  • Dynamics.js:用于创立合乎物理静止法则的 CSS 动画库。
  • the-cube:The Cube 是一个 CSS3 过渡成果试验。
  • Effeckt.css:一款高性能过渡动画库。
  • animate.css:要多易用有多易用的跨浏览器 CSS 动画库。
  • textillate:实用于 CSS3 文本动画的简略插件。
  • move.js:基于 CSS3 的 JavaScript 动画框架。
  • animatable:一个属性,两个值,无穷个可能性。
  • shuffle-images:简略有创意地打乱图片。http://www.thepetedesign.com/demos/shuffle-images_demo.html
  • smoothState.js:免打搅式页面过渡 jQuery 库。http://smoothstate.com/
  • Anime.js:一款 JavaScript 动画引擎。http://animejs.com
  • particles.js:用于创立粒子的轻量 JavaScript 库。
  • tsParticles:particles.js 全新降级版本,修复了 bug,减少许多新性能。
  • particles-bg:一款轻量的粒子静止动画背景 React 组件。

图片解决

  • lena.js:具备滤镜和实用功能的图像处理库。
  • pica:高质量地调整图片大小(应用疾速、纯 JS 实现的 Lanczos 滤镜算法)。
  • cropper:一个简略的图像裁剪 jQuery 插件。

最初

历史文章

  • 必须晓得的 JavaScript 库 – 可视化库
正文完
 0