20 repo สาย motion จาก @e1genqq — ตรวจแล้วทั้งหมด

เอกสาร / สรุปงาน · 2026-10-26 · /opt/data/docs/2026-10-26-motion-20.md

แหล่ง: https://x.com/e1genqq/status/2114445900131013003 (25 ต.ค. 2026)

ข้อมูลทุกบรรทัดดึงจาก GitHub API เมื่อ 2026-10-26 · ดาว / ภาษา / สัญญาอนุญาต / push ล่าสุด

สรุปที่ควรใช้กับระบบเรา

ใช้ได้เลย (มีอยู่แล้ว/ติดตั้งง่าย)	น่าเพิ่ม	ต้องคิดก่อน
HyperFrames · Three.js · p5.js · FFmpeg · gl-transitions · Tone.js	Anime.js · PixiJS · tsParticles · glTF-Transform · Rapier	Remotion (ไลเซนส์ไม่ใช่ OSS แท้) · OBS Studio (แอปเดสก์ท็อป + GPL) · OpenCut (แอปตัดต่อ)

ตารางเต็ม 20 รายการ

#	ชื่อ	★	ภาษา	License	push ล่าสุด	repo
01	Remotion	67.6k	TypeScript	Remotion License (ไม่ใช่ OSS แท้)	2026-10-25	remotion-dev/remotion
02	HyperFrames	72.5k	TypeScript	Apache-2.0	2026-10-26	heygen-com/hyperframes
03	Anime.js	73.8k	JavaScript	MIT	2026-08-21	juliangarnier/anime
04	React Spring	29.2k	TypeScript	MIT	2026-10-24	pmndrs/react-spring
05	PixiJS	48.5k	TypeScript	MIT	2026-10-22	pixijs/pixijs
06	p5.js	24.2k	JavaScript	LGPL-2.1	2026-10-26	processing/p5.js
07	Paper.js	15.1k	JavaScript	MIT (ไฟล์ LICENSE ชื่อไม่ตรง)	2026-10-26	paperjs/paper.js
08	Matter.js	18.5k	JavaScript	MIT	2026-09-30	liabru/matter-js
09	Three.js	117.0k	JavaScript	MIT	2026-10-26	mrdoob/three.js
10	Rapier	5.9k	Rust (WASM)	Apache-2.0	2026-10-10	dimforge/rapier
11	OGL	4.7k	JavaScript	ไม่ระบุ	2025-04-13 (ซบเซา)	oframe/ogl
12	tsParticles	9.0k	TypeScript	MIT	2026-10-26	tsparticles/tsparticles
13	glTF Transform	2.0k	TypeScript	MIT	2026-10-20	donmccurdy/glTF-Transform
14	GL Transitions	2.2k	JavaScript	MIT	2026-10-25	gl-transitions/gl-transitions
15	OBS Studio	78.2k	C	GPL-2.0	2026-10-23	obsproject/obs-studio
16	Chatterbox	27.3k	Python	MIT	2026-07-21	resemble-ai/chatterbox
17	Tone.js	14.8k	TypeScript	MIT	2026-10-25	Tonejs/Tone.js
18	faster-whisper	26.2k	Python	MIT	2026-10-25	SYSTRAN/faster-whisper
19	OpenCut	96.2k	TypeScript	MIT	2026-09-24	OpenCut-app/OpenCut
20	FFmpeg	65.8k	C	LGPL-2.1+	2026-10-25	FFmpeg/FFmpeg

หมายเหตุที่ตรวจได้จริง

1. Remotion — repo ไม่มีไฟล์ OSS มาตรฐาน; LICENSE เป็น "Remotion License" (ฟรีสำหรับบุคคล/บริษัทเล็ก, เชิงพาณิชย์ต้องซื้อ) → ห้ามใช้ในงานลูกค้าโดยไม่ตรวจ
2. OGL — push ล่าสุด เม.ย. 2025 (ซบเซา ~18 เดือน) และไม่ระบุ license → ใช้ three.js แทน
3. HyperFrames อยู่บน Apache-2.0 และเราใช้เป็นสกิลอยู่แล้ว (render MP4 จาก HTML) — ตรงกับงาน cozy3d/sdf
4. gl-transitions เป็นแค่คลัง shader (MIT) — ต่อเข้ากับ pipeline เดิมได้ทันที ไม่ต้องติดตั้ง runtime
5. faster-whisper / Chatterbox เป็น Python + ต้องมี FFmpeg; faster-whisper รัน CPU ได้, Chatterbox ต้อง GPU จึงจะเร็ว → ใช้กับงานซับ/พากย์วิดีโอ
6. OpenCut เป็นแอปตัดต่อ (Electron) ไม่ใช่ไลบรารี — เอามาใช้เป็นโค้ดอ้างอิง timeline ไม่ได้รันบนเซิร์ฟเวอร์
7. ตัวเลข ★ ทั้งหมดเป็นค่าที่ดึง ณ 2026-10-26 ไม่ใช่ค่าที่โพสต์อ้าง

สิ่งที่เรามีอยู่แล้ว (ไม่ต้องติดตั้งซ้ำ)

ของในโพสต์	ของเรา
HyperFrames	สกิล hyperframes (ใช้ทำ cozy3d.mp4, sdf.mp4)
Three.js	ใช้ใน demo img2three, cozy3d
p5.js	สกิล p5js
FFmpeg	ใช้เรนเดอร์/รวมเสียงใน media_qa
Tone.js	ใช้ใน demo audio.thisaan.com (Web Audio)

ขั้นต่อไปถ้าจะทำจริง

1. เพิ่ม Anime.js + tsParticles เข้า demo ที่มี (ไฟล์เดียว ไม่ต้อง build)
2. ใช้ glTF-Transform บีบอัด GLB ก่อนขึ้นเว็บ (assets จาก NVIDIA/Scenario ที่โพสต์ก่อนหน้าอ้างถึง)
3. ทดลอง Rapier (WASM) ทำฟิสิกส์จริงใน canvas แทนการคำนวณมือ
4. faster-whisper ทำซับอัตโนมัติให้วิดีโอเดโม → ปิดช่อง "ไม่มีคำบรรยาย"

ผลทดสอบจริง (26 ต.ค. 2026) — https://motion20.thisaan.com/

ไลบรารี	ผล
anime.js 3.2.2	✅ ทำงาน: timeline, stagger, stroke-dashoffset ของ SVG path, translate ตาม keyframe
tsParticles 3.7.1 (slim bundle)	❌ ไม่วาดอะไรเลย ทั้งแบบกำหนด canvas เอง ({id:"bg"}) และแบบ fullScreen.enable=true — instance ถูกสร้างและ promise resolve แต่ canvas ว่าง (ตรวจ pixel = 0 สองรอบ)
แทนที่ด้วย	อนุภาค canvas 2D ที่เขียนเอง (60 จุด + เส้นเชื่อม, เฟรมเรตปกติ)

บทเรียน: ไลบรารีที่ "โหลดผ่าน" ไม่เท่ากับ "วาดได้" — ต้องตรวจ pixel/ภาพจริงก่อนถือว่าใช้ได้