wangrongding/frontend-park
🌸这是一个有趣的前端趣味知识公园~该项目是我平时捣鼓前端相关技术的一些案例集合。【涵盖:(Tensorflow.js-姿态识别,人脸识别),(WebRTC-音视频通话,录屏,虚拟背景,信令服务器),(Threejs-太阳系,3D 动画),(图片处理-千图成像,图片压缩,画板),(隐写术-文本隐写加密,图片隐写加密)等等...】
What it solves
这个项目解决的是前端开发者想要用浏览器实现有趣功能时缺少现成参考的问题。它把作者平时捣鼓的各种好玩的前端知识案例集中在一起,让其他人可以直接查看在线演示或拿去修改玩耍。
How it works
项目是一个案例集合,每个案例用浏览器原生技术实现。比如用 TensorFlow.js 做人体姿态识别,通过摄像头实时识别关键点;用 WebRTC 实现拍照、屏幕录制、虚拟背景和1对1音视频通话(有信令和无信令两种方式);Three.js 部分提供控制器和太阳系示例;隐写术部分把文本或图片隐藏到另一段文本或图片中;千图成像功能将选定的多张图片拼接成一张目标马赛克图。项目基于 pnpm 管理依赖,本地运行使用 pnpm dev,打包用 pnpm build。
Who it’s for
适合对前端技术感兴趣、想探索浏览器高级 API(如 WebRTC、TensorFlow.js、Three.js)的开发者,尤其是喜欢动手做趣味项目的人。也适合想学习这些技术具体实现的学生或业余爱好者。
Highlights
- 提供了多种可直接运行的趣味前端案例,包括姿态识别、音视频互动、3D示例和隐写术等
- 支持通过摄像头实时识别姿态,可用于健身房、瑜伽教室、舞蹈教室等场景
- WebRTC 部分包含无信令和信令两种1对1通话实现,适应不同网络环境
- 隐写术涵盖文本和图片两种方式,用于信息加密和版权保护
- 千图成像功能可以将多张图片拼接成指定的马赛克图(基础功能已完成,更多优化项待开发)
相关
- 项目
- 项目
- 项目
- 项目