Research · Часть 1 из 2 · Графики

Из чего сделаны графики
трейдинг-платформ

Teardown того, как устроены чарт-движки у TradingView и его «метаков» — на живом коде, сети и публичных бандлах. Рендер на GPU, потоковый data-layer, встроенный AI и бизнес-модель вокруг графика. Часть 2 — про маркетплейсы, языки и стратегии.

метод live code + network inspection основной кейс TakeProfit.com рендер WebGL2 instanced data gRPC-web / Protobuf дата 2026-06
60fps
цель GPU-рендера
instanced draw calls
100K+
свечей в кадре
без падения FPS
14
protobuf-сервисов
market-data + trading
$10M
seed-раунд кейса
ex-TradingView CMO
Ландшафт

TradingView и его «метаки»

Рынок графических терминалов вращается вокруг одной точки притяжения — TradingView. Все «метаки» (платформы, выросшие из той же идеи) переизобретают три вещи: рендер графика, язык расширений и маркетплейс. Эта часть — про первое. Вторая часть — про язык и маркетплейс.

TradingView

Эталон. Два движка: Lightweight Charts (free OSS, Canvas2D) как воронка и Charting Library (лицензионный, закрытый) для серьёзных терминалов. Язык — Pine Script.

Canvas2Dлицензия

TakeProfit главный кейс

Основан экс-CMO TradingView. Ставка — GPU-рендер на PixiJS/WebGL2, кастомный time-series движок, виджет-воркспейс и свой Python-подобный язык Indie®.

WebGL2gRPC-web

Свой движок (Walbi/zerox)

Внутренний ориентир: WebGL2-движок с нуля, datafeed-агностичный, 1M свечей @120fps. Цель — заменить лицензионный TV-виджет в проде.

WebGL2own IR
Ключевой инсайт: победа не в «красивее нарисовать свечу», а в связке GPU-рендер + потоковый бинарный протокол + кастомный time-series движок. Дальше разбираем каждый слой на доказательствах из кода.
Стек · доказательно

Анатомия кейса: TakeProfit

Всё ниже извлечено из публичных SvelteKit-бандлов и сетевого трафика (Playwright). Живой торговый терминал — за логином (Stytch), поэтому chart-engine разбирался по JS-чанку, а не по работающему графику.

СлойТехнологияДоказательство в кодеКласс
ФреймворкSvelteKit (SSR + hashed immutable chunks)/_app/immutable/…, __sveltekit_*UI
WebGL-рендерерPixiJS v7 (@pixi/core,math,unsafe-eval)checkMaxIfStatementsInShader, drawElementsInstancedANGLE, литералы 7.0–7.2GPU
GL-контекстWebGL2 (fallback на webgl)getContext("webgl2")GPU
Chart-движокКастомный, забандлен вместе с PixiAPI похож на lightweight-charts (series, priceScaleId), но рендер — Pixi/GPUGPU
Техника рендераWebGL2 instanced draw callsinstanceBuffer, instanceCount, drawArraysInstanced, VAO, interleaved buffersGPU
ШейдерыИнлайн GLSLprecision highp float; gl_Position в 3 чанках (свечи + Order-Flow Bubbles + Market Depth)GPU
ТранспортConnect-ES / gRPC-web over Protobuf@bufbuild/protobuf, connect-web, useBinaryFormatNET
СтримингSharedWorker (общий на вкладки)OrderBookStreamManager.worker, snapshot+delta reconcileNET
Редактор кодаCodeMirror 6 + язык Indie®@codemirror/state, custom indieLang, oneDarkDSL
AIIn-app чат, BYO-key, провайдер Anthropicai_chat_api_key_provider_anthropic, MCP-интеграцияAI
Auth / analyticsStytch + Google OAuth · PostHog self-proxy · Sentryapi.stytch.takeprofit.com, a.takeprofit.comNET
Честная оговорка про WASM. Маркетинг заявляет WASM + C/C++ оптимизации, но на публичном чарт-роуте не загрузился ни один .wasm и нет WebAssembly.instantiate. Модуль может быть (а) серверным, (б) лениво-загружаемым внутри gated-терминала, либо (в) преувеличен. Не подтверждено.
Рендер

Три способа нарисовать свечу

Главная техническая развилка чарт-движка — чем рисовать. От этого зависит, сколько свечей держится в кадре на 60fps. Ниже — относительная ёмкость трёх подходов (порядок величины, не бенчмарк конкретного устройства).

Canvas2DLightweight Charts
~5–10K свечей
SVG / DOMнаивные либы
~1–2K свечей
WebGL PixiTakeProfit
~100K+ свечей
WebGL2 customсвой движок
~1M свечей @120fps

Почему instancing решает

Вместо тысяч отдельных draw-вызовов (по одному на свечу) GPU получает одну геометрию свечи и буфер инстансов — массив (x, open, high, low, close, цвет) на каждую свечу. Один drawArraysInstanced рисует все свечи разом. CPU почти не участвует — отсюда «60fps под нагрузкой».

Что это даёт продукту

  • Бесшовный зум/пан по миллионам баров
  • Тиковые / секундные таймфреймы (1s, 3s, 5s) без лагов
  • Тяжёлые оверлеи: Order-Flow Bubbles, Market Depth — те же шейдеры
  • Экономия на сервере: меньше агрегации, больше сырых данных на клиент
Интерактив · живой WebGL2

Instanced-рендер свечей вживую

Не картинка — реальный WebGL2 instanced рендер прямо в этой странице, ровно по технике из teardown: одна геометрия свечи + буфер инстансов + один draw-вызов на кадр. Двигай ползунок до 200 000 свечей и смотри на FPS. Это и есть «секрет 60fps».

WebGL2 · drawArraysInstanced instanced ✓
fps
свечей:
draw calls/кадр: 1
инстансов/call:
Выключи instancing — движок начнёт рисовать свечи по одной (draw-call на свечу), и FPS обвалится на тех же данных. Это наглядно показывает, почему весь рынок ушёл с Canvas2D/DOM на GPU-инстансинг. На слабых GPU верхний предел ниже — это нормально.
Data-layer

Не REST и не голый WebSocket

Под графиком — бинарный потоковый протокол. TakeProfit гоняет Connect-ES / gRPC-web поверх Protobuf, а стримы держит в SharedWorker, общем для всех вкладок: один сокет на браузер, снапшот+дельта-реконсиляция стакана, переподключение с политикой повтора.

Go microservicesgRPC · Bazel monorepo Time-series DBcandles из сырых quotes SharedWorkerConnect server-streamsnapshot + delta merge Tab · ChartPixiJS / WebGL2 Tab · Order BookMarket Depth Tab · Screenerобщий сокет BACKEND BROWSER · 1 сокет на все вкладки TABS

Контракт: protobuf-сервисы (typeName из кода)

ДоменСервисНазначение
market-datacandle.v1.CandleOffsetApiбары/свечи, offset-пагинация (поля offsets, bars, candle)
market-datacandle.v1.ExtrapolationApiдостройка незакрытой свечи в реальном времени
market-dataquote.v1.QuoteApiсырые котировки → из них генерятся свечи на лету
market-dataorder_book.v1.OrderBookApiстакан, snapshot+delta
market-datafundamental.v2 · ratio.v2.CatalogueApiфундаментал и мультипликаторы
reference{exchange,industry,security}.v1.*справочники инструментов/бирж
screenerv2.StockScreenerApi · v2.CategoryApiскринер акций
tradingtrading.v1.TradingApiордера / портфель
alertstpi_alerts · tpi_notifications · tpi_popup_senderалерты и доставка (Telegram/Discord webhook)
indicatorcode_migrator.v1.CodeMigratorApiмиграция версий Indie-кода

Динамический time-series

Свечи строятся на лету из сырых quotes (CandleOffset + Extrapolation) → произвольные таймфреймы вплоть до секунд. «Собственный движок time-series».

Бинарный формат

useBinaryFormat — Protobuf по проводу вместо JSON: меньше байт, быстрее парс, типобезопасный контракт клиент↔сервер.

Один сокет на браузер

SharedWorker экономит соединения: 5 вкладок = 1 стрим. Реконсиляция стакана переживает реконнект (delta before snapshot → ресинк).

AI-слой

AI встроен в график, а не прикручен сбоку

AI-ассистент работает с контекстом виджетов: текущий тикер, биржа, таймфрейм, видимый диапазон графика, индикаторы, рисунки. Провайдер — Anthropic, ключ — пользовательский (BYO-key), плюс интеграция через MCP-сервер (Claude Code CLI / Cursor / VSCode).

  • Анализ структуры графика, уровней, паттернов
  • Бычьи/медвежьи сценарии (условные, без прямых «buy/sell»)
  • Пишет, чинит и объясняет Indie®-скрипты
  • Оценка размера позиции и риск-параметров
  • Поиск по документации платформы

MCP как канал монетизации разработки

Тот же MCP-сервер, что обслуживает чат, открыт наружу — LLM пишут/конвертируют/валидируют Indie-код прямо в IDE разработчика. AI-кодген индикаторов → больше скриптов в маркетплейсе → подробнее в Части 2.

AI отвечает только по-английски вне зависимости от языка промпта и принципиально не даёт прямых торговых команд — только условные сценарии. Это сознательное продуктовое/комплаенс-решение.
Бизнес-модель

График — это воронка, а не продукт

Сам по себе график денег не приносит. Деньги — вокруг него: брокерские интеграции, подписки, маркетплейс и реферальная экономика. Разбор экономики маркетплейса целиком — в Части 2; здесь — рамка.

$10M
seed-раунд
по данным прессы
ex-CMO
основатель
из TradingView
3
брокера в iframe
lime · j2t · ilotcos
DEX
крипто-фиды
Uniswap · Hyperliquid · Aster

Откуда деньги

  • Брокерские интеграции — встроенные iframe-виджеты (ордер + портфель): lime.widget, j2t.widget, ilotcos.widget. Платформа = точка входа, брокер платит за поток.
  • Подписки / планы — платный доступ к фичам и данным.
  • Маркетплейс индикаторов — комиссия с продаж скриптов.
  • Реферальная сеть — 25% lifetime, evercookie-трекинг (Rewardful).
  • DEX-фиды — заход в крипту без классического брокера.

Почему стек именно такой

Дорогой GPU-движок и бинарный протокол — это не инженерное тщеславие, а стоимость удержания. Чем плавнее график и чем больше на нём «залипательных» слоёв (order-flow, depth, секундные ТФ), тем выше retention, тем дороже стоит реклама брокера и тем больше LTV у реферала. Технология подчинена воронке.

Вывод для своего продукта: вкладываться в рендер имеет смысл только если за графиком стоит монетизация (брокер/подписка/маркетплейс). Иначе это красивый, но дотационный виджет.
Бенчмарк · 8 платформ + наш движок

Сравнение бизнесов: размеры и функционал

Конкурентная разведка по 8 платформам — TradingView, MetaTrader 4/5, thinkorswim, cTrader, NinjaTrader, TradeStation, MultiCharts. Кто стоит за продуктом, какого размера, как зарабатывает и что умеет график. Метод — 8 прогонов Deep Research по единой структуре (секции 1–9), сведено в матрицу. Запуск 2026-06-09.

Три мира: forex/CFD-розница (MT4, MT5, cTrader) · фьючерсы/проф-США (NinjaTrader, TradeStation) · универсальный анализ и соц (TradingView, MultiCharts, thinkorswim). Деньги напрямую с трейдера берут только TradingView (подписка) и NinjaTrader/MultiCharts (лицензия) — остальные бесплатны, зарабатывают брокеры на потоке.

Размеры компаний — переключи метрику

Кто за платформой стоит и насколько он большой. Бары нормированы к максимуму в каждой метрике (поэтому Schwab почти всегда «во всю ширину» — это конгломерат, для которого thinkorswim лишь побочный инструмент).

Выручка: годовая (FY2025 для Schwab; ARR/оценки для частных). «н/д» — не раскрыта.
Дисклеймер по цифрам. Точны только Schwab (отчётность SEC) и сделки M&A (Kraken купил NinjaTrader за $1.5B 20.03.2025; Monex купил TradeStation за ~$402M в 2011). Остальное — сторонние оценки (Owler/Growjo/Tracxn/Revelio/LeadIQ/GetLatka), расходятся в разы: штат TradingView 409↔3388, выручка MetaQuotes $1.5M↔«сотни млн».

Кто за платформой стоит

КомпанияПродуктОсн.Владелец / оценкаКлиенты / юзерыРевенюШтат
Charles Schwabthinkorswim1971Публичная (NYSE: SCHW)38.5M счетов · $11.9T активов$23.9B net rev FY2025 (+22%)33 000 FTE
TradingViewTradingView2011Частная · $3B (2021), unicorn100M+ рег · ~50M MAU · 1M+ платящих~$173M ARR (2023)~2 400–3 400
NinjaTrader GroupNinjaTrader2003Куплен Kraken $1.5B (2025)~800k активных · ~2M сообществоest ~$80M~440–515
TradeStationTradeStation1982Дочка Monex · куплена ~$402M (2011)151 081 счёт · $14.1B активовest $100–500M~550–850
MetaQuotesMT4, MT52000Частная (Кипр)MT4+MT5 ~83.8% платформ (2022)не раскрыта · est $5–25M…«сотни млн»~200–220
SpotwarecTrader2010Частная (Кипр)11M+ трейдеров · 300+ брокеровне раскрыта~150+
MultiChartsMultiCharts2005Частная (MCT, Гибралтар)10k+ клиентов · 175 стран~$1.8M (est)малый

Единственный гигант

Schwab ($23.9B / 33k / 38.5M) — но thinkorswim для него побочный инструмент, не бизнес.

Единственный чистый чарт-игрок масштаба

TradingView (~$173M ARR, $3B, bootstrap→unicorn). Прямой ориентир по бизнес-модели.

Крипта заходит в TradFi-чарты ⚠️

Kraken купил NinjaTrader за $1.5B (2025). Сигнал: крипто-биржи скупают графические платформы.

Архетипы монетизации

АрхетипПлатформыКто платитМеханика
White-label B2BMT4, MT5, cTraderБрокерыЛицензии/объём + маркетплейс 20–30%
Broker-funded (free)thinkorswim, TradeStationТрейдер косвенноКомиссии / спред / PFOF
License + brokerNinjaTraderТрейдерLifetime $1 499 / Lease $99 + комиссии
Freemium SaaSTradingViewТрейдерПодписка $0–199/мес + данные + реклама
Paid licenseMultiChartsТрейдерLifetime ~$1 497 + market data $49/мес

Маркетплейс-комиссии: MetaQuotes 20%, Spotware 30%. thinkorswim/TradeStation — платформа бесплатна, доход с брокерского потока (PFOF/спред/проценты).

Ценообразование (детально)

ПлатформаFreeПлатные тарифы (USD)Биржевые данныеМаркетплейсИтог трейдеру
MetaTrader 4платформа $0— (VPS $12.8–15/мес опц.)от брокера, freeMQL5 20%$0 + брокерский спред
MetaTrader 5платформа $0— (VPS $12.8–15/мес)от брокера, freeMQL5 20%$0 + брокерский спред
thinkorswim$0 клиентам Schwab— (нет подписки)L1 free; L2 free при 120 сд/год, иначе платно— (Sharing Center)$0 + комиссии (акц $0 / опц $0.65 / фьюч $2.25)
TradingViewBasic $0$12.95 / $29.95 / $59.95 / $199.95 /месcrypto/forex free; CME $7 non-pro vs $548 procommunity freeподписка $0–199.95/мес + данные
cTraderплатформа $0от брокераStore 30%; Copy ≤30%$0 + спред (~$3/сторона)
NinjaTraderFree $0Lease $99/мес · Lifetime $1 499 · Order Flow+ $59/месCME L1 $12 / L2 $48/месEcosystem (3rd)$0–1 499 ПО + комиссии $0.09–1.29/контр
TradeStation$0 брокерскимне-брокер $99.99/месbase free; L2 доп (~$11/мес)TradingApp Store$0 брокерским + комиссии (акц $0 / фьюч $1.75→$0.50)
MultiChartsFree (sim only)~$79–149/мес · Lifetime ~$1 497market data +$49/меснет встроенноголицензия + $49/мес данные
Ключевое: подписку за саму платформу берёт ТОЛЬКО TradingView; остальные 7 — free для трейдера (брокерская модель) либо лицензия. Биржевые данные почти везде — отдельная строка расходов (ярче всего разрыв CME $7 non-pro vs $548 pro).

Кросс-платформенность (ОС)

Реально «везде» только TradingView и thinkorswim. MultiCharts — только Windows (нет mobile/web/Mac). NinjaTrader/TradeStation-classic — Windows-центричны.

ПлатформаWinMacLinuxWebiOSAndroid
TradingView
thinkorswim
MetaTrader 4WineWine
MetaTrader 5WineWine
cTraderCLI
NinjaTrader
TradeStationTITAN X
MultiCharts

Графики · стакан · бэктест

ПлатформаИндик.DrawМакс граф.DOMOrder flowBacktestWFA
MetaTrader 43023LimitedLimited
MetaTrader 53844100Tick
TradingView400+110+16 брокерплатн.Bar
cTrader58~31~42Advanced ×3TickPartial
NinjaTrader100+30+∞ табыAdvanced$59 add-onTick
TradeStation150+∞ TITANXAdvancedadd-onTick
MultiCharts200+100AdvancedTick
thinkorswim400+≤20разреш.AdvancedAdd-onLimited
walbi-chart (наш)1791000Vol Profilereplay
Edge нашего движка — перформанс. walbi-chart на WebGL2 тянет 1M свечей @6мс и стену 1000 графиков в одном контексте (market-scanner). TradingView и Ко — Canvas2D (~40k баров потолок, 1M крашит iOS Safari). Ниша, которую incumbents физически не закрывают. Второй edge — universal script runtime (wlb-script): каждая из 8 платформ заперта в своём DSL, скрипты не переносятся — см. Часть 2 · переносимость.

Под какой сценарий — какая платформа

Forex/CFD розница, дешёвая автоматизация

MT4/MT5 (экосистема MQL) или cTrader (C#/Python, честный DOM, sub-ms, cloud-боты).

Фьючерсы + order flow

NinjaTrader (Order Flow+, SuperDOM, низкая маржа) или TradeStation (Matrix).

Бэктест / портфель / кванты

MultiCharts (Portfolio Trader + WFA + agnostic) или TradeStation (Portfolio Maestro).

Анализ / мульти-ассет / соц / кросс-девайс

TradingView (чарт-движок, 3.5M инструментов, web+mobile).

Опционы

thinkorswim (Analyze / греки / Risk Profile / probability cone) или TradeStation.

Перф / стена графиков / кросс-DSL

walbi-chart + wlb-script — неперекрытая ниша: 1M свечей, 1000 графиков, скрипты из всех экосистем в одном движке.

Пробелы данных (честно). thinkorswim не раскрывает число именно ToS-юзеров (38.5M = все счета Schwab). # осцилляторов вендоры нигде не выделяют. Точные тиры MultiCharts — JS-рендеринг, дана оценка. Маркетплейс MetaQuotes (~13 970 продуктов) — из публикации, мог устареть. cTrader: 58 индик. офиц. vs ~86 в обзорах.
Контекст

Экосистема TradingView как фон

Чтобы оценить «метаков», нужен эталон. У TradingView — двухуровневая модель движков, и она же задаёт правила игры для всех остальных.

Продукт TVЧто этоРендерЛицензияРоль в воронке
Lightweight Chartsлёгкая OSS-либа графиковCanvas2DApache-2.0, freeзахват разработчиков, top-of-funnel
Charting Libraryполный терминал-виджетCanvas2Dбесплатно, но по заявке + лицензиясерьёзные клиенты (брокеры, биржи)
Pine Scriptязык индикаторов/стратегийMPL-2.0 + credit по умолчаниюконтент и lock-in (см. Часть 2)
PineJSJS-API кастом-индикаторовв составе Charting Libraryрасширяемость для лицензиатов
Walbi сегодня сидит на лицензионном TV Charting Library (self-hosted виджет, verified). Именно этот виджет и целятся заменить собственным WebGL2-движком — TradingView здесь первая цель миграции. «Метаки» вроде TakeProfit идут тем же путём, только сразу на GPU.
Метод и честные дыры

Что доказано, а что нет

✓ Подтверждено в коде

  • SvelteKit, PixiJS v7, WebGL2-контекст
  • Instanced draw calls + инлайн-GLSL
  • Connect-ES / gRPC-web / Protobuf контракт
  • SharedWorker-стриминг, реконсиляция стакана
  • Indie® DSL + CodeMirror 6, CodeMigratorApi
  • Anthropic-провайдер AI, MCP-интеграция
  • Stytch auth, PostHog/Sentry, broker-iframes

✗ Не подтверждено / дыры

  • WASM на клиенте не наблюдался — маркетинговое заявление неподтверждено
  • FPS / draw-calls вживую не замерены — терминал за логином
  • Order-Flow Bubbles не измерены в работе
  • Раздельный new WebSocket не найден → стриминг = Connect server-streaming (вероятно, но не на 100% по каждому фиду)
  • Бэкенд (Go/Bazel/gRPC) — со слов компании/прессы; в коде виден только клиентский protobuf-контракт
Метод. Live code/network inspection (Playwright MCP) публичных бандлов + Exa web research, 2026-06-12. Рендер-чанк анализировался статически (терминал login-gated). Всё, что «со слов компании», помечено отдельно.
Часть 1 из 2 · Графики, движки, бизнес-модель
Источник: ~/research/takeprofit-charts · teardown 2026-06
Часть 2 · Маркетплейсы, языки, стратегии →

Образовательный teardown по публично доступным данным. Все товарные знаки принадлежат их владельцам. Indie® — TakeProfit. Цифры со слов компаний помечены в тексте.