渲染與優化
每條規則都來自過去影片的教訓；方括號內為來源（圖例見下方）。 當來源有衝突時，會列出兩種建議，並標明各自適用的情況。
簡短規則
- 渲染是根據時間點抓取影格，而不是連續播放動畫：一個屬性對應一個動畫，脈衝效果應使用補間動畫而非
@keyframes。[視覺] - 將外部腳本與字型放入專案中，不要在渲染期間動態載入。[視覺][科普]
- 根據影格編號計算雜訊顆粒，而非隨機生成器[科普]；應保存隨機數生成器的序列，並確保舊版本能逐位元組一致地重新建構。[聲音]
- 在加速之前，先確認時間花在哪裡。[3D]
- 使用 NVENC 進行編碼，同時限制位元率；透過相同片段上的 PSNR 比較編碼器品質。[3D]
- 渲染應脫離會話執行；兩個版本應依序進行，而非同時使用同一張顯示卡。[3D]
- 將檔案轉移到渲染機器後，請比對檔案的檢查碼。[3D]
- 將影像與聲音分開處理：透過複製視訊串流來嵌入聲音，不要重新編碼影像。[影片][視覺][3D]
- 提交前使用 ffprobe 檢查，並確認頁面確實提供新檔案。[影片]
- 請勿刪除舊版本。[影片][聲音]
詳細說明
seek-render.md— 逐格渲染搭配跳轉播放的常見問題與確定性。performance.md— 時間耗費在哪裡、編碼、workers、渲染啟動。mux-and-delivery.md— 嵌入聲音、檢查成品、版本管理。
來源
- [聲音] — 關於聲音與配音的歷史課程，用於宣傳影片與簡報。
- [影片] — 關於影片的歷史課程：介面錄製、節奏、轉場。
- [視覺] — 關於視覺的歷史課程，用於從示意圖影格製作宣傳影片（HTML 影格 → 逐格渲染搭配跳轉播放）。
- [3D] — 關於瀏覽器中第一人稱 3D 影片的課程（three.js → 逐格渲染）。
- [科普] — 關於模仿 70 年代初蘇聯科普與幻燈片風格的影片課程。