个人收藏列表（文章，博客，网站，插件）

优秀文章

• 《从Chrome源码看浏览器如何计算css》
• Effective前端1：能使用html/css解决的问题就不要使用JS
• Effective前端2：优化html标签
• 从Chrome源码看audio/video流媒体实现
• javaScript 的使用规范
• 一行css代码解决响应式
• 用vue3公开的思路从0实现最简化的vue
• 完整的理解let
• JS-Object 功能详解
• vuejs组件通信精髓归纳
• vue源码逐行注释分析+40多m的vue源码程序流程图思维导图（diff部分待后续更新）
• 移动端web 最佳实践，基于vue-cli3 搭建的typescript 项目，可以用于hybrid 应用或者纯webapp 开发。以下大部分内容同样适用于react 等前端框架。
• 基于 Vue 的 PWA 解决方案，帮助开发者快速搭建 PWA 应用，解决接入 PWA 的各种问题
• 饿了么的 PWA 升级实践，现在的阶段看看依然有很大的收获
• 技术面试必备基础知识
• 基于node的cms系统
• 如何实现页面懒加载（英文）
• Blob进行文件上传
• JavaScript 算法与数据结构
• 逐行剖析Vue.js源码
• Deno 进阶开发笔记
• WebKit 介绍，如何让网页更节能
• Vue实现一个电子签名
• 剖析 Promise 内部结构，一步一步实现一个完整的、能通过所有 Test Case 的 Promise 类
• 125 行代码实现一个静态博客生成器
• CSS3奇思妙想，单标签实现各类图形
• 为什么这么设计系列文章是一系列关于计算机领域中程序设计决策的文章，我们在这个系列的每一篇文章中都会提出一个具体的问题并从不同的角度讨论这种设计的优缺点、对具体实现造成的影响
• 也许这才是你想要的微前端方案
• 该库对排名较高 Node.js 的最佳实践进行了总结和整理
• JavaScript数组去重（12种方法，史上最全）
• 反编译获取任何微信小程序源码
• 使用 CodeMirror 打造属于自己的在线代码编辑器
• 基于 Markdown 文档展示系统设计

优秀博客

• 会编程的银猪
• 阮一峰老师的科技周刊
• 每天一个JavaScript小技巧
• JavaScript 秘密花园——一直更新的JavaScript语法文档
• 奇舞周刊
• 博客十年之约，你是否能坚持写博客十年？

前端资源

• 免费的编程中文书籍索引
• 前端开发所使用语言的主流学习资源
• 现代 JavaScript 教程
• WEB动画周报
• 前端面试题
• AI将草图绘制成HTML
• 小飞机搭建流程
• Front End | JavaScript Fun | 前端工坊,记录了目前前端用到的一些技术框架

配色网站

• 一个可以根据设置的颜色实时显示渐变结果的网站
• 渐变颜色配置网站
• 日本风格的传统颜色配置
• 中国传统颜色
• 自己生成炫光背景图
• 一个方便使用的在线色表，列出中国古典的常见颜色

前端的工具

• 在线css工具，生成渐变，更改边框半径，噪点纹路，盒子阴影
• 快速在线创造带剪头的提示框
• 9常用的css样式生成
• css网格生成
• css网格在线生成
• css兼容性查询
• css3渐变代码生成
• 漂亮的css样式集
• flutter-UI拖拽生成代码
• Dart项目生成器(脚手架)
• 一个非常可爱的 React 卡通人脸库
• immer的ReactHooks版
• yarn-lock-cli以直接修改yarn.lock文件中的源地址
• 中国内地的Node.js开发者准备的镜像配置
• 正则的小工具站，支持图形界面/vscode插件2种查询方式
• 基于浏览器的在线代理软件
• ant-design 组件库实时可视化编辑器，实时生成 react 代码
• webiny-js 是 GraphQL + React 实现的 CMS 系统，支持在线拖拽和代码块
• 使用 NodeJS 监听文件夹变化
• package.json 参数详解，并且提供了该参数相应的案例
• vConsole针对手机网页的前端开发者调试面板
• 阿里开源的可视化图表工具F2
• 大屏数据可视化demo
• 用于软件和Web开发的免费API的集合列表
• 在线创建动画，适用web以及H5
• API管理&自动化测试平台
• CSS例子灵感
• 基于vue-element的简单页面可拖拽
• 图片占位符,使用方法
• CSS 奇技淫巧，在这里，都有
• loading样式生成
• 用Node.js编写的HTTP代理服务器
• 基于Node实现的跨平台抓包调试代理工具
• 一套React Native代码转换成微信小程序代码的转换引擎工具
• Web 与小程序同构解决方案
• 极简又极其强大的笔记应用TEA
• 开源 #图标 UI 库。支持 CSS、SVG、Figma、NPM 等
• VSCode 彩虹屁插件,在你开发的时候侦测关键字然后疯狂夸你写的牛逼
• SVG Sprites还原工具，内置Font Awesome小图标，可单独下载
• 基于Vue-Cli3的webpack脚手架
• 将打印的数学公式转成 LaTex 代码的工具。
• 命令行工具，可以显示你的 Gmail 邮箱的统计数据
• https://github.com/FiloSottile/age
• 开源的 Web 端 RSS 阅读器，基于 Python。
• 一个在线的架构图、流程图工具。
• 一个反向代理服务器，可以将内网的服务映射到公网
• 一个命令行的 JSON 数据查询工具，有更简单的查询语法
• 一个 JavaScript 工具，可以将 node.js 模块转成单个的 JS 文件，替代 Webpack 这样的打包工具
• 一个技术文档网站的服务端，适合展示团队的技术文档、API 文档
• 一个可以通过拖拽生成 React 应用的可视化框架
• AI 写作助手，可以给出文章中的语言错误
• 一个 Python 代码的加密器，可以防止别人看脚本源码
• 一个 Go 语言写的 HTTP 抓包分析器，带有 Web 界面
• 开源的知识管理软件，支持 Web 、命令行和浏览器插件
• 一个网页可视化编程框架，带有节点编辑器
• 一个开源的视频会议软件，使用 WebRTC 技术
• 开源的远程教育软件，也可用作视频会议
• 一个 Python 脚本的调试工具，并可以生成脚本运行流程的可视化视频
• 这个网站显示 JavaScript 可以收集多少用户信息，当作唯一指纹，用来追踪用户
• 一个为网页插入评论的 Web 服务，可以作为 Disqus 的替代品
• 一个 WASM 模块，用来生成随机密码，可以在命令行使用，也可以作为自定义元素插入网页
• 一个非常简单易用的白板绘图开源工具
• 一个基于 Web 的视频会议软件，可以共享白板和视频，并且能够合作编程
• 中文的字体文件都非常大，网页全部加载不现实。这个工具可以从字体里面，选取网页需要的字符，生成新的字体文件
• [https://github.com/anye931123/react-visual-editor](React 的组件可视化拖拽页面编辑与代码生成工具，让不会 React 技术栈的人员可以通过拖拽生成页面)
• 一个轻量的电子邮件推送开源工具，可以与网站的用户反馈、留言等功能进行集成，将数据填入模板，投递到指定的邮箱
• 一站式的 Kafka 集群管理和维护平台，代码开源，完善的权限设计，使用方便，无需精通 Kafka 就能管理集群
• 一个开源的国产 API 网关，可以作为前后端之间的映射层。基于 OpenResty，性能好，功能强
• 一个 Node.js 库，MySQL 数据库的 ORM 映射层，使用很简便，但是功能也比较少
• 一个可以自己架设的网盘服务，适合搭建在内网，从 Web 界面上传和下载文件
• 一个轻量级 Markdown 笔记网站，不需要注册，只需要为文档指定密码，适合随手写一点东西分享出去
• 一个生成虚拟 JSON 数据的在线工具，可以根据给定的模式，自动生成 JSON 数据
• 一种安全令牌的数据格式，比 JWT 更安全，同类项目还有 Paseto
• 同类型的安全令牌数据格式Paseto
• 一个支持多种关系型数据库的图形界面的数据库管理工具
• 一个开源软件，只需要提供一张头像照片，就可以生成人物开口讲话的视频
• （小悦记）Chrome 浏览器插件，可以一键导出微信读书笔记
• 一个制作幻灯片的在线工具，只需要少量拖拽和对齐操作，就可以生成通过浏览器播放的幻灯片
• 一个开源的桌面软件，用于简化 API 的设计和开发
• 一款国产的桌面 Markdown 笔记软件
• 一款安卓应用，支持上传手机照片到图床（七牛云、阿里云、又拍云、GitHub、码云等
• 一个 Markdown 格式的笔记软件，使用目录层级整理笔记。可以下载安装桌面版，也可以自己架设在线版
• 一个本地的代理服务器，用于本地数据包捕获，可以实时 hosts 绑定、设置规则转发、mock 接口、修改请求和响应的内容等
• 一款浏览器插件，可以修改浏览器发出的网络请求，相当于简易版的 Postman
• HTML 代码的最小化工具，可以精简网页源码的体积。Rust 语言写的，有 Node.js、Python、Java、Ruby 的移植
• 一个远程调试网页的工具，只要在网页里面加载这个库，就可以远程打开 Chrome 开发者工具，主要用于调试手机端网页
• 一个开源的 Web 商城项目，基于 Spring Boot 和 Vue.js，支持 Web 端和移动端
• 这个工具可以拦截和查看 HTTP/HTTPS 请求，并且可以 mock 服务器的回应
• 一个 Node.js 写的 Web 服务器负载性能测试工具
• 一个开源的在线工具，从上传的图片里面提取两种主色，生成一张渐变的背景图，可以下载
• 实时提升卡通动画的分辨率，使其成为高清动画的工具
• 微信群聊同步到 Web 的开源工具
• 一个终端窗口颜色主题的安装工具，目前有170多种配色方案可选择，支持 Linux 和 Mac
• 数据可视化工具
• 可以生成无线滚动的中国山水画，最终生成的山水画是SVG格式的
• App(Object object) | 微信开放文档
• markdwown转化成思维导图的工具
• 一个将 Markdown 转为思维导图的开源工具
• 适合微信排版的Markdown编辑器
• knife4j是为Java MVC框架集成Swagger生成Api文档的增强解决方案,前身是swagger-bootstrap-ui,取名kni4j是希望她能像一把匕首一样小巧,轻量,并且功能强悍!
• PTS（Performance Testing Service）是面向所有技术背景人员的云化测试工具。有别于传统工具的繁复，PTS以互联网化的交互，提供性能测试、API调试和监测等多种能力
• docsite 是一款开源站点搭建工具，依据其提供的功能，能够快速搭建一个开源站点。
• 啄幕鸟，即手机屏幕上的啄木鸟，专抓App里的Bug。简便易用，零侵入、零依赖、易接入、易扩展。
• 即视可视化-安全快速搭建企业数据大屏
• React/Vue应用自动化构建脚手架，其零配置开箱即用的优点非常适合入门级、初中级、快速开发项目的前端同学使用

插件

• css动画框架
• 一个手绘样式的css框架
• 创建一个类似于手绘效果的图形
• 手绘风格的 React 图表库
• 生成手绘风格的流程图的在线工具
• 一个 XKCD 漫画风格的网页图表库
• 生成手绘风格图片的 JS 库
• 可以抽离图片中的两种主色调做成渐变
• 一个移动端裁剪图片的插件
• jExcel是一个轻量级的javascript插件，用于创建基于web的交互式表格和电子表格，这些表格与Excel或任何其他电子表格软件兼容。
• FileSaver.js 是一款基于 HTML5 完成文件保存插件
• 一个集成了下拉刷新、上拉加载、无限滚动加载的Vue组件
• 基于Spring物理的React动画库
• 小红书用的 HTML5 视频播放器
• 可以高亮所有带有 <pre/> 元素的代码
• 把时间转换成毫秒单位
• 将字节大小转成可以读的字符串
• 在浏览器中，实现类似烟雾的流体流动
• 可以将字母、数字、转换为奇怪的字体样式
• 用于生产网站的sitemap.xml
• QRCode 二维码生成器可后台调用
• Web 网站的用户 “引导” 程序
• 基于HTML5的API实现录音
• themer采用一组颜色并为您的应用程序生成主题
• EditorJS是个全新风格的开源编辑器
• 基于Vue2的在线音乐播放器
• 基于Vue2的提示插件
• laxx 是一个滚动特效库
• BetterScroll旨为解决各种滚动场景
• 一款浏览器端的 Markdown 编辑器
• 打字机效果的插件
• 无依赖的图片懒加载插件
• Web最快且最具内存灵活性的全文搜索库，具有零依赖性
• 一个类moment.js的轻量的处理时间和日期的 JavaScript 库
• Vue的时钟插件
• emoji表情集成
• 前端搜索库
• 基于element-ui的数据驱动表单组件
• 用于纯JavaScript的服务器端和客户端的PDF文档生成库
• 用于处理数字格式化，比如金额，千分位等
• js 常用函数库
• Vue的区域选择插件
• 前端常用插件、工具类库汇总
• 通过XHR2在浏览器上预加载资源
• clipboardy 可以使用这个类库操作系统剪切板
• 一个vue版本的区域联动选择器
• Element 团队开发的使用于手机客户端的 Webpack 骨架生成插件
• underscorejs——一个可以让JavaScript函数式编程的实用库
• 移动端二级联动订餐列表
• 安卓平台上的JavaScript自动化工具
• PC端可以捕捉键盘输入与输入按键组合
• 一个强大的react版的图片处理插件
• 强大的中国行政区划选择器，可以四级联动
• 功能齐全的JavaScript日程安排日历
• 用于手机浏览器的虚拟的可自定义数字键盘，支持原生，Vue，React，Angular
• 一个极度纯净的上传插件，支持多文件上传、上传速率动态控制、真实进度监控 kb/s、分块生成 MD5、分块上传、MD5 校验、暂停、取消等功能
• 基于 Vue2 强大的选择器, 可分页的列表或表格展现形式
• JavaScript图像查看器
• 在线图片剪切控件，支持鼠标缩放，旋转
• 零依赖的JavaScript图像处理库
• yup 是一个可以对数据规则验证的库
• 检测当前路径是否是工作区的文件夹
• 图片预览库，支持拖动和缩放
• 友好的全局匹配插件
• 删除未使用的CSS
• 手绘风格的图标库
• extend2 可以用简单的方式实现深度克隆
• store.js可兼容IE6的本地存储库，API简洁
• 处理数组，对象，字符串等的工具库
• 精美的HTML5 音乐播放器插件
• 新功能步骤导航 Guide
• 300百行代码实现汉字转拼音插件
• 纯浏览器压缩图片插件
• 无依靠的滑动验证插件
• 根据文本框当前光标弹出提示框
• react-kanban 是一个看板组件，有点像是 GitHub 的 Projects、
• 为你的网站添加加载进度条
• 一个支持所有JavaScript运行环境的基于Promise的、支持请求转发、强大的http请求库。
• DSBridge是一个Android、IOS、Javascript三端跨平台 Javascript bridge
• DSBridge-iOS版本
• 一个 JS 库，可以生成乐高积木的图案。
• 一个专门用于 OAuth2 登录的 JavaScript 库。
• 一个将英语或数字字符，转为 SVG 动画的 JS 库
• 一个手绘风格的安卓组件库。
• 开源的短链接生成器，基于 Node.js，允许自定义短链接、设置链接密码，还提供访问统计。
• 一个 JavaScript 语言的 OCR 库，可以在网页运行，识别图片中的文字。它支持100多种文字，包括中文。这里还有一篇教程，介绍 Python 语言如何使用这个库
• 一个使用各平台的 WebView 控件，构建跨平台桌面应用的 JavaScript 框架
• 一个极简的 CSS 默认样式库，目的是为 HTML 裸标签提供美观的样式
• 一个轻量级的 JS 网页动画引擎
• 一个 H5 视频播放器的 React 组件
• 一个网页顶部进度条的 JS 库
• 一个 JS 脚本，一行代码让网页从亮模式变为暗模式
• 一个模拟服务器 API 返回结果的前端 JS 库
• 一个 React 组件库，众安科技出品。特点是依赖少体积小（压缩后 60KB），扩展性好，样式命名采用了 BEM 规范
• 一个 HTML 的自定义元素（custom element），可以懒加载网页图片。这个元素的代码非常简单，可以作为学习自定义元素的写法范例
• 作者提供一段 JS 代码，只要插在网页里面，可以让 DOM 变动发出声音。如果 DOM 有改变，你就会听到声音
• 一个纯 CSS 库，提供各种形状的背景图案
• 一个纯 CSS 库，提供各种形状的背景图案（和上面同类型网站）
• 一个为手机浏览器加入控制台（console）的脚本库，可以用 Bookmarklet 注入外部网页
• 一个360度全景照片浏览的 JS 库
• 一个 Web 工具，可以识别手绘形状，返回对应 LaTex 数学符号
• 一个 JS 的网页小型图表库，用于快速渲染超大型数据集，系统资源占用少
• 一个示例项目，用 JS 写的 JS 解释器，可以用来学习用编译原理
• 一个 Maven 插件，根据谷歌公司的样式要求，自动对 Java 代码进行样式美化
• 一个静态网站的评论系统，不需要后端，数据储存在 LeanCloud
• 一个浏览器 JS 库，通过摄像头，实时捕捉用户的动作，生成 2D 动画
• 一个将 GitHub issues 用作静态页面评论功能的开源库
• 一个跨平台的命令行 UI 库，使用 Lua 编写
• 一个网页表格库，可以用作各种前端框架的插件
• 一个在浏览器进行 BT 下载的 JS 库，可以网页 BT 下载，也有桌面客户端
• 一个自动生成中国山水画的 JS 实现
• 斯坦福大学推出的 JavaScript 加密库，只有 6KB，API 也很简单，但可以提供最佳的安全性
• 一个浏览器的思维导图 JS 内核
• 一个轻量级的 JavaScript 脚本，可以把 Markdown + LaTeX 文档直接渲染成网页
• 一个在浏览器生成用户指纹的 JS 库，可以识别用户，不使用 Cookie
• API 文档的静态站点生成器
• 这是一个 React 表单库，基于 React Hooks，看上去代码相当简洁，star 也很高，也许以后可以摆脱那些笨重的表单组件了
• 一个极小的 uuid 生成的 JS 库
• 一个 JS 库，当用户鼠标悬停在链接上面，就开始预加载网页，从而使得用户真正点击的时候，页面瞬间就能加载
• 一个 JS 库，在网页插入迷你的页面缩略导航图，用户可以点击这个图的不同部分，实现快速导航
• 一个使用 Web Audio API 在浏览器创建交互式音乐的框架
• 一个较为轻巧的前端 JS 库，用来处理图像效果
• 一个前端 HTML5 的视频/音频播放器，特点是简单易用，定制性好
• 一个 JavaScript 的颜色操作库，可以使用各种方法对颜色进行操作
• 是一个轻量级的JavaScript库（压缩后压缩后小于5kb），用于浏览器或提供额外String方法的Node.js
• 更改大小写，修饰，填充，弹化，拉丁化，sprintfy，截断，转义等字符串操作功能
• 可帮助检测文本中的链接/ URL /电子邮件，并将其转换为可单击的HTML锚链接
• Underscore.string是受Prototype.js，Right.js和Underscore启发的Underscore.js扩展。为你提供了几个有用的功能：大写、清除、包括、计数、escapeHTML、unescapeHTML、插入，拼接、startsWith、endsWith、标题化、修剪、截断等
• 该库的主要亮点是它支持unicode
• umi团队推出的基于rollup和docz的打包工具father
• Midway Serverless 是一个用于构建 Node.js 云函数的 Serverless 框架，可以帮您在云原生时代更专注于产品开发，降低维护成本
• 一个类似electron的跨平台桌面框架
• 纯前端实现，在线图片格式转化器,可将jpeg、jpg、png、gif、webp、svg、ico、bmp文件转化为jpeg、png、webp动画、ico、gif文件
• pdf转word小工具
• 一个使“回到顶部”的网页滚动，具有电梯效果的js库
• 使用真正的 React 构建跨平台小程序
• 基于 TensorFlow.js 内核，实现了三种卷积神经网络架构，用于完成人脸检测、识别和特征点检测任务，可以在浏览器中进行人脸识别。其内部实现了一个非常轻巧，快速，准确的 68 点面部标志探测器。支持多种 tf 模型，微小模型仅为 80kb。另外，它还支持 GPU 加速，相关操作可以使用 WebGL 运行
• 一个独立的 JavaScript 库，主要实现了颜色和人（人脸、五官等）的跟踪检测。可以通过检测到某特定颜色，或者检测一个人体/脸的出现与移动，来触发 JavaScript 事件，然后对人脸进行采集。Tracking.js 是使用 CPU 进行计算的，在图像的矩阵运算效率上，相对 GPU 要慢一些
• 一个自适应的微信小程序自定义导航栏组件。
• 前端日志上报与JS异常监控
• JavaScript数字精度缺失解决库
• 允许你选择任何前端（React,Angular2 等）和任何后端（Node , Django 等），并将它们集成在一起以查看应用程序的真实示例。
• 可以获取到浏览器的唯一UUID
• Java的声明式api开发框架
• React看板组件
• tiptap是vue.js的无渲染和可扩展的富文本编辑器
• 完全可定制的富文本编辑框架 Slate.js
• 一个基于 Next.js 的简易脚手架，内含ant-design、redux、redux-saga、fetch以及pm2，从开发到部署一站式服务。
• 前端业务代码工具库
• CodeMirror是使用JavaScript为浏览器实现的多功能文本编辑器。它专门用于编辑代码，并带有 实现更高级编辑功能的多种语言模式和附加组件。
• 阿里妈妈前端团队出品的开源接口管理工具RAP第二代
• 领先的浏览器端解决方案，支持不同类型的PDF文件格式，包括：文本，数字，图形，图片，同时可以自由的编辑PDF中的标题或其它类型元素。曾经生成PDF是服务端代码的专利，而通过jsPDF则能够用前端脚本生成和控制PDF文件
• 纯JS实现读写各种电子文件的类库。
• 让开发者能直接在浏览器端处理表格数据，减少对服务端和网络的压力。
• 一个可替换的JavaScript textarea替代品，用于编写美观且易于理解的Markdown。
• markdown 编辑器
• SimpleMDE是一个简单，可嵌入且美观的JS markdown编辑器
• 在前端生成.docx格式的 Word 文档. DOCX.js是一个JavaScript库，用于将base64 DOCX文件中的数据转换为HTML，然后反向转换！请注意，该库是根据Microsoft Office可扩展文件许可（未经OSI批准的许可）许可的。尽管此许可证基于OSI批准的MS-PL，但仍存在很大差异。
• 这是一个很小的库，能够将HTML文档转换为Microsoft Word 2007及更高版本使用的DOCX格式。它使用“ altchunks”的功能设法在浏览器中执行转换。简而言之，它允许以其他标记语言嵌入内容。我们正在使用MHT文档将嵌入的内容发送到Word，因为它允许处理图像。Word打开此类文件后，它将外部内容转换为Word Processing ML并替换了引用。
• 通过使用文档中的语义信息并忽略其他细节来生成简单干净的 HTML
• 用 JavaScript 开发的 HTML to Markdown 转换器
• 一个将 HTML 源码转换为 Markdown 的 JS 库，可以定制规则
• 将网页转换成漂亮的 PDF