Frontend · GitHub · Algorithms

PXCharts 4.0 Ships a Self-Hosted Multidimensional Table with 25 Field Types, 8 Views, and a Hand-Rolled Formula Engine

By 徐小夕 · Aug 26, 2026

Read original on juejin.cn ↗ Google Translate ↗ Alt translation

Teams that cannot or will not put sensitive operational data on a commercial SaaS now have a feature-comparable alternative they can run on their own infrastructure. The formula engine and automation guardrails are documented in enough detail to serve as a reference architecture for anyone building collaborative data tools.

Summary

PXCharts 4.0 bundles 25 field types — from text and selects to relations, rollups, and AI-generated columns — with eight live views (table, kanban, Gantt, calendar, gallery, form, hierarchy, chart) that all read and write the same underlying data. A hand-written formula engine supports 32 Excel-aligned functions and uses row-level incremental recalculation, dropping a 20,000-row edit from 86 ms to 0.006 ms. An automation engine with three triggers and seven actions (including webhooks, WeCom/DingTalk bots, and AI generation) includes an explicit guard against self-triggering infinite loops.

Real-time collaboration runs over a single WebSocket process colocated with the Next.js REST API, using a room model with presence. Writes go through SELECT … FOR UPDATE row locks inside transactions to prevent concurrent overwrites. The AI suite goes beyond a chat sidebar: an AI field type accepts prompt templates that reference other columns for batch generation, plus one-sentence table creation and natural-language filtering.

Thirty-two industry templates ship as fully editable projects, not static screenshots. The whole stack — Next.js 14, React 18, TypeScript 5, PostgreSQL with JSONB, Zustand, and the ws library — is open-source and designed for a single-port, single-process deployment that small teams can start with PM2.

Takeaways

— 25 field types include relation, lookup, rollup, formula, AI, button, barcode, and location, covering most business-data shapes without plugins.

— Eight views — table, kanban, Gantt, calendar, gallery, form, hierarchy, chart — all operate on the same dataset; a change in one view propagates everywhere.

— A hand-written formula engine with 32 Excel-aligned functions uses row-level incremental recalculation, cutting a 20,000-row edit from 86 ms to 0.006 ms.

— The automation engine supports three triggers (record created, record updated, button clicked) and seven actions, including webhook, email, WeCom/DingTalk bots, and AI generation.

— An explicit guard skips an update-field action when the value hasn't changed, preventing the automation from re-triggering itself in an infinite loop.

— Real-time collaboration uses a WebSocket room model colocated with the Next.js server; cell edits broadcast as patches, and presence shows who is viewing a table.

— Concurrent writes are serialized with SELECT … FOR UPDATE row locks inside a transaction, and a backup snapshot is saved asynchronously after each successful write.

— AI capabilities include an AI field type that batch-generates column values from prompt templates, one-sentence table creation, and natural-language query translation.

— 32 industry templates ship as complete, editable projects with fields, views, and sample records — not static screenshots.

— The entire stack (Next.js 14, React 18, TypeScript 5, PostgreSQL/JSONB, Zustand, ws) runs in a single process deployable with PM2 on one port.

Conclusions

PXCharts treats AI as a field-level primitive rather than a sidebar chatbot, which means AI output becomes a first-class column that other views, formulas, and automations can consume directly.

The decision to store an entire table's records in a single JSONB column simplifies reads dramatically but makes the FOR UPDATE row lock essential — it's a trade-off that works for small-to-medium tables but would need re-architecting at very high concurrency.

Broadcasting a pre-serialized JSON string to all room members instead of serializing per-client is a small optimization that compounds meaningfully in collaborative editing, where patch messages fire on every keystroke.

The automation engine's dead-loop guard is a single `continue` statement that checks value equality before applying an update — a reminder that production workflow engines often hinge on one well-placed line of defensive code.

Colocating the WebSocket server with the Next.js process eliminates cross-origin and deployment complexity at the cost of coupling; for a self-hosted tool aimed at small teams, that's a pragmatic choice that removes entire categories of operational friction.

Concepts & terms

Multidimensional table

A database-backed spreadsheet that lets users view and manipulate the same underlying records through multiple interfaces — table, kanban, calendar, Gantt chart, etc. — rather than a single grid. Popularized by tools like Airtable and Feishu Base.

Optimistic update

A UI pattern where the interface reflects a change immediately on the client before the server confirms it, then reconciles if the server rejects the change. PXCharts uses this for cell edits: the cell updates locally, then a patch broadcasts to collaborators, and the database write happens last.

SELECT … FOR UPDATE

A PostgreSQL row-level lock that prevents concurrent transactions from modifying the same row until the locking transaction commits. PXCharts uses it to serialize writes to a table's JSONB record blob so two users editing the same table don't overwrite each other.

JSONB

A binary JSON storage format in PostgreSQL that supports indexing and querying. PXCharts stores an entire table's records in a single JSONB column, trading relational normalization for simplicity and zero-JOIN reads at small-to-medium scale.

Incremental formula recalculation

Instead of recomputing every formula in a spreadsheet when any cell changes, only the formulas in the affected row are recalculated. PXCharts applies this row-level strategy to keep formula evaluation fast on large tables.

Source: juejin.cn ↗ Google Translate ↗ Backup ↗