在日常開發(fā)中，編輯器、終端、瀏覽器、文檔查看器——這些工具各自打開一扇窗口，堆疊在屏幕上的結(jié)果，就是一場沒完沒了的 Alt+Tab 循環(huán)。一名開發(fā)者正是受夠了這種體驗(yàn)，干脆動(dòng)手做了一個(gè)類 Figma 風(fēng)格的畫布 IDE，將所有工作窗口放到同一塊無限延展的畫布上。

這個(gè)項(xiàng)目叫 Cate，其核心理念一句話就能概括：把整個(gè)工作區(qū)變成一塊可以自由排布面板的畫布，而不是一堆可以切換的窗口。用戶可以在畫布上拖入代碼編輯器、終端、瀏覽器、PDF 文檔，各自放在任意位置，用縮放和平移來組織它們之間的空間關(guān)系。重要的是，這些布局可以被保存，下次打開時(shí)整個(gè)工作區(qū)狀態(tài)可以一鍵恢復(fù)——相當(dāng)于給你的每個(gè)項(xiàng)目或每個(gè)工作會(huì)話，各自配備一套專屬的"桌面布局"。

Cate 整體架構(gòu)如下：

src/
├── agent/              # Embedded Pi coding-agent integration
│   ├── main/           # Agent process manager, auth, marketplace, session files
│   ├── renderer/       # Agent panel UI, chat thread, providers, model prefs
│   └── extensions/     # Bundled Cate plan-mode Pi extension
├── main/               # Electron main process
│   ├── ipc/            # IPC handlers (filesystem, git, terminal, menu, drag)
│   ├── analytics       # Update/app event analytics helpers
│   ├── appContext      # Shared main-process app state
│   ├── featureFlags    # Runtime feature flags
│   ├── shellEnv        # Login-shell environment capture
│   ├── shellResolver   # Shell path resolution with fallback chain
│   ├── workspaceManager# Workspace lifecycle and session persistence
│   ├── workspaceRoots  # Allowed-roots registration and validation
│   ├── windowRegistry  # Window management (main, dock, detached)
│   ├── webSecurity     # Webview hardening and CSP
│   ├── auto-updater    # Update checks and release fetch
│   ├── sentry          # Sentry integration
│   ├── store           # electron-store persistence
│   ├── jsonFileStore   # JSON-backed file persistence helpers
│   ├── menu            # Application menu
│   └── sessionTrust    # Session restore validation
├── preload/            # Context-isolated bridge exposed to the renderer
├── renderer/           # React 18 application
│   ├── assets/         # Renderer images and asset declarations
│   ├── canvas/         # Infinite canvas rendering, drag, resize, placement
│   ├── docking/        # Tabs, splits, detached dock windows, drag/drop
│   ├── drag/           # Cross-window drag-and-drop runtime and state
│   ├── panels/         # Terminal, Editor, Browser, Document, Git, Explorer,
│   │                   # Projects, Canvas panel registry/components
│   ├── sidebar/        # Workspace, File Explorer, Source Control,
│   │                   # Parallel Work, Project List, fileClipboard
│   ├── dialogs/        # Saved layouts and post-update feedback dialogs
│   ├── settings/       # Settings window sections and shortcut recorder
│   ├── ui/             # CommandPalette, GlobalSearch, NodeSwitcher,
│   │                   # WelcomePage, ShortcutHintOverlay
│   ├── shells/         # Main, panel, and dock window shells
│   ├── stores/         # Zustand stores (canvas, app, dock, settings,
│   │                   # shortcut, status, ui, update, url prompt)
│   ├── hooks/          # Custom React hooks (shortcuts, canvas interaction)
│   ├── lib/            # Utilities (coordinates, routing, terminal registry)
│   ├── workers/        # Monaco/editor workers
│   └── styles/         # Tailwind/global styles
└── shared/             # IPC channel definitions and shared TypeScript types


 

從技術(shù)實(shí)現(xiàn)來看，Cate 基于 Electron 41 + React 18，引入了 Monaco Editor（VS Code 的編輯器內(nèi)核）作為代碼面板，終端則使用了 xterm.js + node-pty 的組合來保證原生體驗(yàn)。PDF 和 DOCX 文檔有專門的渲染面板，Git 操作也有內(nèi)置的文件監(jiān)視和版本控制視圖。AI 輔助編程則以"Pi Agent 面板"的形式集成在畫布上。Cate 支持 macOS、Windows 和 Linux，提供了預(yù)編譯包，用戶也可以直接拉取源碼自行構(gòu)建。

這種 spatial IDE 的思路，本質(zhì)上是在解決多任務(wù)工作流中的空間記憶問題。當(dāng)一個(gè)開發(fā)者同時(shí)處理前端、數(shù)據(jù)庫查詢、API 調(diào)試等多個(gè)上下文時(shí)，各工具之間的空間位置關(guān)系本身就是一種信息。例如，將"調(diào)試終端"固定在左側(cè)、"數(shù)據(jù)庫 UI"固定在右側(cè)，這種布局本身就承載了工作狀態(tài)的意義，下次恢復(fù)時(shí)無需重新安排，直接進(jìn)入狀態(tài)。

當(dāng)然，這類探索并非新鮮事。Niri 等平鋪式窗口管理器已經(jīng)在 Linux 上探索過類似的方向，VS Code 的 Remote SSH 也部分解決了跨設(shè)備工作區(qū)同步的問題。但 Cate 將這套理念直接落地到了本地桌面開發(fā)環(huán)境，并且加入了畫布持久化和跨會(huì)話恢復(fù)的能力，在工程化和產(chǎn)品化上往前走了一步。開發(fā)者在 Reddit 上也提到，雖然借鑒了平鋪窗口管理器的工作流思路，但最大區(qū)別在于這是一個(gè)圍繞項(xiàng)目的持久化畫布，而非單純的窗口放置工具。

當(dāng)前 Cate 仍處于積極開發(fā)階段，用戶反饋主要集中在兩點(diǎn)：一是新窗口打開時(shí)的位置策略（是否應(yīng)該自動(dòng)排列而非用戶手動(dòng)拖放），二是批量操作多個(gè)窗口時(shí)的體驗(yàn)優(yōu)化（比如框選多個(gè)面板后彈出操作菜單）。作者在 Reddit 上也明確表示，這些反饋都被認(rèn)真對待并計(jì)劃納入迭代。對于一個(gè)剛公開不久的項(xiàng)目來說，這種開放態(tài)度和迭代速度是積極的信號。

參考來源：

• Reddit - r/coolgithubprojects（https://www.reddit.com/r/coolgithubprojects/comments/1tdt4qt/i_got_tired_of_alttabbing_so_i_built_a_figmastyle/）

• Cate GitHub（https://github.com/0-AI-UG/cate）