ZEQULARD
EN

作品 / 2026

本站

一個本身就是證明的作品集:靜態外殼先到,即時資料從空洞串流進來,每個快取決策都寫下來。

角色
設計、工程
技術
Next.js 16.4, React 19.3, Cache Components, Tailwind 4

問題

大部分作品集是一整排 logo 和截圖。它們說明用了什麼,卻沒說做了什麼決定,而且常常撐不過下一次改版。

我想要一個架構本身就是論點的網站:每個路由示範一種渲染或快取技巧,而頁面會告訴你是哪一種。

做法

全站開啟 Cache Components 與 Partial Prerendering。首頁的名字在靜態外殼裡;「近況」那一行是 Suspense 空洞,在請求時從分鐘級快取串流進來。

作品頁依語言與 slug 預先渲染,並以 slug 標記,所以修改一件作品只會讓那一頁和作品列表失效,其他都不受影響。

聯絡表單是透過 useActionState 接上的 Server Action,關閉 JavaScript 也能送出並顯示錯誤。

結果

每個路由在兩種語言下都有靜態外殼。首頁唯一在請求時才做的工作,就是「近況」那一行。

版權頁列出版本與刻意省略的東西,讓技術頁可以連到證明,而不是空口說白話。