人的一生应当像一条河，开始是细小的，被限制于狭窄的河岸之间，然后热烈地冲过巨石，滑下瀑布，然后河道越来越宽了，水流越来越平稳了，浩浩荡荡，无拘无束地奔向永恒的大海。
前端代码编辑器与调试工具 / IDE & DEBUG / 在线 IDE
VS code(Visual Studio Code) | Webstorm | HBuilder(国产) | Sublime Text | Atom
Chrome 开发者工具 | Debugger | vConsole (移动端 App 内嵌 Web 调试) | eruda (移动端 App 内嵌 Web 调试) | Postman (接口调试与管理) | Postwoman (接口调试与管理) | Fiddler (网页 / 接口抓包调试) | DoraemonKit/miniapp | whistle | SwitchyOmega | mdebug(类 vConsole)
stackblitz | codesandbox | github.dev | codepen.io
前端编码规范（CODE STANDARDS & STYLE）
Javascript ES 6 | Javascript ES 5 | Learn ES2015 | JSDoc 中文文档 | TypeScript Handbook | DefinitelyTyped | awesome-typescript | typescript-definition-style-guide | Eslint | CSS | React | FP (Functional Programming in javascript) | html5-boilerplate
CamelCase | PascalCase | Hungarian notation
OOCSS | BEM
CommonJS / CMD | Asynchronous module definition / AMD
FLIP Your Animations
WAI-ARIA roles
Git Commit 标准化
JAVASCRIPT 库（JAVASCRIPT LIBRARIES）
jQuery | Zepto | Immutable-js | Lodash | Ramda | Underscore | Mootools | rxjs – A reactive programming library for JavaScript | You-Dont-Need-jQuery
前端 MV+ 框架、单页面程序及相关（MV+ & SPA）
React | Vue.js | Angular.js | Elm | Hybrids | svelte | Backbone.js
Awesome-vue | Awesome-react | Redux | zustand 【Why zustand over redux?】 | jotai 【Jotai scales from a simple useState replacement to an enterprise TypeScript application】 | Flux | Angular-Styleguide | Backbone.marionette | Backbone-fundamentals
Redux 中文文档 | todomvc [MV* framework 入门必备]
WEB COMPONENT
Web Components | lit-element | lit-html | omi | riot
静态网站生成 / 服务器端渲染 / 文档生成工具（STATIC SITE GENERATOR / SSR / DOCUMENTATION SITE GENERATOR）
next.js | nuxt.js | gatsby | vuepress | hexo | Docusaurus
docsify | gitbook | smart-doc [国产] | redoc | knife4j [国产] | yapi [国产] | bisheng [国产] | 觅道文档 [国产 支持本地部署] | 语雀 [国产 在线文档
NODE.JS 后端框架（NODE.JS BACKEND FRAMEWORKS）
Express | Fastify | NestJS | Koa | eggjs
微前端（MICROFRONTENDS）
qiankun（乾坤） | microfrontends | single-spa | mooa | ice-lab / icestark | Paciolan / remote-component | Webpack / Module Federation
大前端多端实现 小程序 / NATIVE & HYBRID NATIVE / 桌面端（NATIVE）
mina | wepy | uni-app | taro | mpvue
react-native | weex | PhoneGap | ionic | meteor | WebViewJavascriptBridge | framework7
electron | nw.js
Flutter | quasar （多端不含小程序）
Sketch 面板插件开发 | Photoshop 面板插件 开发 | Chrome 插件（Extensions）开发
前端构建工具 / 包管理工具 / 打包工具（BUNDLE & BUILD）
Npm – a package manager for javascript | NVM – Node Version Manager | Yarn – a dependency management | lerna – A tool for managing JavaScript projects with multiple packages. | Pnpm – Fast, disk space efficient package manager. | Webpack – a bundler for modules | Rollup – Next-generation ES module bundler | Grunt | Gulp | Bower – package manager | Browserify | FIS
snowpack | vite (used by Vue 3) | esbuild (used by vite & snowpack)
Nx 【HOT】 | tsup 【HOT】
JAVASCRIPT 模块加载器（MODULE LOADERS）
样式预处理工具（STYLE PREPROCCESSING）、CSS-IN-JS 技术
Less | Sass / Scss | Stylus
Styled-components | css-modules（react 脚手架已集成）
UI 库 / UI 管理后台模版（UI / ADMIN TEMPLATE） / 全栈解决方案（FULL STACK SOLUTIONS） / GUI
Bootstrap | Tailwind CSS | Framework7 | SUI Mobile | WeUI | jQuery WeUI | Bootstrap Material Design | Material Design Lite | carbon | Materialize | SUI | Amaze UI | AdminLTE | Foundation-sites | Ant Design（React / Vue） | Element UI（Vue） | iview（Vue） | vuetify | Semantic-UI | Primer | Jquery-ui | Jquery-ui-bootstrap | Bulma | Milligram | Mint UI（Vue Mobile） | Vant UI（Vue Mobile） | Cube UI（Vue Mobile） | Vue Strap | Kendo UI[收费专业级] | DataV[类似阿里DataV，大屏数据展示] | microsoft / fluentui | daisyUI – Tailwind CSS Components
EasyUI | Extjs
vue-element-admin | iview-admin | ant-design-pro | vue-manage-system | antd-admin | yezihaohao/react-admin | marmelab/react-admin | marmelab/ngx-admin | coreui-free-bootstrap-admin-template
jeecg-boot【java 一键生成前后端代码】 | renren-fast【java 一键生成前后端代码】 | eladmin【java 一键生成前后端代码】 | RuoYi【java 一键生成前后端代码】 | mall-admin-web【java】 | Springboot_v2【java】 | yii2_fecshop【php】 | CRMEB【php】 | laravel-vue-spa【php】 | laravue【php】 | SpringBoot-Shiro-Vue【Java】 | Davinci【Java】 | gin-vue-admin【Go】
Vue vben admin（vue3,vite2,TypeScript 开箱即用的中后台前端解决方案）
【GUI】
mo.js
低代码前端（LOW CODE FOR FE）
amis | react-jsonschema-form | form-render | form-create | vue-form-generator | vue-form-making | form-generator | alibaba / formily | react-visual-editor | 鲁班H5 | x-render | lowcode-engine | alibaba / designable | google / Blockly
轮播插件（CAROUSELS）
Swiper | Slidesjs | Swipe | jQuery Cycle Plugin | Nivo-Slider | OwlCarousel
Reveal.js | FullPage.js | Impress.js
瀑布流布局（WATERFALL）
图片懒加载（LAZY LOAD）
拖拽 / 监听触屏 / 划动事件 / 滚动（DRAG & RESIZE / SWIPE TOUCH / SCROLL）
react-dnd | react-draggable | vue-draggable-resizable | moveable | Vue.Draggable | TouchSwipe | Hammer.js | iscroll | mobileSelect | react-virtualized
媒体播放（MEDIA PLAYER HTML5 / FLASH）
videojs/video.js | Selz/plyr | Bilibili/flv.js | mediaelement | DPlayer
CSS 3 动画库（CSS 3 ANIMATION）
animate.css | css-loaders | hamburgers | Hover.css | animateplus | hint.css
图形 / 图表 / 图库 / 流程图（CHARTS / FLOW CHARTS）
Echarts | plotly.js | Highcharts | Chart.js | d3 | visx | morris.js | c3 | fabric.js | rough | paper.js | zrender（A lightweight canvas library which providing 2d draw for ECharts） | konva | cube.js（Cube.js – Open Source Analytics Framework 开源全栈 BI 框架） | p5.js | jsplumb
mermaid | bpmn-js | GoJS | mxGraph / drow.io | react-diagrams | svgedit
JsBarcode | node-qrcode | vue-kityminder-editor | flowchart-editor | 百度脑图 | LeaderLine | lazy-line-painter | maker.js | miniPaint [在线 PS] | photopea [在线 PS] | relation-graph | G6 | GGEditor | X6 | XFlow | butterfly | dagre-d3 画关系（流程）图插件 | excalidraw | d2-playground | SVG Tutorial
3D / HTML5 游戏制作 / 3D 引擎 / AR / VR（3D / GAME & 3D ENGINES）
phaser | Egret | Cocos2d | layabox（小游戏） | Createjs | Pixi.js | Playcanvas
Three.js | AR.js | ogl | Aframe VR | greensock / GSAP | Babylon.js | Hilo3d (Alibaba Group) | ThingJS (国内闭源) | Hightopo / HT for Web (国内闭源) | 3DTilesRendererJS | three-gltf-viewer | glTF-Sample-Viewer | KhronosGroup / glTF
webgl-fundamentals | gl-matrix | twgl.js | GLSL ES 1.0 spec | webgl 官网（OpenGL ES for the Web） | WebGL State Diagram | WebGLSamples | glslify – A node.js-style module system for GLSL | The Book of Shaders | GLTransitions
Pannellum（全景） | Krpano（全景，收费）
地图（MAP）/ GIS
百度地图 | 高德地图 | Leaflet | Openlayers | deck.gl | cesium | mapbox-gl-js | webgl-wind | itowns（three.js based）
时间库 / 插件（DATE & TIME）
dayjs | moment | date-fns | bootstrap-datepicker | fullcalendar | Pikaday | My97DatePicker
富文本编辑器（EDITOR）/ 代码高亮、代码编辑器（HIGHLIGHTED）
wysiwyg-editor | quill | CKEditor | alloy-editor | ueditor | umeditor | mavonEditor
Prism | CodeMirror | highlight.js | monaco-editor | theia | tiptap | tui.editor | lexical
进度条 / 可调进度条（PROGRESS BAR）
nprogress | bootstrap-slider | progressbar.js | pace
上传文件（FILE UPLOADER）
dropzone | jQuery-File-Upload | fine-uploader | plupload | uppy | webuploader
前端模版引擎（TEMPLATE COMPILER）
ArtTemplate | BaiduTemplate | mustache.js | Underscore Templates | Pug (jade) | doT
加密解密（ENCODE / DECODE）
js-base64 | JavaScript-MD5 | jwt-decode | crypto-js
测试 / 单元测试（TEST / UNIT TEST）
jest | mocha | enzyme | jasmine | nightwatch
前端算法（ALGORITHM）
Yjs-CRDT-Algorithm | wavefunctioncollapse | javascript-algorithms | QuadTree | sparse-octree | dagre | A Primer on Bézier Curves | tween.js | flatten-js | 各种求交算法 intersect、AABB、OBB、Ray、AStar、BVH、Dijkstra 等等 | 经典的 Reingold–Tilford tidy 布局算法、生态树 Dendrogram 布局算法、缩进树 IndentedTree 布局算法、脑图树 Mindmap 布局算法等等 | 常见的图像插值算法包括最近邻插值（Nearest-neighbor）、双线性插值（Bilinear）、双立方插值（bicubic）、lanczos插值、方向插值（Edge-directed interpolation）、example-based插值、深度学习等算法
其他（OTHERS）
clipboard.js | fastclick | html2canvas | dom-to-image | Print.js | pico | sheetjs（excel） | jexcel | x-spreadsheet | tesseract.js（OCR） | brain.js（Neural networks in JavaScript） | jsPDF | pdf-lib | awesome-javascript | qs（Query String） | draggable | js-cookie | Mock | Font-Awesome | lib-flexible | json2csv
faker.js | Mock | tracking.js
前端开发的一些插件汇总【 2024-4-2 增加会有重复 】
postcss-px-to-viewport 适用于pc端各种分辨率兼容：yarn add -D postcss-px-to-viewport
wangEditor 有丰富的 API 和足够的扩展性，允许你自定义开发菜单、模块、插件等。
parallel.js: 前后端通用的一个并行库
zepto: 用于现代浏览器的兼容 jQuery 的库
totoro: 稳定的跨浏览器测试工具
TheaterJS: 一个用于模拟人输入状态的 JS 库
stellar.js: 前端用于实现异步滚动效果的库，现已不再维护
skrollr: 另一款实现一步滚动的开源库，使用人数众多，可实现各种狂拽酷炫掉渣天的前端效果，看真相
Framework7: 前端框架，是开发人员可以基于 web 技术构建 IOS7 程序
regulex: 用于生成 正则表达式 的可视化流程图
markdown-it: 新型 Markdown 解析器，快速，支持插件
multiline: 用于 Javascript 中的多行文本，类似于 Ruby 的 HERE Doc
screenfull.js: 全屏插件，支持各大浏览器
lunr.js: 类似于 Solr, 但是用于浏览器上的全文搜索引擎，可以为 JSON 创建索引，离线也可以使用
jquery.hotkeys: jQuery 插件，用于绑定热键
breach_core: Javascript 编写的 Browser (浏览器)
octocard: 用于生成 Github 信息卡片的库
github-cards: 用于生成 Github 信息卡片的库
money.js: 轻量级货币转换库，web 和 node 皆可用
accounting.js: 轻量级的数字、货币转换库
javascript-algorithms: Javascript 实现的各种算法集合
lazy.js: 类似于 underscore, 但是会延迟执行，某些场景下，性能会有很大的提升
seajs: 前端模块加载器，解决模块化、依赖等问题
jQuery-One-Page-Nav: 单页应用中一个用于处理导航栏的库
js.js: Javascript 实现的 javascript JIT
jquery-ui: jQuery 团队开发的 UI 相关的前端库，功能强大
todomvc: 分别基于 AngularJS/EmberJS/Backbone等实现的 TODO List, 帮助开发者选择前端 MVC 库
localForage: Mozilla 出品，用于离线存储，基于IndexedDB, WebSQL 或者 localStorage, 提供一致的接口
EventEmitter: 浏览器版的 EventEmitter
jquery.serializeJSON: jQuery 插件，用于将 form 表单序列化成 JSON 数据
knockout: 前端 MVVM 框架，用于开发富前端应用
mermaid: 可以根据文本生成流程图，类似于 Markdown 的语法
js-sequence-diagrams: 另一款可以根据文本生成流程图的库，类似于 Markdown 的语法
flow: 一个用来检测 Javascript 语法错误的库， Facebook 出品
zoomooz: jQuery 插件，用来处理浏览器缩放
fancyBox: 一个用于放大缩小图片、Web 内容或者多媒体元素的库，优雅大方
mithril.js: 轻量型前端 MVC 框架，部分使用场景下性能优于 Angular.js 和 React
backbone: 强大的前端 MVC 库，鼻祖级前端库，最初为了配合 Rails 来模块化前端应用，兼容性良好 (兼容到 IE6)，插件丰富，性能良好
jquery.smartbanner: smartbanner 是从 IOS6 开始支持的一个新特性, 这个插件提供了对早期 IOS4/5 和 Android 的支持
jquery.scrollTo: 在页面上以一个元素为起始以动画的方式移动(ScrollTo)到另一个元素， 支持回退等
jScrollPane: 自定义的滚动条，让所有浏览器都显示一样的滚动条
onepage-scroll: 提供类似于 iPhone6 展示页类似的效果，适用于单页应用，兼容到 IE8
scrollMonitor: 前端插件用来监控元素的滚动事件(进入、退出等)，性能很好
ScrollMagic: 神奇的滚动交互效果插件，可以在滚动的过程中设置各种各样的动态效果
infinite-scroll: 滚动加载，滚动到最下到自动加载， Paul Irish 大神之作
animatable: 仅仅依靠 border-width 和 background-position 实现的各种动态效果，看真相
Fluidbox: 页面上内嵌图片的放大缩小效果，类似于 Medium 中的效果
jquery-validation: jQuery 的一个插件，用于校验 Form 表单
BigVideo.js: jQuery 的一个插件, 用于实现大背景(视频、图片)效果
emscripten: 一款基于 LLVM, 可以将 C/C++ 转换成 Javascript 的工具，使得 Javascript 可以近乎 Native 的速度
qrcode-generator: 各种语言的二维码生成工具
device.js: 一个可以检测设备类型的工具，可以让我们根据不同的设备来为其定制响应的 Javascript 和 CSS
jquery-qrcode: jQuery 插件，用来生成二维码
Wookmark-jQuery: jQuery 的一个插件，可以用来实现瀑布流的效果
isotope: 可以用来过滤、排列布局，实现美观的动态布局切换效果，Demo
lazysizes: 功能强大的图片延迟加载工具，可以首先加载一个低质量的图片，然后再加载高质量的图片
progressbar.js: 简洁美观的进度条，扁平化
pigshell: 一个由 Javascript 实现的Shell, 将互联网当做一个大的文件系统, 通过 cd/ls/cat…..等命令, 可以访问 Facebook/Twitter/Google Drive 等网络服务
spectrum: Js实现的颜色选择器 (Colorpicker)
jQuery.countdown: jQuery 倒计时插件
summernote: WYSIWYG 富文本编辑器
awesomplete: 非常轻型的一个自动补全 JS 库, 没有任何依赖, 配置简单, 美观
switchery: IOS 7 上 Switch 的 JS 实现, 支持 IE8 及以上浏览器
trix: Basecamp 公司出品的富文本编辑器，简洁小巧
sensor.js: 在智能移动设备浏览器上，通过HTML5的api使用移动设备的功能。定位、运动、倾斜等
hyhyhy: 用于创建 基于 HTML5 的 演示文稿
swipebox: jQuery 插件，用于处理移动端的触摸事件
FileAPI: 前端用户处理文件（拖放、多文件上传等）
Sortable: 现代浏览器上用于实现元素拖拽排序的功能，支持 Meteor, AngularJS, React，不依赖 jQuery
Swiper: 用于实现浏览器上的滑动切换效果，支持硬件加速
matter-js: 2D 物理效果引擎，碰撞、弹跳等
jQTouch: 用于辅助创建手机端的 Web 应用，支持主题、Zepto.js 等
snabbt.js: 一个利用 Javascript 和 CSS transform 的 animation 库
c3: 基于 D3 的图表库
echarts: 企业级图表库，百度开发
parallax.js: 一个用于响应智能手机 orientation 的库
jQuery-Animate-Enhanced: jQuery 动画库的一个增强，用于现代浏览器
wysihtml: 富文本编辑器，适用于现代浏览器
slip: 一个通过滑动或者拖拽来操控列表的库
evil-icons: 一个矢量图库，提供 Ruby/Node 等支持
PhotoSwipe: JS 的一个图片展示库
focusable: 是页面上一个元素高亮的库，有图有真相
firefox.html: Firefox 在浏览器端的实现 —— HTML 版的 Firefox
jquery-mobile: jQuery 团队开发的用于辅助手机端 web app 开发的库，基于 HTML5
mobile-angular-ui: 基于angularjs和bootstarp的web app开发框架
interact.js: 一个适用于现代浏览器的，用于处理 手势、拖放、缩放等的库
rebound-js: 实现部分物理效果，Facebook 出品
basket.js: 基于 LocalStorage 的资源加载器，可以用来缓存 script 和 css, 手机端使用速度快于浏览器直接缓存
iscroll: 高性能的滚动(scroll)处理库，功能强大，支持各种事件，不依赖任何的库，且插件丰富, 大众点评的手机端列表滚动就是用这个库处理的
metrics-graphics: 基于 D3 的图表库，简洁、高效，Mozilla 出品
accessible-html5-video-player: Paypal 出品的 Video 播放器
loading: 几种 Loading 效果，基于 SVG
flippant.js: 一款能够漂亮的网页元素翻转效果库，代码许久不更新，不过作为源码学习还是不错的
move.js: 基于 CSS3 的前端动画框架
scrollReveal.js: 使元素以非常酷帅的方式进入画布 (Viewpoint)，看 Demo
Modernizr: 一个用来检测 HTML5 和 CSS3 支持情况的库
foundation: 另一款前端模版框架，类似于 Bootstrap
Flat-UI: Bootstrap 的一款主题，简洁美观
iCheck: 一款漂亮的 Checkbox 插件
Swipe: 非常轻量级的一个图片滑动切换效果库, 性能良好, 尤其是对手机的支持, 压缩后的大小约 5kb
slick: 功能异常强大的一个图片滑动切换效果库
SocialButtons: 漂亮的社交按钮
sweetalert: 一个非常美观的用于替换浏览器默认 alert 的库
web-animations-js: Javascript 实现的 Web Animation API
vivus: 可以动态描绘 SVG 的 JS 库, 支持多种动画
plyr: 轻量, 小巧, 美观的 HTML5 视频播放器
timesheet.js: 基于 HTML5 & CSS3 时间表
slideout: 一个非常美观的侧滑菜单