GJ GARY JUANG // garyjuang
ONLINE--:--:--
CONNECT
Night City 天際線
NCPD PUBLIC ACCESS TERMINAL — 身分驗證通过

GARY
JUANG

資安工程師 / TSD。在郵件與資安的黑暗夾縫裡，用程式碼駭入體驗的邊界。專攻SMTP、漏洞修補、高負載前端架構。

OPERATOR ID
garyjuang
DISTRICT
TAIPEI / NC-WESTBROOK
LOCAL TIME
--:--:--
CLASS
NETRUNNER 9
STATUS
接受 GIG 中

莊 · GARY

// 全端工程師 × 互動體驗設計

「介面不是裝飾，它是武器。每一次點擊都應該像一次成功的入侵。」

  • 年資07 YEARS
  • 主要戰場WEB / 3D / REALTIME
  • 語言中文 · ENGLISH · JS
  • 時區UTC+8
  • 裝備費可議
01 / SYSTEM IDENTITY

操作者檔案

從一個把 Flash >ActionScript 拆開來看的小孩，到今天在終端機前寫下上線指令的人。以下是解碼後的紀錄。

我寫程式的方式比較像駭客而不是蓋房子的人：先假設系統會壞，再去找它最脆弱、也最漂亮的那條縫。過去七年，我多數時間花在即時資料視覺化、高互動行銷體驗與前端效能这三種難纏的任務上。

我待過產品團隊、接過代理商的案子、也當過自由接案的傭兵。這讓我習慣一件事：客戶要的不是技術名詞，而是一個能上線、能量產、能在流量炸掉的時候還站著的東西。所以我同時在乎動畫的 16 毫秒，也在乎 bundle 的 160 KB。

業餘時間我做 Braindance 剪輯、玩合成器、在 Night City 的街頭開老車。這個頁面本身就是我的 cyberdeck——純靜態、無框架、單檔上線。

  • 將個人站重構為單檔終端機架構，Lighthouse 分數 100 / 100 / 100 / 100。
  • 為跨國物流客戶打造即時軌跡儀表板，單頁承載 42k 個動態標點。
  • 舉辦公司內部 WebGL 工作坊，18 位工程師完成自己的 shader 作業。
  • 以 Tech Lead 身份交付 4 人團隊的設計系統，元件覆蓋率 92%。
架構 / ARCHITECTURE92
互動設計 / INTERACTION88
3D / WEBGL79
效能調校 / OPTIMIZATION95
溝通 / COMMUNICATION86
工作與生活平衡74
02 / CYBERDECK

已安裝模組

記憶體插槽全開。以下模組皆經過實戰超頻，部分已越過出廠設定。點上方篩選切換類別。

v5.4
SOFTWARE // 前端

TypeScript

型別是最便宜的 ICE。嚴格模式、判别式聯集、一整套泛型工具型。

CORE
SOFTWARE // UI

React / Next

Server Components、島架構、串流式渲染與狀態機的長期使用者。

GL
SOFTWARE // 3D

Three.js / GLSL

自寫 shader、執行緒化後製、InstancedMesh 處理十萬級粒子。

RT
SOFTWARE // 即時

WebSocket / CRDT

斷線重連、離線佇列、多人同步的衝突解決。

WASM
SOFTWARE // 系統

Rust → WASM

把熱路徑搬到 wasm，图像处理與圖譜演算法的加速器。

DECK
HARDWARE // 本機

militech deck vII

Ryzen 9 / 64GB / RTX 4090。雙 4K 螢幕、一台不會壞的備援機。

NET
HARDWARE // 網路

光纖 5Gbps + 5G 備援

雙線路自動切換，上線率 99.98%。

OPS
HARDWARE // 基礎設施

Docker / K8s / Edge

多區部署、藍綠發布、一鍵回滾。

DATA
HARDWARE // 資料

PostgreSQL / Redis

索引策略、分區表、查詢計畫解剖師。

BIO
WETWARE // 設計

Design System

Figma → code 的管線、token 化、文件即測試。

BIO
WETWARE // 溝通

技術翻譯

把 engineer 的話翻譯給業務，也把需求翻譯成 spec。

BIO
WETWARE // 節奏

危機處理

線上事故當下最冷靜的那一個。先止血，再解剖。

03 / ACTIVE GIGS

經手過的委託

三份主要紀錄，往下捲動會一層一層疊起來。完整的合約清單在下方的資料庫。

軌跡儀表板
GIG #0417CLIENT: DELAMAIN LOGISTICSACTIVE

Night City Transit

Next.jsWebGLWebSocketPostGIS

即時車輛軌跡儀表板。42,000 個動態標點在 Canvas 上以 InstancedMesh 渲染，WebSocket 增量更新，前端只負責繪製與命中測試，單幀成本壓在 6ms 以內。

週期
11 個月
團隊
6 人 / Lead
成效
延遲 −74%
設計系統
GIG #0288CLIENT: ARASAKA INTERNALDELIVERED

Synapse OS

Design SystemStorybookMonorepoa11y

跨 9 個產品線的設計系統。Token 從 Figma 變數自動編譯成 CSS 自訂屬性與 TS 常數，無障礙檢查放進 CI，元件採用量從 31% 拉到 92%。

週期
7 個月
元件
148 個
成效
交付速度 ×2.3
程式碼審計
GIG #0159CLIENT: 未公開（NDA）DELIVERED

Ghost Protocol

LLMASTRustCI

AI 輔助的程式碼審計管線。先以 AST 做靜態規則篩出高風險 diff，再讓模型生成可追溯的評論；每個建議都附帶行號與證據，避免幻覺直接進 PR。

週期
4 個月
掃描
2.1M 行 / 次
成效
缺陷洩漏 −41%
03B / CONTRACT DATABASE

其他合約

從資料庫撈出的次要紀錄。點類別篩選。

代碼名稱類別技術年份
G-0132Braindance Player3D / XRWebRTC · WebAudio2025
G-0128NCPD Dispatch BoardWEBReact · D3 · Redis2024
G-0117Delamained 微站3D / XRThree.js · GSAP2024
G-0104Chrome 部署精靈TOOLINGTS · Extension API2023
G-0096glitch-text.jsOPEN SOURCE零依賴 · 1.4KB2023
G-0081Ride or Die 配對平台WEBNext · Postgres2022
G-0077Log 顯微鏡TOOLINGRust · WASM2022
G-0065scanlines.cssOPEN SOURCECSS only2021
G-0052Kabuki 電商前台WEBNuxt · Stripe2021
G-0044Jig-Sig 舞台視覺3D / XRTouchDesigner2020

SHOWING 10 / 10 RECORDS

04 / SERVICE HISTORY

服務紀錄

七年、四段旅程、無數個上線前夜。

  • 自由 Netrunner

    SELF-EMPLOYED / 傭兵模式

    以接案方式介入高風險專案：效能救援、互動原型、前端架構重建。平均同時處理 2.4 個委託。

  • Tech Lead

    MILITECH DIGITAL LABS

    帶 4 人前端小隊，主導設計系統與即時儀表板。建立 code review 規範與效能預算制度，事故平均修復時間從 3.4 小時降到 47 分鐘。

  • 資深前端工程師

    VALHALLA CREATIVE STUDIO

    負責品牌體驗站與 3D 行銷案。把首屏時間從 4.8s 壓到 1.2s，並把動畫管線從手刻改成可維護的場景描述檔。

  • 前端工程師

    KABUKI COMMERCE CO.

    電商前台與後台工具。第一次負責上線、第一次搞砸上線、第一次在 20 分鐘內把服務救回來。

  • 見習 / 自學期

    BEDROOM TERMINAL

    把整個網路當成教科書。寫了 40 個沒人用過的小工具，學會了 git、CSS 與不放弃。

系統診斷 // 區域負載

FRONTEND
94
BACKEND
81
GRAPHICS
77
DEVOPS
88
ML / DATA
69
DEBUGGING
91
SLEEP
58

※ 數值由本人主觀認定，不保證客觀。
※ SLEEP 欄位持續進行優化中。

0
完成專案
0
合作客戶
0
GIT COMMITS
0
咖啡杯數 EST.
0
LIGHTHOUSE 分數
0
年資 / YEARS
05 / BRAINDANCE ARCHIVE

街景殘影

從我的 braindance 存檔抽出的幾格Still。雨、霓虹、與不太會睡的人。

霓虹後巷
WATSON / 02:14#RAIN
夜市人群
JIG-SIG / 23:41#CROWD
霧中的塔
CITY CENTER / 04:02#FOG
老車頭燈
H10 / 01:27#RIDE
電玩街倒影
LITTLE CHINA / 19:08#GLITCH
屋頂天線
WESTBROOK / 03:55#SIGNAL