generative-loaders

专为 AI 生成界面打造的 React 加载态组件,让流式输出不再空白焦虑

开源 🏷️定价信息待确认 ✅ 目前可打开 设计创意 🍴 复刻 8 🐛 待处理 8
访问官网 ↗ GitHub ↗
GitHub 星标 ★ 214
维护状态 活跃
是否开源 开源
定价模式 🏷️定价信息待确认

项目预览

generative-loaders 项目界面预览图
图片来源:GitHub 官方仓库名片

项目数据

分类设计创意
开发团队kasturibuilds
定价模式🏷️定价信息待确认
价格说明定价信息待确认
访问状态✅ 目前可打开
是否开源是
开源协议MIT
主要语言TypeScript
技术栈/模型accessibility,ai,animation,framer-motion,generative-ui,loader,react,typescript
GitHub 星标★ 214
上线时间2026-08-08 00:00:00
代码更新2026-11-01
仓库体积17.1 MB
本站数据更新2026-11-04
维护状态活跃
收录时间2026-09-16
浏览次数2

项目介绍

generative-loaders 是一个面向生成式 AI 界面的 React 加载状态组件库,用 TypeScript 编写。它解决的核心问题是:传统 loading 组件(转圈、骨架屏)无法表达 AI 生成过程的特殊性——文字是逐字流式输出的、图像是逐步渲染的、工具调用是分阶段进行的,而用户需要知道系统正在做什么、进度如何。项目提供三类加载态:流式文本加载、内联活动指示、图像生成占位,并强调无障碍支持(ARIA 属性、屏幕阅读器友好、减少动画偏好适配)。组件基于 Framer Motion 实现动画,可开箱即用,也能按需定制样式,适合正在构建聊天机器人、AI 写作、文生图等生成式产品的团队,让等待过程从焦虑变为可感知的反馈。

Star 增长趋势

本站每日记录该项目 GitHub 星标变化,观测越久曲线越完整

数据来源:GitHub API 逐日快照 · 收录于 2026-09-16 · 当前星标 ★ 214

核心亮点

  • 针对流式文本、图像生成、内联活动三类 AI 场景提供专用加载组件,而非通用转圈
  • 内置无障碍支持,适配屏幕阅读器和 prefers-reduced-motion,生成式产品中少见
  • 基于 Framer Motion,动画流畅且可定制,TypeScript 类型完整

不足之处

  • 项目处于早期,组件数量和文档完善度有限,复杂场景需自行扩展
  • 仅支持 React 生态,非 React 项目无法直接使用

适用场景

  • AI 聊天应用中等待模型逐字回复时的流式文本占位
  • 文生图工具中图片逐步生成时的渐进式加载动画
  • AI Agent 执行多步工具调用时展示当前活动状态

替代项目

react-loading-skeleton、lottie-react

上一篇:upage

下一篇:Libraries.dev

同类项目推荐

fractals 开源

用 Go 并发快速画出曼德博分形图

Fast mandelbrot set renderer using goroutines

★ 93 2026-08-09
FlowerJS 开源

用代码快速生成花朵形状和动画,创意视觉轻松搞定。

JavaScript Framework for Flower Shapes and Animation extended CreateJS on HTML5 Canv···

★ 90 2026-08-09
freecad-ai 开源

用一句话在 FreeCAD 里生成可编辑三维模型

AI-powered assistant workbench for FreeCAD — generate 3D models from natural langua···

★ 610 2026-10-25
open-design 开源

让 AI 代工做界面,本地跑完随手改

The 1st Collaborative AI Design Agent Workspace. Local-first and open source. Create···

★ 105657 2026-08-09
cad-skill 开源

用大白话让 Claude 写 CadQuery,直接出可打印 3D 模型

Claude Code skill for parametric 3D-printable model generation with CadQuery

★ 712 2026-10-27
oil-ui 开源

用 AI 把 UI 设计从拖拽变成写代码,快速出稿

UI design skill for Claude Code, Codex and other AI agents: explore distinct directi···

★ 2663 2026-10-06
shaders 开源

一行组件接入 WebGPU 炫酷着色器效果

WebGPU components for React, Vue, Svelte, Solid, JS & Framer

★ 5815 2026-10-22
dicebear 开源

传个种子参数,秒出风格统一的用户头像

DiceBear is an avatar library for designers and developers.

★ 10005 2026-10-28