最近做了一個相對“反工程化”的前端小項目:
一組新年倒計時實驗,全部使用原生前端技術完成。

技術選型刻意保持簡單:

  • 原生 JavaScript
  • HTML5 Canvas
  • requestAnimationFrame 驅動動畫
  • Web Audio API 處理音效

沒有使用任何主流框架,也沒有複雜的構建流程。

這樣做的原因是:
倒計時本身是一個 極短時長、高情緒密度 的交互場景,並不適合重工程結構,反而更需要:

  • 精準時間控制
  • 可預期的動畫節奏
  • 音畫同步

倉庫中包含多個並列實現版本,每個版本都關注不同側重點(節奏、結構、粒子、表現力)。

作為工程實踐,它更適合用來:

  • 學習 Canvas 動畫
  • 理解時間驅動而非狀態驅動的 UI
  • 做活動頁 / 節日頁的參考實現

項目已開源(MIT License):

👉 https://github.com/FlameAIStudio/NewYearCountdown