工具摘抄-工具处理
idify： 将用户上传的人像照，转成证件照，全部使用前端代码，数据不会上传。
工具摘抄-AI搜索
Note AI： 将用户搜索内容，用 AI 从搜索引擎返回的网页结果里面。
工具摘抄-算法大集
Hello 算法： 全书采用动画图解，结构化地讲解数据结构与算法知识，内容清晰易懂、学习曲线平滑。
函数集成
Lodash： 一个一致性、模块化、高性能的 JavaScript 实用工具库。
Underscore： 一个 JavaScript 实用库，提供了一整套函数式编程的实用功能
Ramda： 一个很重要的库，提供了许多有用的方法，每个 JavaScript 程序员都应该掌握这个工具
30 seconds of code： 快速查询js相关精选实现片段
MathJS： 一个 Node.js 和 JavaScript 上的 math 扩展库，并且和内置的 Math 库兼容
Lazy.js： 类似Lodash,Underscore库，但采用惰性求值方式来处理大量数据情况，来达到性能提升
vocajs： 字符串处理
big.js： 一个小型，快速的JavaScript库，用于任意精度的十进制算术运算
时间集成
moment： 功能齐全，moment.min.js大小几十k,具备时间/时区处理
day.js： 一个轻量的处理时间和日期的 JavaScript 库，和 Moment.js 的 API 设计保持完全一样, 体积只有2kb
date-fns： 按需加载的，体量小的时间处理库
需求排期表单
fullcalendar ： 使用JavaScript创建全尺寸的拖放日历
网络请求
Axios ： 一个基于 Promise 的 HTTP 库，可用在 Node.js 和浏览器上发起 HTTP 请求，支持所有现代浏览器，甚至包括 IE8+
fly.js： 一个基于promise的http请求库, 可以用在node.js, Weex, 微信小程序, 浏览器, React Native中
鼠标/键盘相关
KeyboardJS： 一个在浏览器中使用的库（与node.js兼容）.它使开发人员可以轻松设置键绑定和使用组合键来设置复杂的绑定
DOM操作库
jquery： 常用Dom操作
tethys： 微型的库，包含最常用的Dom操作
Zepto： 轻量级的针对现代高级浏览器的JavaScript库
文件处理
file-saver： 一个在客户端保存文件的解决方案，非常适合在客户端上生成文件的Web应用程序
js-xlsx： 一个强大的解析和编写excel文件的库
弹出框
layui.js： layui 独立维护的三大组件之一（layDate、layer、layim）
尽管 layui 中包含了这些组件，但因为它们受众群体广泛或应用广泛，特从 layui 中抽取出来个副本，可独立引用。我们也会对它们进行同步维护。
Bootbox.js： Bootbox.js是一个小型JavaScript库，它允许您使用Bootstrap模式创建编程对话框，而不必担心创建、管理或删除任何所需的DOM元素或JavaScript事件处理程序。
滚动/滚动动画库
better-scroll： iscroll 的优化版，支持移动/pc,原生实现，拓展灵活的滚动插件，追求丝滑，使移动端滑动体验更加流畅
iscroll： 移动端使用的一款轻量级滚动插件
fullPage.js： 一个可轻易创建全屏滚动网站的js滚动动画库, 兼容性无可替代
Scroll Reveal： 零依赖，为 web 和移动浏览器提供了简单的滚动动画，以动画的方式显示滚动中的内容
vuescroll： 移动端使用的一款轻量级滚动插件
mescroll： 移动端上拉刷新下拉加载
animatescroll： jQuery滚动到指定位置
轮播图
Swiper： 常用于移动端网站的内容触摸滑动
iSlider： 移动端滑动组件
slip： 移动端跟随手指滑动组件，零依赖
OwlCarousel2： 移动端跟随手指滑动组件，零依赖
图形/图像处理库
html2canvas： 一个强大的使用js开发的浏览器网页截图工具
dom-to-image： 一个可以将任意DOM节点转换为用JavaScript编写的矢量（SVG）或光栅（PNG或JPEG）图像的库
pica： 一个在浏览器中调整图像大小，而不会出现像素失真，处理速度非常快的图片处理库
Lena.js： 一个轻量级的可以给你图像加各种滤镜的js库
Compressor.js： 一个使用本地canvas.toBlob API进行图像有损压缩的js库
Fabric.js： 一个易于使用的基于HTML5 canvas元素的图片编辑器
merge-images： 一个将多张图片合并成一张图的js插件
cropperjs： 一款强大的图片裁切库, 支持灵活的图片裁切方式
Grade： 一个基于图像中的前2种主要颜色生成互补渐变背景的库
动画库
收集比较多的动画库：juejin.cn/post/684490…
animejs： 一个JavaScript动画库，可以处理CSS属性，单个CSS转换，SVG或任何DOM属性以及JavaScript对象
animate.css： CSS3 动画库，也是目前最通用的动画库
wow.js： 滚动展示动画 WOW.js 依赖 animate.css，所以它支持 animate.css 多达 60 多种的动画效果
Velocity： 一个高效的 Javascript 动画引擎，与jQuery的 $.animate() 有相同的API, 同时还支持彩色动画、转换、循环、画架、SVG支持和滚动等效果
Vivus： 一个零依赖的JavaScript动画库，可以让我们用SVG制作动画，使其具有被绘制的外观
GreenSockJS： 一个JavaScript动画库，用于创建高性能、零依赖、跨浏览器动画，已在超过400万个网站上使用, 并且可以在React、Vue、Angular项目中使用
Kute.js： 一个强大高性能且可扩展的原生JavaScript动画引擎，具有跨浏览器动画的基本功能
Hover.css： CSS hover 悬停效果，可以应用于链接、按钮、图片等等
Magic.css： css3 animation动画库
Waves.css： 点击波纹效果
为所欲为CSS
stylus： 提供了一种高效，动态和表达方式来生成 CSS。同时支持缩进语法和常规 CSS 样式
less： Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性
sass： 是一种 CSS 的预编译语言，Sass 为 CSS 赋予了更强大的功能。它提供了 变量（variables）、嵌套（nested rules）它提供了 变量（variables）、嵌套（nested rules） 混合（mixins）、函数（functions）等功能，并且完全兼容 CSS 语法。
spinkit： 实现各种加载效果的 CSS 代码片段
animista： 各种 CSS 实现的效果
css_tricks： 记录一些 CSS 的新属性和一点奇技淫巧
CSS-Inspiration： 以分类的形式，展示不同 CSS 属性或者不同的课题使用 CSS 来解决的各种方法
You-need-to-know-css： CSS 的各种效果实现，尤其是动画效果
原子css三重奏
tailwindcss： 是一个功能类优先的 CSS 框架，它集成了诸如 flex, pt-4, text-center 和 rotate-90 这样的的类，它们能直接在脚本标记语言中组合起来，构建出任何设计
windicss： 在tailwindcss基础做了优化如热更新/自动值推导
unocss： 具有高性能且极具灵活性的即时原子化 CSS 引擎--让你来主导css规则配置
富文本编辑器
Simditor： 即见即改编辑器
Quill： 现代的WYSIWYG编辑器
tui.editor： Markdown编辑器
draftjs： 用于构建文本编辑器的React框架
MavonEditor： mavonEditor-基于Vue的markdown编辑器，支持多种个性化功能
Tiptap： Vue.js的无渲染富文本编辑器
Tinymce： TinyMCE是世界上最受欢迎的基于Web的开源WYSIWYG编辑器。用于富文本编辑。适用于React，Vue和Angular
Simplemde： 一个简单，美观，可嵌入的JavaScript Markdown编辑器。无论是初学者还是专家，都可轻松编辑。具有内置的自动保存和拼写检查功能。
Simplemde Markdown Editor： 一个简单，美观，可嵌入的JavaScript Markdown编辑器。不论是初学者还是专家，都可轻松编辑。具有内置的自动保存和拼写检查功能。
editor： JSON输出的块样式编辑器
Markdown 编辑器
图片预览/滑动切换
Viewer.js： 图片预览
swiper： 常用于移动端网站的内容触摸滑动
react-viewer： 图片预览
react-photo-view： 一款精致的 React 图片预览组件
react-zmage： 一个基于 React 的可缩放图片控件
视频播放器
xgplayer： 西瓜播放器
flv.js： Bilibili开源Js编写的播放器
Video.js： 西瓜播放器
chimee.js： 奇舞团 组件化H5播放器框架
弹幕视频播放器
DanmuPlayer： Html5弹幕视频播放器插件
jquery.danmu.js： jQuery弹幕插件
scroxt： 字幕字体滚动插件
复制粘贴插件
条形码/二维码插件
qrcodejs： 二维码插件
拖拽
音频
前端国际化 i18n
地图
网页即时通讯
PDF 阅读器
Mock数据请求
颜色库（量不在多在于精）
中国色： 领略中国美
palettable： 取色器
编译
sucrase 它的编译速度比Babel快，ES6+编译器，重点关注非标准语言，例如Typescript，JSX和Flow
检测浏览器是否支持
can i use 检测浏览器是否支持查询得属性/标签
页面性能检测
can i use 会对各个测试项的结果打分，并给出优化建议，这些打分标准和优化建议可以视为Google的网页最佳实践
ICON资源
The Noun Project 网站专门提供高品质、可辨识性强的icon
截图
Snipaste 简便快捷的截图工具
terminal 终端
cmder 嫌弃windows的terminal，觉得git bash窗口不够?。cmder值得你拥有
构建
Webpack Config Tool 一键生成相关配置-webpack.config.js
pc/移动多功能列表table
ali-react-table 现代化的高性能 React 表格组件
提示框
pushjs 跨浏览器的桌面通知插件
文本截断
shave 一个零依赖、轻量级的 JavaScript 插件，它能截断多行文本，以适应基于 max-height 设定好的 html 元素，并将原始文本字符串存储在隐藏的元素中，以便你的文本能够完整地保留在页面中
可以借助-webkit-line-clamp进行实现
指纹
FingerprintJS 使用 浏览器端实现指纹识别的 JS 库
url转正则表达式
[path-to-regexp](<github.com/pillarjs/pa…) url 字符串的正则表达式
单位转换
在线px和rem单位互转 可以批量px和rem单位转换
postcss-pxtorem px转rem单位
amfe-flexible 移动端适配解决方案：amfe-flexible+postcss-pxtorem
postcss-px-to-viewport 移动端适配解决方案：px转vw
安全
xss预防 根据白名单过滤 HTML(防止 XSS 攻击)
表单
formidable表单解析 主要用于解析表单form，获取其相关提交的数据
拖拽库
SortableJS ： 功能强大的JavaScript 拖拽库
react-sortable-hoc ： react+sortablejs拖拽库
react-beautiful-dnd ： react 拖拽库
Ast转换
GoGoCode ： 基于 AST 的 JavaScript/Typescript/HTML 代码转换工具
水印
watermark-dom watermark.js是基于DOM对象实现的BS系统的水印，确保系统保密性，安全性，降低数据泄密风险，简单轻量，支持多属性配置，动态计算水印，水印防被删（监听水印组件元素删除并重新添加，监听改变水印的属性并重新添加） 如果只是简单实现：三步走，
1.创建div容器，遍历循环内容
2.css处理，重点属性，position:fixed;z-index:值拉满;重点pointer-events: none;失去作为鼠标事件目标，然后再给内容 transform: rotateZ(-25deg);倾斜度即可
3.计算数量 情况1.有写会直接写死数量，动态写死数量，如果页面高度发生变化，水印效果就会发生挤压
所以最好方式应该是动态数量，固定距离
方法：写死距离，利用document.documentElement.clientHeight / distance 可视区域高度除以距离获得动态数量，这样效果出来，不同页面展示不同数量水印，距离保持不变，视觉上就不会产生挤压效果
第三步初始化时候触发你计算水印数量方法，然后最好写个window.onresize监听页面变化再触发该方法
框架
AdonisJs: 一个全栈框架，高度专注于开发者的效率、稳定和信任。 Adonis 是最快的 Node.js Web 框架之一。
Express: 提供了创建 Web 服务器的最简单但功能最强大的方法之一。 它的极简主义方法，专注于服务器的核心功能，是其成功的关键。
Fastify: 一个 Web 框架，高度专注于提供最佳的开发者体验（以最少的开销和强大的插件架构）。 Fastify 是最快的 Node.js Web 框架之一。
Gatsby: 一个基于 React、由 GraphQL 驱动的静态网站生成器，具有非常丰富的插件和启动器生态系统。
hapi: 一个富框架，用于构建应用程序和服务，使开发者可以专注于编写可重用的应用程序逻辑，而不必花费时间来搭建基础架构。
koa: 由 Express 背后的同一个团队构建，旨在变得更简单更轻巧。 新项目的诞生是为了满足创建不兼容的更改而又不破坏现有社区。
Loopback.io: 使构建需要复杂集成的现代应用程序变得容易。
Meteor: 一个强大的全栈框架，以同构的方式使用 JavaScript 构建应用（在客户端和服务器上共享代码）。 曾经是提供所有功能的现成工具，现在可以与前端库 React，Vue 和 Angular 集成。 也可以用于创建移动应用。 Micro: 提供了一个非常轻量级的服务器，用于创建异步的 HTTP 微服务。
NestJS: 一个基于 TypeScript 的渐进式 Node.js 框架，用于构建企业级的高效、可靠和可扩展的服务器端应用程序。
Next.js: 一个 React 框架，可为你提供生产所需的所有功能的最佳开发者体验：混合静态和服务器渲染、TypeScript 支持、智能捆绑、路由预取等。
Nx: 使用 NestJS、Express、ReactAngular 等进行全栈开发的工具包！ Nx 有助于将开发工作从一个团队（构建一个应用程序）扩展到多个团队（在多个应用程序上进行协作）！
Sapper: Sapper 是一个用于构建各种规模的 Web 应用程序的框架，具有出色的开发体验和灵活的基于文件系统的路由。还提供 SSR 等！
Socket.io: 一个实时通信引擎，用于构建网络应用程序。
Strapi: Strapi 是一个灵活的开源 Headless CMS，可使开发者可以自由选择自己喜欢的工具和框架，同时还允许编辑人员轻松地管理和分发其内容。 通过使管理面板和 API 可以通过插件系统进行扩展，Strapi 使全球最大的公司能够加速内容交付，同时构建优美的数字体验。
特异功能
Typed.js： 一个轻松实现打字效果的js插件
Faskclick： 一个简单易用的库，它消除了移动端浏览器上的物理点击和触发一个 click 事件之间的 300ms 的延迟。目的就是在不干扰你目前的逻辑的同时，让你的应用感觉不到延迟，反应更加灵敏
Typed.js： 非常轻量的开源手势库
introjs： 是一个轻量级的js库，用于创建产品引导
pinyinjs： 一个实现汉字与拼音互转的小巧web工具库
json-stringify-safe： 更安全的进行stringify，避免类型循环引用等情况的报错
commitizen： commit提交规范
nprogress： 浏览器顶部展示进度条--注意css里用来z-index:固定值--可能与页面的z-index发生冲突导致问题
numeraljs： 多种数据格式化处理
