前端框架
零代码前端工具箱
零代码是一个面向前端开发者和设计师的在线工具集合,提供可视化的 CSS 样式生成器(Grid 布局、阴影、新拟态、玻璃态、渐变、按钮等),无需手写代码即可生成样式。此外还集成文档格式转换(PDF/Word/Excel/PPT)和免费文件传输等实用工具。
Ionic Framework
Ionic 是一个开源的跨平台移动应用 UI 工具包,用单一代码库即可构建 iOS、Android 和 Web 应用。支持 React、Vue、Angular,提供 100+ 预制组件和原生风格主题,并通过 Capacitor 访问相机、蓝牙等原生设备功能。
前端库
reveal.js
reveal.js 是一个开源的 HTML 演示文稿框架,只需浏览器即可制作美观的网页幻灯片。支持 Markdown 编写、嵌套幻灯片、自动动画、演讲者视图、代码高亮、LaTeX 公式和导出 PDF 等,并可通过 Slides.com 进行可视化编辑。
Leaflet
Leaflet 是一个轻量级(约 42KB)的开源 JavaScript 交互式地图库,对移动端友好。支持瓦片地图、标记、弹窗、矢量图形和 GeoJSON,提供拖拽平移、滚轮/双指缩放等交互,性能优秀且易于扩展,被 GitHub、Pinterest 等众多网站采用。
impress.js
impress.js 是一个受 Prezi 启发的演示框架,利用现代浏览器的 CSS3 变换与过渡,在无限画布上实现缩放、旋转等非线性的动态演示效果。无需 jQuery 等依赖,提供 JavaScript API 和插件扩展机制,让网页演示比传统幻灯片更具表现力。
clipboard.js
一个轻量的复制到剪贴板 JavaScript 库,无需 Flash,gzip 后仅约 3kb。它通过 data 属性即可实现从输入框、文本域或自定义文本的一键复制,使用事件委托高效处理,并提供 success/error 事件回调与旧浏览器降级支持。
react-window
一个用于高效渲染大型列表和表格数据的 React 组件库。它采用虚拟化技术只渲染可视区域内的内容,从而避免一次性渲染海量数据导致的性能问题,提供 List 与 Grid 组件、灵活的尺寸配置和滚动控制 API,被 React DevTools 等项目采用。
Radash
一个面向现代 JavaScript/TypeScript 的零依赖、强类型工具函数库,被视为 Lodash 的现代替代。它刻意不重复 map/filter 等原生已足够的方法,而是提供 try(错误优先的异步处理)、range、select、defer、objectify 等真正实用、可读性强的工具函数。
Danmaku-Plus
一个用 TypeScript 重构的高性能网页弹幕库,用于在视频等场景中实现弹幕滚动效果。基于 Canvas 渲染,采用消息池与多轨道管理机制提升并发性能,支持文字、图片、视频等多种弹幕消息类型,并可通过继承 BaseMessage 类自定义扩展,支持 npm 安装。
Embla Carousel
一个轻量、无依赖的开源轮播(carousel)库,主打流畅的动画和精准的触摸滑动体验。框架无关,原生支持 JavaScript/TypeScript 并提供 React、Vue、Svelte、Solid、Angular 等封装,强调完全可控、无冗余。
smooth-signature 手写签名
一个 H5 手写签名库,支持 PC 端和移动端,可用于任何前端框架。通过检测笔的移动速度模拟笔锋粗细变化,让签名更接近真实纸面书写效果,支持撤销、重做、清屏并导出 PNG/JPG,适合电子合同与无纸化签署。
Satori
Vercel 出品的库,可将 HTML 和 CSS(通过 JSX 编写)转换为 SVG。它基于 Flexbox 布局引擎处理排版、字体与图片,输出与浏览器渲染一致的矢量图,常用于动态生成 Open Graph 社交卡片图片。
tyme4ts
用 TypeScript 编写的强大日历工具库,可视为 Lunar 的升级版。支持公历、农历、藏历、伊斯兰历之间的换算,以及星座、干支、生肖、节气、月相、法定假日等丰富的历法计算。
SWR
Vercel 开发的 React 数据请求库,通过单个 useSWR Hook 提供内置缓存、自动重新验证和请求去重。支持焦点/重连时自动更新、分页、SSR/SSG 和 Suspense,数据源无关,可配合 REST、GraphQL 或自定义 fetcher 使用。
Floating UI
一个用于创建工具提示、弹出框、下拉菜单等"浮动元素"的 JavaScript 定位库(前身为 Popper.js)。负责将绝对定位元素稳定锚定到参考元素旁,并处理视口碰撞检测以防溢出。高度模块化、按需打包,提供 DOM、React、React Native、Vue 等多平台支持及交互 Hooks。
Atrament
一个轻量级 JavaScript 绘图库,用于在 HTML Canvas 上实现自然流畅的手写与绘画效果。直接在画布位图上渲染笔迹,支持绘制/填充/橡皮擦模式、自适应平滑、触控笔压感,并提供笔画事件便于实现撤销重做,gzip 后仅约 2.4kB。
perfect-freehand
一个绘制完美压力感应自由手绘线条的 JavaScript/TypeScript 库。将原始输入点转换为平滑自然的笔画轮廓点,支持速度模拟压力与真实触控笔压力,可调笔触大小、变细、平滑、流线化等参数,输出可用 SVG 或 Canvas 渲染,并有多语言移植版本。
UI组件库
Semantic UI
Semantic UI 是一个使用人性化(语义化)HTML 类名的前端 UI 框架,帮助快速构建美观、响应式的界面。提供 50 多个 UI 组件、3000+ 主题变量的强大主题系统,并支持 React、Angular 等框架集成。
Bulma
Bulma 是一个基于 Flexbox 的现代化纯 CSS 框架,不包含任何 JavaScript,最终只产出一个 bulma.css 文件。提供丰富的预制样式和组件、响应式布局,并可通过 Sass 变量高度定制,让开发者自由搭配自己的 JS 实现。
Magic UI
一个面向设计工程师的 React 动效 UI 组件库,基于 React、TypeScript、Tailwind CSS 和 Motion 构建。提供 150+ 免费开源的动画组件与特效,与 shadcn/ui 完美搭配,另有 Pro 版提供落地页模板和区块。
Uiverse
一个开源 UI 元素社区库,收录了数千个由社区贡献的 CSS 与 Tailwind 编写的 UI 组件,如按钮、卡片、加载动画、开关、输入框等。所有元素均可免费使用并一键复制代码,方便开发者快速集成到项目中。
框架类库
React
用于构建 Web 和原生交互界面的库
Svelte
Svelte 在 构建/编译阶段 将你的应用程序转换为理想的 JavaScript 应用,而不是在 运行阶段 解释应用程序的代码
Next.js
Next.js 为您提供生产环境所需的所有功能以及最佳的开发体验:包括静态及服务器端融合渲染、 支持 TypeScript、智能化打包、 路由预取等功能 无需任何配置。
Remix
Remix 是一个基于 React 的框架可以让你专注于用户界面并且重新学习 Web 基础知识来为用户提供快速流畅的用户体验的全栈 Web 框架。
Vue.js
Vue是一款用于构建用户界面的 JavaScript 框架
qiankun
可能是你见过最完善的微前端解决方案
React工具
usehooks-ts
React hook 库,随时可用,用 Typescript 编写。
react-use
必不可少的 React Hooks集合
useHotkeys
用于以声明方式在组件中使用键盘快捷键的 React 挂钩。
React DnD
React DnD 是一组 React 实用程序,可帮助您构建复杂的拖放界面,同时保持组件分离
dnd kit
@dnd-kit – 用于 React 的轻量级、模块化、高性能、可访问且可扩展的拖放工具包。
React Syntax Highlighter
React 的语法高亮组件
React Navigation
Expo 和 React Native 应用程序的路由和导航
表单处理
Formily
前端中后台复杂表单统一解决方案
React Hook Form
具有易于使用的验证的高性能、灵活和可扩展的表单。
Formik
Formik是一个小型库。由React组件和hooks组成,它内置了表单的state管理操作,同时使用了Context,能够让表单组件多层嵌套,不再需要一层层传递。 它的底层是ant design的组件
状态管理
React Query
使您的Web应用程序中的获取,缓存,同步和更新服务器状态变得轻而易举
SWR
用于数据请求的 React Hooks 库
Valtio
Valtio API 是最小的、灵活的、不拘一格的并且有点神奇。 Valtio 的代理将您传递给它的对象变成一个自我感知的代理,允许细粒度的订阅和创造性地进行状态更新。在 React 中,Valtio 擅长渲染优化。
Jotai
Jotai 对全局 React 状态管理的原子方法从简单的 useState 替换扩展到具有复杂需求的企业应用程序。
zustand
React中状态管理的必需品
MobX
简单,可扩展的状态管理
Rematch
Rematch 在 Redux 的基础上构建并减少了样板代码和执行了一些最佳实践
DvaJS
dva 首先是一个基于 redux 和 redux-saga 的数据流方案。
跨端开发
React Native
一次学习,随处编写。使用 React 来创建 Android 和 iOS 的原生应用
Taro
Taro 是一个开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发 微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ / 飞书 小程序 / H5 / RN 等应用。
Electron
Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上运行的跨平台应用 macOS和Linux——不需要本地开发 经验。
Pake
支持 Mac / Windows / Linux。相比传统的 Electron 套壳打包,要小将近 20 倍,5M 上下
CORDOVA
使用 HTML、CSS 和 JS 的移动应用程序,可在Android、IOS、Window、OS X多端使用
NW.js
NW.js (原名 node-webkit),通过它可以用 HTML 和 JavaScript 编写原生应用程序,支持 Linux、Mac OS X 和 Windows
快应用
快应用是一种新的应用形态,以往的手机端应用主要有两种方式:网页、原生应用;网页无需安装,却体验不是很好;原生应用体验流畅,却需要从应用商店下载安装,难以一步直达用户;快应用的出现,就是希望能够让用户无需下载安装,并且还能流畅的体验应用内容。
UI组件
Ant Design
蚂蚁设计系统,antd 为 Web 应用提供了丰富的基础 UI 组件,我们还将持续探索企业级应用的最佳 UI 实践
Element Plus
饿了么设计系统,基于 Vue 3,面向设计师和开发者的组件库
Arco Design
字节跳动出品的企业级设计系统,ArcoDesign 的目标, 即通过通用的设计系统去解决产品中的体验问题, 并为产品设计提供指导原则解决业务问题。
TDesign
腾讯设计系统,TDesign 为了在开源体系的基础上打造具有自身品牌特色且好⽤的产品,秉承包容、多元、进化、连接的价值观。
NextUI
NextUI 允许您制作美观、现代和快速的网站/应用程序,无论您的设计经验如何,它都是使用 React.js 和 Stitches 创建的,基于 React Aria 并受 Vuesax 启发。
Vant
Vant 是一个轻量、可定制的移动端 Vue 组件库,提供小程序 UI,并由社区团队维护 React 版本和支付宝小程序版本
React Desktop
为 macOS Sierra带来 React UI 组件