【免费下载链接】VelaFast, extensible financial charts for the web. The open-source core of Vela by LuxAlgo.项目地址https://gitcode.com/gh_mirrors/vela5/Vela点击查看免费下载Vela是由 LuxAlgo 开源的金融图表库Fast, extensible financial charts for the web它用一个核心 三层扩展 三个端口的架构让行情数据、指标脚本、渲染后端可以各自独立替换——这正是它又快又稳的底层原因。本文将用尽量少的代码带你 10 分钟看懂这套设计的核心秘密 。Vela 是什么一个可自由换零件的金融图表库大多数图表库把取数据、算指标、画屏幕三件事写死在一起。Vela 反其道而行核心Core只做编排不认识任何具体后端三个扩展层Layers数据源Data providers、脚本引擎Scripting engines、渲染器Renderers三个端口Ports每层通过唯一一个窄接口接入核心。这意味着换一家行情 API、换一个 Pine Script 运行环境、甚至把 WebGL2 渲染器整个换成 Canvas 实现核心代码和其他两层都毫不知情。Vela 工作区同一个核心驱动多张图表、多种指标与成交量分析全局架构一核三层三端口先看整体形状引自官方架构文档 docs/architecture/overview.md层Layer端口Port职责数据提供商层MarketDataFeed提供历史 K 线与实时 tick脚本引擎层ScriptingEngine解析并执行指标脚本渲染器层IChartRenderer把数据模型画成像素三个端口的合同定义就放在 src/core/ports/ 目录下非常精炼行情端口src/core/ports/MarketDataFeed.ts引擎端口src/core/ports/ScriptingEngine.ts渲染端口src/core/ports/IChartRenderer.ts核心只对着合同说话从不点名任何具体实现。箭头永远从核心指向端口而不是指向某层内部的某个类。核心是唯一的总指挥它独占两件事核心并不是薄薄一层转发器。按 docs/architecture/data-flow.md 的说法核心直接拥有两样东西规范 K 线数组canonical bar array核心是主行情数据唯一的加载者和流式订阅者。引擎不会自己去拉数据它只能被喂一份快照渲染器也不拉数据它只负责画。所有已注册的引擎共享同一份数据集避免了每个引擎重复请求。编排循环orchestration loop加载、绘制、按语言选择引擎、把输出路由到正确的面板pane、打上稳定身份 ID、每个 tick 推送更新——什么时候做、按什么顺序做全部由核心决定。具体编排逻辑集中在 src/core/engine/EngineOrchestrator.ts 中。这一条单一所有权原则是三层能保持窄的根本原因层与层之间不互相协调全靠核心协调。三个端口逐个拆窄合同如何约束每一层1️⃣ MarketDataFeed数据的唯一入口行情合同只有两个必需能力 两个可选能力必需加载历史load、订阅实时 ticksubscribe可选范围取数loadRange、品种元数据symbolInfo。可选成员缺失时核心会回退到定义好的行为比如退化为全量加载而不是行为未定义——所以一个最简数据源也永远是合法数据源。默认的行情实现是**带缓存的装饰器**内置数据源外面包一层内存缓存src/data/MultiProviderFeed.ts重复请求不再打穿到交易所 API。缓存对核心完全透明核心分不清自己在和缓存说话还是在和裸数据源说话。2️⃣ ScriptingEngine指标执行的窄表面引擎合同极其克制只有语言 id 能力声明 两个方法Prepare廉价解析脚本返回输入参数 schema 和元数据完全不碰行情数据Execute在 K 线快照上运行返回一个执行会话句柄结果通过回调流出。脚本需要的次级数据比如跨品种、跨周期的序列也不许自己走网络必须走核心提供的带缓存fetchSeries网关——数据进出的每一扇门都在核心手里。3️⃣ IChartRenderer从模型到像素渲染器合同围绕三组职责挂载 / 补丁 / 移除指标按 id 幂等tick 到来时就地打补丁管理面板价格面板永远存在研究指标各有自己的面板发出交互事件十字光标、点击、视口变化等每个都返回取消订阅句柄。默认渲染器是自带WebGL2canvas2d 兜底的原生渲染器位于 src/renderers/native/。想整体替换给构造函数传一个自定义的IChartRenderer类即可。中立模型跨层流通的世界语端口是说话的地方而中立模型neutral model是唯一允许跨越端口边界的东西——K 线、序列、面板、绘图、输入、更新补丁全部用不隶属任何后端的术语描述。它有两个关键约定后端内部类型绝不外泄。数据源交出的是中立 K 线引擎吐出的是中立指标模型渲染器接收的是中立指令时间统一为 epoch 毫秒。每个渲染器在自己的边界处自行换算核心从不去迁就某个后端的时钟。不透明opacity就是全部的意义换渲染器不用碰引擎加数据源也不用教会渲染器任何新东西。为什么默认不带脚本引擎这是一个刻意的决定新图表打开时渲染器必有否则没东西看、数据源必有否则没有 K 线但脚本引擎刻意缺席——裸图表只有 K 线脚本能力是opt-in。原因写在 ADR 里指标执行是重且与语言强相关的负载。如果你请求了一个未注册引擎的语言核心会抛出可操作的错误而不是猜。想跑 Pine Script就安装独立包luxalgo/vela-pinets进程内版 Web Worker 流式版不想引入第三方语言运行时和许可证依赖就什么都不装。这一决策的完整论证见 docs/architecture/adr/0003-no-default-scripting-engine.md。能力协商核心只信声明从不猜测端口很窄但后端能力参差不齐。Vela 的解法是能力声明capabilities 核心无条件信任引擎声明能否流式持久会话、是否感知视口、是否暴露输入渲染器声明面板、填充、标记、绘图、表格、逐点颜色、输入 UI……核心拿到声明就按它路由。典型例子——走实时流式路径必须同时满足图表处于 live 状态、脚本不依赖视口、引擎声明了 streaming少一条就回退为每次 bar 变化重新执行的静态路径。两条路径最终都落到同一个中立模型上。⚠️ 因此如实声明是合同的一部分虚报能力会产生静默错误的输出因为核心照单全收。这套设计如何换来快与稳设计决策带来的收益核心独占 K 线数据单一数据源、单一事实来源无重复拉取行为可预测内容寻址的稳定 IDtick 到达时就地打补丁而不是拆掉重建实时更新开销极低窄端口 中立模型换任何一层都不波及其他两层回归风险小无默认引擎包体不背语言运行时按需 opt-inImport ACL导入访问控制列表分层不是靠自觉而是lint 机械强制违规 import 直接构建失败最后一条尤其值得新手注意很多项目的分层只是文档里的约定Vela 用 ADR 0004 把边界写进了工具链——脚本语言工具链在任何位置都不许被 import自定义渲染器的图表依赖只能留在自己的渲染器目录里。边界是被执行的规则架构才敢长期维持。延伸阅读从哪里继续深挖架构总览一图看懂一核三层三端口docs/architecture/overview.md端口合同与合成根详解docs/architecture/modules.md数据端到端流转追踪docs/architecture/data-flow.md边界与不变量清单docs/architecture/boundaries.md架构决策记录为什么这样设计docs/architecture/adr/README.md合成根唯一允许导入具体后端的入口src/Vela.ts贡献指南如何扩展docs/contributing/小结Vela 架构的秘密其实不复杂只有一条主线核心独占数据并负责编排三层各自守着一个窄端口中立模型是唯一流通的货币。快来自单一数据源 稳定 ID 就地补丁稳来自端口隔离 lint 强制边界。理解了这一点无论你要换数据源、加引擎还是写自定义渲染器路径都清晰可预测 ✅。赞分享【免费下载链接】VelaFast, extensible financial charts for the web. The open-source core of Vela by LuxAlgo.项目地址https://gitcode.com/gh_mirrors/vela5/Vela点击查看免费下载相关推荐image库API设计哲学为什么这样的接口设计能够提高开发效率image库API设计哲学为什么这样的接口设计能够提高开发效率 探索Rust图像处理库的精妙设计了解如何通过统一的接口设计大幅提升开发效率 在当今的软图像处理FastAPI WebSocket掌握连接状态管理的完整指南FastAPI WebSocket掌握连接状态管理的完整指南 FastAPI 作为一款高性能、易学习的现代 Python Web 框架提供了强大的 WebS后端Web框架API设计Lightweight Charts源码架构深度解析高性能金融图表的核心设计Lightweight Charts源码架构深度解析高性能金融图表的核心设计 Lightweight Charts是TradingView推出的高性能金融图表前端图表库金融科技数据可视化创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 
长河君 · 2026/10/15 16:41:23 · 阅读 1.2k 深入Vela架构：一核三层三端口的设计秘密，金融图表为何这样设计才够快够稳
【免费下载链接】VelaFast, extensible financial charts for the web. The open-source core of Vela by LuxAlgo.项目地址https://gitcode.com/gh_mirrors/vela5/Vela点击查看免费下载Vela是由 LuxAlgo 开源的金融图表库Fast, extensible financial charts for the web它用一个核心 三层扩展 三个端口的架构让行情数据、指标脚本、渲染后端可以各自独立替换——这正是它又快又稳的底层原因。本文将用尽量少的代码带你 10 分钟看懂这套设计的核心秘密 。Vela 是什么一个可自由换零件的金融图表库大多数图表库把取数据、算指标、画屏幕三件事写死在一起。Vela 反其道而行核心Core只做编排不认识任何具体后端三个扩展层Layers数据源Data providers、脚本引擎Scripting engines、渲染器Renderers三个端口Ports每层通过唯一一个窄接口接入核心。这意味着换一家行情 API、换一个 Pine Script 运行环境、甚至把 WebGL2 渲染器整个换成 Canvas 实现核心代码和其他两层都毫不知情。Vela 工作区同一个核心驱动多张图表、多种指标与成交量分析全局架构一核三层三端口先看整体形状引自官方架构文档 docs/architecture/overview.md层Layer端口Port职责数据提供商层MarketDataFeed提供历史 K 线与实时 tick脚本引擎层ScriptingEngine解析并执行指标脚本渲染器层IChartRenderer把数据模型画成像素三个端口的合同定义就放在 src/core/ports/ 目录下非常精炼行情端口src/core/ports/MarketDataFeed.ts引擎端口src/core/ports/ScriptingEngine.ts渲染端口src/core/ports/IChartRenderer.ts核心只对着合同说话从不点名任何具体实现。箭头永远从核心指向端口而不是指向某层内部的某个类。核心是唯一的总指挥它独占两件事核心并不是薄薄一层转发器。按 docs/architecture/data-flow.md 的说法核心直接拥有两样东西规范 K 线数组canonical bar array核心是主行情数据唯一的加载者和流式订阅者。引擎不会自己去拉数据它只能被喂一份快照渲染器也不拉数据它只负责画。所有已注册的引擎共享同一份数据集避免了每个引擎重复请求。编排循环orchestration loop加载、绘制、按语言选择引擎、把输出路由到正确的面板pane、打上稳定身份 ID、每个 tick 推送更新——什么时候做、按什么顺序做全部由核心决定。具体编排逻辑集中在 src/core/engine/EngineOrchestrator.ts 中。这一条单一所有权原则是三层能保持窄的根本原因层与层之间不互相协调全靠核心协调。三个端口逐个拆窄合同如何约束每一层1️⃣ MarketDataFeed数据的唯一入口行情合同只有两个必需能力 两个可选能力必需加载历史load、订阅实时 ticksubscribe可选范围取数loadRange、品种元数据symbolInfo。可选成员缺失时核心会回退到定义好的行为比如退化为全量加载而不是行为未定义——所以一个最简数据源也永远是合法数据源。默认的行情实现是**带缓存的装饰器**内置数据源外面包一层内存缓存src/data/MultiProviderFeed.ts重复请求不再打穿到交易所 API。缓存对核心完全透明核心分不清自己在和缓存说话还是在和裸数据源说话。2️⃣ ScriptingEngine指标执行的窄表面引擎合同极其克制只有语言 id 能力声明 两个方法Prepare廉价解析脚本返回输入参数 schema 和元数据完全不碰行情数据Execute在 K 线快照上运行返回一个执行会话句柄结果通过回调流出。脚本需要的次级数据比如跨品种、跨周期的序列也不许自己走网络必须走核心提供的带缓存fetchSeries网关——数据进出的每一扇门都在核心手里。3️⃣ IChartRenderer从模型到像素渲染器合同围绕三组职责挂载 / 补丁 / 移除指标按 id 幂等tick 到来时就地打补丁管理面板价格面板永远存在研究指标各有自己的面板发出交互事件十字光标、点击、视口变化等每个都返回取消订阅句柄。默认渲染器是自带WebGL2canvas2d 兜底的原生渲染器位于 src/renderers/native/。想整体替换给构造函数传一个自定义的IChartRenderer类即可。中立模型跨层流通的世界语端口是说话的地方而中立模型neutral model是唯一允许跨越端口边界的东西——K 线、序列、面板、绘图、输入、更新补丁全部用不隶属任何后端的术语描述。它有两个关键约定后端内部类型绝不外泄。数据源交出的是中立 K 线引擎吐出的是中立指标模型渲染器接收的是中立指令时间统一为 epoch 毫秒。每个渲染器在自己的边界处自行换算核心从不去迁就某个后端的时钟。不透明opacity就是全部的意义换渲染器不用碰引擎加数据源也不用教会渲染器任何新东西。为什么默认不带脚本引擎这是一个刻意的决定新图表打开时渲染器必有否则没东西看、数据源必有否则没有 K 线但脚本引擎刻意缺席——裸图表只有 K 线脚本能力是opt-in。原因写在 ADR 里指标执行是重且与语言强相关的负载。如果你请求了一个未注册引擎的语言核心会抛出可操作的错误而不是猜。想跑 Pine Script就安装独立包luxalgo/vela-pinets进程内版 Web Worker 流式版不想引入第三方语言运行时和许可证依赖就什么都不装。这一决策的完整论证见 docs/architecture/adr/0003-no-default-scripting-engine.md。能力协商核心只信声明从不猜测端口很窄但后端能力参差不齐。Vela 的解法是能力声明capabilities 核心无条件信任引擎声明能否流式持久会话、是否感知视口、是否暴露输入渲染器声明面板、填充、标记、绘图、表格、逐点颜色、输入 UI……核心拿到声明就按它路由。典型例子——走实时流式路径必须同时满足图表处于 live 状态、脚本不依赖视口、引擎声明了 streaming少一条就回退为每次 bar 变化重新执行的静态路径。两条路径最终都落到同一个中立模型上。⚠️ 因此如实声明是合同的一部分虚报能力会产生静默错误的输出因为核心照单全收。这套设计如何换来快与稳设计决策带来的收益核心独占 K 线数据单一数据源、单一事实来源无重复拉取行为可预测内容寻址的稳定 IDtick 到达时就地打补丁而不是拆掉重建实时更新开销极低窄端口 中立模型换任何一层都不波及其他两层回归风险小无默认引擎包体不背语言运行时按需 opt-inImport ACL导入访问控制列表分层不是靠自觉而是lint 机械强制违规 import 直接构建失败最后一条尤其值得新手注意很多项目的分层只是文档里的约定Vela 用 ADR 0004 把边界写进了工具链——脚本语言工具链在任何位置都不许被 import自定义渲染器的图表依赖只能留在自己的渲染器目录里。边界是被执行的规则架构才敢长期维持。延伸阅读从哪里继续深挖架构总览一图看懂一核三层三端口docs/architecture/overview.md端口合同与合成根详解docs/architecture/modules.md数据端到端流转追踪docs/architecture/data-flow.md边界与不变量清单docs/architecture/boundaries.md架构决策记录为什么这样设计docs/architecture/adr/README.md合成根唯一允许导入具体后端的入口src/Vela.ts贡献指南如何扩展docs/contributing/小结Vela 架构的秘密其实不复杂只有一条主线核心独占数据并负责编排三层各自守着一个窄端口中立模型是唯一流通的货币。快来自单一数据源 稳定 ID 就地补丁稳来自端口隔离 lint 强制边界。理解了这一点无论你要换数据源、加引擎还是写自定义渲染器路径都清晰可预测 ✅。赞分享【免费下载链接】VelaFast, extensible financial charts for the web. The open-source core of Vela by LuxAlgo.项目地址https://gitcode.com/gh_mirrors/vela5/Vela点击查看免费下载相关推荐image库API设计哲学为什么这样的接口设计能够提高开发效率image库API设计哲学为什么这样的接口设计能够提高开发效率 探索Rust图像处理库的精妙设计了解如何通过统一的接口设计大幅提升开发效率 在当今的软图像处理FastAPI WebSocket掌握连接状态管理的完整指南FastAPI WebSocket掌握连接状态管理的完整指南 FastAPI 作为一款高性能、易学习的现代 Python Web 框架提供了强大的 WebS后端Web框架API设计Lightweight Charts源码架构深度解析高性能金融图表的核心设计Lightweight Charts源码架构深度解析高性能金融图表的核心设计 Lightweight Charts是TradingView推出的高性能金融图表前端图表库金融科技数据可视化创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考