English · 繁體中文

Angular · TypeScript · Nx Monorepo · Frontend Architecture · Web Performance

13+ years in software development with a full-stack background.

I design and lead large-scale Angular/Nx frontend architecture, turning multi-theme complexity into typed, testable contracts and measurable performance gains. I also turn recurring architecture, refactoring, and review decisions into governed AI-assisted engineering workflows, combining engineering judgment with deterministic validation and human final accountability.

• Config-driven multi-theme architecture — Designed and led a unified Angular/Nx architecture supporting 100+ themes and multiple layouts. A one-way selector → theme leaf → shared view → core flow, explicit facade/service ownership, and cross-theme completeness tests turned complex customization into typed configuration; within the migration, a representative complete production theme leaf was reduced to 23 lines. Rollout scope: 70 purpose-specific modules—24 facades, 10 data services, 10 theme configs, and 26 shared views.
• Measured web performance — Led on-demand loading for 136 theme CSS files, reducing a single theme resource request from approximately 2.4 MB to 17 KB—about 99%. Separately, improved Lighthouse Performance on key measured pages from 50+ to 90+, while also improving accessibility, best practices, SEO, and AEO for generative-search experiences.
• Engineering leadership — Led a 6-person cross-functional team and handled technical interviews, architecture planning, Code Review, work allocation, and delivery schedules.
• Product growth — Helped a client grow its product from 0 to 20,000 members within one year.

A runnable, sanitized Angular/Nx implementation of config-driven multi-theme architecture with three fictional themes, typed contracts, core / view / theme boundaries, facade/service separation, family-completeness tests, on-demand CSS, bilingual decision records, and explicit evidence boundaries.

Built and maintain Better Workflows, an open-source governance layer for AI-assisted engineering. It turns repeatable delivery practices into versioned workflows, separates agent judgment from deterministic validation, and fails closed on stale evidence or unknown action outcomes—while keeping final accountability with engineers.

The same design pattern supports private, day-to-day Angular refactoring and revision-bound Code Review; client-specific implementation details remain private.

An AI-powered personal CRM available on the App Store.

• Role: Product direction, architecture, AI-assisted delivery orchestration, Code Review, QA, and iOS/Android release delivery.
• AI-assisted implementation context: React, NestJS, tRPC, SwiftUI, and Kotlin Compose.

• Hands-on frontend: Angular, TypeScript, Nx, HTML/CSS, Component Architecture, Web Performance, Accessibility, SEO/AEO
• Frontend architecture: Config-driven Platforms, Explicit Ownership Boundaries, Facade/Service Separation, Cross-theme Completeness
• Engineering systems: Architecture Governance, Behavior-preserving Refactoring, Policy as Code, Deterministic Validation, Safe Delivery Automation
• Full-stack background: Laravel, PHP, MySQL, Redis, Linux
• Leadership & delivery: Architecture, Code Review, Technical Interviews, Planning, iOS/Android Release

Hands-on Frontend Team Lead · Senior Frontend Engineer · Frontend Architect

Taiwan · Hybrid · Remote

Website · Case Studies · Better Workflows · Connectors

Angular · TypeScript · Nx Monorepo · 前端架構 · Web 效能

具 13 年以上軟體開發經驗及全端背景。

主導大型 Angular／Nx 前端架構與交付，將多主題複雜度轉化為具型別保障、可測試的契約與可量化的效能成果；並將反覆出現的架構、重構與 Code Review 決策沉澱為受治理的 AI 輔助工程工作流，結合工程判斷、確定性驗證與人類最終責任。

• Config 驅動的多主題架構 — 為支援 100+ 主題與多版型的 Angular／Nx 平台制定並主導統一架構。透過單向 selector → theme leaf → shared view → core 依賴、明確的 facade／service ownership 與跨主題 completeness tests，將複雜客製化邏輯收斂為 typed config；在此次 migration 中，一個具代表性的完整 production 主題 leaf 精簡至 23 行。Rollout scope 涵蓋 70 個職責明確的模組：24 facades、10 data services、10 theme configs、26 shared views。
• Web 效能實測 — 主導將 136 份主題 CSS 改為按需載入，使單次主題資源由約 2.4 MB 降至 17 KB，約降低 99%。在另一項關鍵頁面品質優化中，將 Lighthouse Performance 實測由 50+ 提升至 90+，並同步改善無障礙、最佳實務、SEO 與生成式搜尋情境下的 AEO。
• 工程領導 — 帶領 6 人跨職能團隊，負責技術面試、架構規劃、Code Review、工作分配與交付時程。
• 產品成長 — 協助客戶產品於一年內將會員數由 0 成長至 20,000。

可執行且去識別化的 Angular／Nx 多主題架構實作，包含三個虛構主題、typed contracts、core / view / theme 邊界、facade／service 分層、family-completeness tests、CSS 按需載入、雙語決策文件，以及明確的證據邊界。

建立並持續維護開源 Better Workflows，作為 AI 輔助工程的治理層：將可重複的交付實務固化為版本化工作流，分離 Agent 判斷與 deterministic validation；遇到過期證據或結果不明的操作時停止，並由工程師保留最終責任。

相同設計模式亦應用於私有、日常使用的 Angular 重構與 revision-bound Code Review；客戶專屬實作細節維持不公開。

AI 個人 CRM，已於 App Store 上架。

• 負責範圍： 產品方向、架構、AI 輔助交付編排、Code Review、QA，以及 iOS／Android 發布。
• AI 輔助實作技術背景： React、NestJS、tRPC、SwiftUI、Kotlin Compose。

• 核心前端實作： Angular、TypeScript、Nx、HTML／CSS、元件架構、Web 效能、無障礙、SEO／AEO
• 前端架構： Config 驅動平台、明確職責邊界、Facade／Service 分層、跨主題完整性
• 工程系統： 架構治理、行為保持重構、Policy as Code、確定性驗證、具安全邊界的交付自動化
• 全端背景： Laravel、PHP、MySQL、Redis、Linux
• 領導與交付： 系統架構、Code Review、技術面試、規劃、iOS／Android 發布

Hands-on 前端 Team Lead／資深前端工程師／前端架構師

台灣 · Hybrid · Remote

個人網站 · 前端工程案例 · Better Workflows · Connectors