跳到主要内容
高频状态与复杂交互

实时交易平台前端

围绕交易链路、多账户、实时推送、虚拟表格和行情图表数据源构建稳定的前端模块。

  • 在职项目经验
  • 核心前端开发
  • 2025—至今

场景概念示意,非产品截图。

项目场景

交易界面的核心不是信息密度,而是让持续变化的状态始终可判断、可操作。

  • Vue 3 / TypeScript
  • WebSocket
  • TradingView
  • 虚拟列表
场景
交易平台同时承载行情、账户、订单和图表等高频变化信息,对状态一致性、渲染效率和异常恢复都有较高要求。
核心问题
在 WebSocket 持续推送、多账户切换和大数据表格场景下,维持清晰的数据流和稳定的交互反馈。

关键实现

  1. 基于 Vue 3、TypeScript、Vite 与 Pinia 组织模块和状态边界。
  2. 围绕 WebSocket 实时更新设计页面数据链路,并处理多账户上下文。
  3. 使用虚拟化表格承载高密度列表,减少无效渲染。
  4. 接入 KLineChart Pro 与 TradingView Datafeed,连接行情数据与图表交互。
  5. 参与上线后的独立维护,持续定位交易链路和图表数据问题。

工作链路

  1. 实时行情 / 账户事件
  2. 状态归一化
  3. 表格与图表渲染
  4. 交易交互
  5. 异常定位与维护

相关入口与记录

工程复盘文章

站内记录了图表分辨率切换后只剩一根跳动 K 线的定位过程和最小修复。

阅读 K 线问题复盘

公开范围

  • 角色为核心前端开发,并非独立完成整个交易系统。
  • 不展示公司内部数据、业务截图、交易策略或未经公开的性能指标。