· 工程實務
i18n 難的從來不是翻譯，是沒有人擁有那份語系檔
多語系的痛不在裝哪一套套件，而在 key 誰命名、字誰擁有、翻譯跟不上 sprint 怎麼辦。這篇把 i18n 治理拆成命名、擁有權、流程、在地化、政治五層，越往下工程越管不到，也越決定它會不會爛掉。
#架構
共 35 篇
· 工程實務 · 系列:ai-era-craft
解決方案比畫圖寫 Code 還重要：AI 時代工程師的價值在哪
AI 時代 Code 寫得漂不漂亮、文件齊不齊，份量都變輕了。但在方便、安全、效率、便宜之間該取捨什麼，依賴的是預算、團隊、客戶這些不在 prompt 裡的真實變數，這才是 AI 觸及不到、工程師還站得住腳的地方。
· 設計與設計系統
光是權限管理系統就很複雜
RBAC 看起來只有 User、Role、Permission 三塊，實際上遠比想像複雜。權力下放、組織管理、權限本身的層級關係，每一層都要另外設計。
· 日更系列
關於我與前端無關緊要的分享 Day 55
開一個前端基礎建設的篇章。每篇長度不均，還會加一點幹話，不會到部落格的複雜度，但盡量交代前後文。
· 日更系列
關於我與前端無關緊要的分享 Day 53
Monorepo 有很多流派：主框架放 root、共用放 root、或是 root 乾乾淨淨。我偏好切分清楚的那種，每個 package 都有獨立的存在價值，代價是比較麻煩。
· 短文與心得
傻傻搞不清楚
現在的 SSR 已經不是你想的那個 SSR 了。除了 CSR、SSR、SSG，查資料時還會撞見 ISR 和 PPR，光要搞清楚差異就一顆頭兩顆大。
· 工程實務
前端 Serverless
Next.js 帶起 Serverless 的 Rendering Service，但 Edge runtime 是閹割版的 Node.js。想串外部服務才發現沒有 net module，也就是沒有 Socket 能力。
· 工程實務
關於前端架構
前端架構不只是資料夾結構和 Builder Tool。這篇列出七個真正該關注的點：可測試性、各種狀態的顯示、多語系破版、跨 feature 解耦、命名規範。
· 工程實務
前端系統要設計什麼？
前端沒有微服務，那資深前端架構師到底要設計什麼？這篇先定義前端獨有的五個問題：bundle size、難以拆分、Context 太多、體感細節、瀏覽器管控。
· 工程實務
軟體架構這件事
架構開得越大，改動成本越低，但維持成本越高。以多國語系為例，事先做好確實省下重構，但資料庫與翻譯表的長期維持也很貴。
· 工程實務
伺服器渲染 (SSR)
SSR 架構下 Token 該放哪？伺服器拿不到 Client 的 LocalStorage。這篇講怎麼用 http only cookie 解決，也講為什麼我更推崇 PreRender。
· 工程實務
微前端系列（十三）
微前端選 CSS 方案要格外小心，因為 CSS 不分作用域。這篇比較 CSS Module、Component Selector、CSS in JS、Atomic CSS，也分出全域、Hash、Document 三種作用域模式。
· 工程實務
你可能不需要 SSR
SEO 用 SSG 排程預渲染就夠了、渲染效率未必更快、CLS 本來就不該是問題。這篇把 SSR 的好處一條條拆開檢查，再看它帶來的四個副作用。
· 工程實務
微前端系列（十二）
browser history 在整個應用中是唯一的，多個微應用各開路由器就會打架。解法還是單向資料流：微前端應用不要直接操作路由器。
· 工程實務
微前端系列（十一）
History Router、Locale、Browser Storage 都是單例狀態，在微前端裡最容易發生循環修改與資料流混亂。同步的狀態修改我最推薦用 Flux 單向資料流管理。
· 工程實務
微前端系列（十）
前端有流量成本，所以「共用」比微服務更需要煩惱。Module Federation 目前幾乎沒有更完善的替代方案，代價是模組化會被綁在特定的 chunk system。
· 工程實務
微前端系列（九）
微前端的跨應用溝通沒有 import 可以用。但所有微應用都跑在同一個 global 底下，這篇講三種做法：套件共享、瀏覽器事件機制、後端 WebSocket。
· 工程實務
微前端系列（八）
很多人把微前端和 Module Federation 劃上等號，但 MF 不是必要的，也不是 Framework，它只是一種 bundle 的概念，用來解決版本管理與模組共享。
· 工程實務
微前端系列（五）
接著就是以 Component 化的角度來看看微前端的實作方法。 iframe WebComponent Frontend Framework Component (react, vue, angular) iframe 這是最古老最穩定的
· 工程實務
微前端系列（四）
三種服務端解決方案的優劣：xhr/fetch 插 script 上下限最大、module-federation 完整但綁打包工具、微前端框架最省力卻失去微調能力。
· 工程實務
微前端系列（七）
我為什麼開始玩微前端？公司有多個前端框架並行、產品要架在 Local 且組態多變、還希望能給第三方動態掛載功能——這三個原因把我推上這條路。
· 工程實務
微前端系列（六）
微前端要面對的五個核心問題：應用間溝通、模組共用、全域單例狀態、樣式管理、CI/CD。這篇逐一說明每個問題到底出在哪。
· 工程實務
微前端系列（三）
實施微前端的主流方案：Application 層級有 xhr/fetch 插 script、module-federation、微前端框架；Component 層級有 iframe、WebComponent、框架元件。
· 工程實務
微前端系列（二）
微前端的好處是解耦、拆分職責、CI/CD 更快、沒有超大專案的維護壓力。壞處也很實在，這篇把優劣一起攤開來分析。
· 工程實務
微前端系列（一）
微前端、微應用、前端微服務講的是同一件事。這篇是系列開場，也澄清一個常見誤會：把服務切成 npm package 並不算微前端。
· 工程實務
微前端
微前端就是把微服務的概念套進前端。這篇講什麼時候該考慮導入：專案大到影響編譯時間、跨部門共同維護、需要多框架共存，以及第一個麻煩點——溝通。
· 工程實務
依賴循環：重談 circular dependency 與打包的關係
模組循環在前端多半不會爆，因為打包後模組早就載入完成。但完全不經過打包執行時就會出事，而且它本身就是架構層次不清楚的徵兆。
· 工程實務
開發一個微前端框架
正式接到 CTO 的需求，要從零著手開發一套自己的微前端框架，這篇是動工前留下的紀錄。
· 工程實務
到底架構要解決什麼問題？
架構是把經驗值變成規範，讓團隊繞過風險而不必逐一交代情境。這篇講它解決的維護心智負擔與商業層面問題，也講它最後會遇上的人才集中難題。
· 工程實務
前端基礎設施
Frontend Infrastructure 涵蓋 CI/CD、打包、套件管理、SSR、監控、容器管理、AST、Module Federation。這些多半不是業務開發會碰到的技術，卻是團隊規模長大後的關鍵。
· 工程實務
Domain Driven Design
前端套 DDD 的水土不服：Domain layer 得靠 class、CQRS 讓定義一個行為的成本暴增。但用 Domain 劃分後重構成本大降，微前端也有了溝通橋樑。
· 工程實務
依賴循環：前端的 circular dependency 多半不會爆
為什麼前端的 circular dependency 多半不會爆？因為 ESModule 打包後模組早已載入完成。但這不是「會不會動」的問題，是架構層次不清楚的徵兆。
· 工程實務
Module Federation
Module Federation 讓微前端的各應用有效共用函式庫，但它是「同版本共享」而非多版本共存。這篇講共享機制的維護、權重規則與它帶來的打包代價。
· 工程實務
關於微前端的研究
做微前端半年，大部分時間都花在架構和打包上。這篇談踩坑最深的 vite、微前端為什麼比微服務普及得慢，以及它需要的那片知識海。
· 工程實務
Monorepo 踩坑記
Monorepo 最難搞的是依賴問題。打包套件內部自動 require 時無法分辨 workspace 還是 root，會去讀它自己所在的 node_modules，坑就從這裡開始。