开了个 React 组件库，一键给网页添加 WebGL 动态背景，欢迎 PR！
ciaochaos ciaochaos 2024-03-04 05:25:18 +08:00 7983 次点击这是一个创建于 586 天前的主题，其中的信息可能已经有所发展或是发生改变。
第 1 条附言 2024-03-08 10:56:14 +08:00
 | 1 lawted 2024-03-04 10:07:16 +08:00 赞 |
 | 2 rizon 2024-03-04 10:43:11 +08:00 via iPhone 支持，佩服这些可以做漂亮 ui 的大佬 |
 | 3 leoskey 2024-03-04 11:57:14 +08:00 效果很赞 |
 | 4 HaroldFinchNYC 2024-03-04 14:11:23 +08:00 这是我浏览器版本不够的原因么？  |
 | 5 guguji5 2024-03-04 14:13:25 +08:00 很赞，但是这几个图好像没显示出来  |
 | span class="no">6 ciaochaos OP @HaroldFinchNYC @guguji5 你们发现了华点 这几个还只是占位，我现在边开发边部署了，还没有做分支管理 |
 | 7 LinYa 2024-03-04 14:31:45 +08:00 我想知道，作为初级的前端开发者，实现这些渐变动态背景需要学习哪些知识吗？例如需要找计算机图形学方面的书籍来看吗？ |
| 8 ciaochaos OP  3 @LinYa 如果是想直接上手 WebGL 我推荐这篇： https://www.labri.fr/perso/nrougier/python-opengl/，也可以用 https://github.com/pmndrs/react-three-fiber 快速搭一些前端。图形学的书体系都比较复杂，比较值得参考的是 Real-Time Rendering 和 Physically Based Rendering 这两本，除此之外还可以看看 Unity 的 ShaderLab / Shader Graph / Compute Shader |
 | 9 johnnyNg 2024-03-04 14:59:35 +08:00  什么时候支持 webgpu |
 | 10 litor 2024-03-04 15:06:09 +08:00 赞，已 star |
 | 11 Steps 2024-03-04 15:08:25 +08:00 我从 <Serenex /> 之后不支持了 |
 | 14 liarsa 2024-03-04 15:13:19 +08:00 已点 star |
 | 15 rm0gang0rf 2024-03-04 15:43:11 +08:00 没有 react 的怎么办... |
| 16 ciaochaos OP @rm0gang0rf 如果发展的好的话，后面我看看能不能抽出一个通用的～ |
 | 18 MoTao 2024-03-04 16:19:31 +08:00 支持支持，谢谢大佬贡献 |
 | 19 tbc3211 2024-03-04 16:37:37 +08:00 赞 |
| 20 rm0gang0rf 2024-03-04 16:44:10 +08:00 @ciaochaos 抽吧, react 才几个人 |
 | 21 vczyh 2024-03-04 16:52:11 +08:00 @rm0gang0rf 哈哈哈哈 |
 | 22 rabbbit 2024-03-04 17:08:21 +08:00 shadertoy 的默认协议为 CC BY-NC-SA 3.0 DEED ，需要署名且禁止商业使用。 这可能会导致一定的协议问题，可以改为由用户上传或分发 Shader 。 https://creativecommons.org/licenses/by-nc-sa/3.0/deed.zh-hans https://www.shadertoy.com/terms |
| 23 rabbbit 2024-03-04 17:10:56 +08:00 并且 cc3.0 限制不能改变协议 |
| 24 ciaochaos OP @rabbbit nice 感谢，起步阶段先加了一些 shadertoy ，后续尽可能保持原创并给这几个来自 shadertoy 的打上 non-commercial 的标签 |
 | 26 LiuJiang 2024-03-04 17:23:20 +08:00 已 star ，谢谢大佬贡献 |
 | 29 alphardex 2024-03-04 18:18:45 +08:00 via iPhone 1 同喜欢玩 Shader ，资瓷下 |
 | 30 xieqiqiang00 2024-03-05 11:24:59 +08:00 via Android v2 里少有的的真正让人眼前一亮的项目 |
 | 31 admol 2024-03-05 15:17:31 +08:00 和我想的加背景有点不一样，我以为是给某个 Div 加背景，结果是占位加背景。 <Zenitho /> 好像有 BUG ，我放在我一个 div 里面的，就它宽度会 1680 ，其他都是和外面 Div 一样的宽度 <div class="isLoaded"><canvas style="--gradient-color-1:#ef008f; --gradient-color-2:#6ec3f4; --gradient-color-3:#7038ff; --gradient-color-4:#ffba27;" width="1680" height="600" class="isLoaded"></canvas></div> |
| 32 admol 2024-03-05 15:25:51 +08:00 |
 | 33 xmtpw 2024-03-05 15:34:17 +08:00 支持大佬，加星 |
| 34 ciaochaos OP |
 | 35 hellofreckles 2024-03-05 17:37:39 +0:00 逻辑不复杂，完全可以用一套适配层生成 react vue selvet 一系列库 |
 | 36 rain0002009 2024-03-05 18:42:59 +08:00 字体背景搞成这样的是不是更炫酷一点  |
 | 37 7gugu 2024-03-05 20:06:00 +08:00 感觉 UI 很精致 |
 | 38 murongxdb 2024-03-05 20:18:30 +08:00 酷 |
 | 39 Jack927 2024-03-05 21:14:21 +08:00 希望有 js 原生的版本，或者 web component 的版本，这样就能在任何地方使用了。 |
 | 40 Cubat 2024-03-05 21:21:07 +08:00 太强了，很精致 |
 | 41 drylong 2024-03-06 10:35:36 +08:00 very good ！ 使我领结旋转！ 最近在学习可视化 又有项目可以学习了 泰裤辣！ |
 | 42 xiaojun996 2024-03-06 13:31:52 +08:00 很酷很精致很帅！ |
 | 43 abcdecsf 2024-03-06 13:37:47 +08:00 赞 |
 | 44 q2677855779 2024-03-06 13:38:15 +08:00 酷炫 |
 | 45 chengo 2024-03-06 16:06:29 +08:00 顺手看了下主页，原来是之前做 SD + QR code 的那位大佬，而且已经商业化了，厉害。 |
 | 46 Leviathann 2024-03-06 16:10:15 +08:00 这些特效的名字是怎么起的 |
 | 47 LHRUN 2024-03-06 16:17:51 +08:00 牛逼 已 star |
| 48 ciaochaos OP 2 @Leviathann GPT4：给我一些像宜家家居命名的名字 |
| 49 Leviathann 2024-03-06 21:10:53 +08:00 @ciaochaos 听说宜家家居不少是有具体意义的瑞典语单词，只不过都是音译，让人不明觉厉 |
 | 50 oneWill 2024-03-07 10:19:56 +08:00 支持，stared |
| 51 oneWill 2024-03-07 10:33:33 +08:00 能增加支持自定义背景动态图吗 |
 | 52 daguozi 2024-03-08 10:35:48 +08:00 已经用上了！谢谢 hard work 很给力！只是有点太鲜艳了我用了 grayscale 直接 filter 了一下下。希望以后有更多的 design ！ www.eletypes.com 我简单地给小网站加了几个 theme 以后慢慢调色。很好用！ 谢谢老哥。以前我试着 babylonjs 写过类似的背景组件但是没有结果 performance 的问题。 |
| 54 ciaochaos OP |
 | 55 silencil 2024-03-08 10:59:51 +08:00 大佬啊 网友很漂亮 |
 | 56 ffc0FhC1466oKuk0 2024-03-08 11:01:32 +08:00 帅 |
 | 57 okakuyang 2024-03-08 11:17:31 +08:00 via iPhone 有没有商业化的思路？或者走捐赠的想法？ |
 | 58 dartabe 2024-03-08 11:26:04 +08:00 好看的 单独看没啥感觉 放到页面里挺酷的 |
 | 59 vinsony 2024-03-08 11:56:49 +08:00 opulento 那个有点酷哦 |
 | 60 heftyMan 2024-03-08 11:58:47 +08:00 那么我就要去出个 Vue3 版了，哈哈哈 |
| 61 ciaochaos OP @Leviathann hhh 确实 |
| 62 ciaochaos OP |
 | 63 veveue 2024-03-08 12:53:56 +08:00 来点国风水墨的 |
 | 64 lijianan 2024-03-08 13:25:10 +08:00 star 了，不错 |
 | 65 wolfan 2024-03-08 13:46:37 +08:00 CPU 终结者 |
 | 66 ceeeeeeeeeeeeeeb 2024-03-08 15:16:40 +08:00 大佬 |
 | 67 gxvsko 2024-03-08 15:28:22 +08:00 https://particles.js.org/ 粒子类的动态背景可以看下这个库，看看有没有参考的地方 |
 | 68 goldeye0351 2024-03-08 22:06:58 +08:00 via iPhone up ，cool ，star |
 | 69 FByron 2024-03-08 22:30:39 +08:00 大佬请问怎样全屏幕展示呢 react+tailwindcss |
 | 70 skyworker 2024-03-09 09:26:53 +08:00 挺好玩的, 能不能升级支持一些类似 BI 之类的商业效果 |
 | 71 tedding 2024-03-12 18:37:58 +08:00 via iPhone 提问：我能抄一份 Angular 的组件库吗 |
 | 73 devzhaoyou 2024-03-22 10:14:49 +08:00 牛 x 的很，star 一波 |
| 74 ciaochaos OP @devzhaoyou thx! |
Select Language