@363045841yyt/klinechart-core 0.9.0-alpha.0 → 0.9.0-alpha.2

package/src/engine/renderers/Indicator/tema.ts

@@ -11,6 +11,7 @@ import type { IndicatorScheduler, TEMASchedulerConfig } from '../../indicators/s
 import type { TEMARenderState } from '../../indicators/state/temaState'
 import { createTEMAStateKey, EMPTY_TEMA_STATE } from '../../indicators/state/temaState'
 import { createSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
+import { tryDrawLinesGpu } from '../linesViaRenderer'
 
 import { createSingleLineTitleInfo } from './shared/titleInfo'
 
@@ -62,7 +63,7 @@ function createTEMARendererPlugin(options: TEMARendererOptions = {}): RendererPl
     },
 
     draw(context: RenderContext) {
-      const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+      const { ctx, pane, range, scrollLeft, kLineCenters } = context
 
       const stateKey = resolveKey()
       if (!stateKey) return
@@ -84,20 +85,7 @@ function createTEMARendererPlugin(options: TEMARendererOptions = {}): RendererPl
 
       if (points.length < 2) return
 
-      const enableWebGL = context.settings?.enableWebGLRendering !== false
-      let usedWebGL = false
-      if (enableWebGL && lineWebGLSurface?.isAvailable()) {
-        const allOk = lineWebGLSurface.drawLineStrips(
-          [{ points, width: 1, color: TEMA_COLOR }],
-          scrollLeft,
-        )
-        if (allOk) {
-          usedWebGL = true
-          lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
-        }
-      }
-
-      if (usedWebGL) return
+      if (tryDrawLinesGpu(context, [{ points, width: 1, color: TEMA_COLOR }], scrollLeft)) return
 
       ctx.save()
       ctx.translate(-scrollLeft, 0)

package/src/engine/renderers/Indicator/trix.ts

@@ -15,6 +15,7 @@ import type { TRIXRenderState } from '../../indicators/state/trixState'
 import { createTRIXStateKey } from '../../indicators/state/trixState'
 import { EMPTY_TRIX_STATE } from '../../indicators/state/trixState'
 import { createDualSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
+import { tryDrawLinesGpu } from '../linesViaRenderer'
 
 const TRIX_COLOR = '#e11d48'
 const SIGNAL_COLOR = '#f59e0b'
@@ -64,7 +65,7 @@ function createTRIXRendererPlugin(options: TRIXRendererOptions = {}): RendererPl
     },
 
     draw(context: RenderContext) {
-      const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+      const { ctx, pane, range, scrollLeft, kLineCenters } = context
       const stateKey = resolveKey()
       if (!stateKey) return
       const state = pluginHost?.getSharedState<TRIXRenderState>(stateKey)
@@ -118,17 +119,7 @@ function createTRIXRendererPlugin(options: TRIXRendererOptions = {}): RendererPl
       if (trixPts.length >= 2) lines.push({ points: trixPts, width: 1, color: TRIX_COLOR })
       if (sigPts.length >= 2) lines.push({ points: sigPts, width: 1, color: SIGNAL_COLOR })
 
-      const enableWebGL = context.settings?.enableWebGLRendering !== false
-      let usedWebGL = false
-      if (enableWebGL && lineWebGLSurface?.isAvailable()) {
-        const allOk = lines.length > 0 && lineWebGLSurface.drawLineStrips(lines, scrollLeft)
-        if (allOk) {
-          usedWebGL = true
-          lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
-        }
-      }
-
-      if (usedWebGL) return
+      if (tryDrawLinesGpu(context, lines, scrollLeft)) return
 
       ctx.save()
       ctx.translate(-scrollLeft, 0)

package/src/engine/renderers/Indicator/vma.ts

@@ -12,6 +12,7 @@ import type { VMARenderState } from '../../indicators/state/vmaState'
 import { createVMAStateKey } from '../../indicators/state/vmaState'
 import { EMPTY_VMA_STATE } from '../../indicators/state/vmaState'
 import { createNonNegativeSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
+import { tryDrawLinesGpu } from '../linesViaRenderer'
 
 import { createSingleLineTitleInfo } from './shared/titleInfo'
 
@@ -55,7 +56,7 @@ function createVMARendererPlugin(options: { paneId?: string } = {}): RendererPlu
       return key ? [key] : []
     },
     draw(context: RenderContext) {
-      const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+      const { ctx, pane, range, scrollLeft, kLineCenters } = context
       const stateKey = resolveKey()
       if (!stateKey) return
       const state = pluginHost?.getSharedState<VMARenderState>(stateKey)
@@ -83,20 +84,7 @@ function createVMARendererPlugin(options: { paneId?: string } = {}): RendererPlu
 
       if (points.length < 2) return
 
-      const enableWebGL = context.settings?.enableWebGLRendering !== false
-      let usedWebGL = false
-      if (enableWebGL && lineWebGLSurface?.isAvailable()) {
-        const allOk = lineWebGLSurface.drawLineStrips(
-          [{ points, width: 1, color: VMA_COLOR }],
-          scrollLeft,
-        )
-        if (allOk) {
-          usedWebGL = true
-          lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
-        }
-      }
-
-      if (usedWebGL) return
+      if (tryDrawLinesGpu(context, [{ points, width: 1, color: VMA_COLOR }], scrollLeft)) return
 
       ctx.save()
       ctx.translate(-scrollLeft, 0)

package/src/engine/renderers/Indicator/vwap.ts

@@ -11,6 +11,7 @@ import type { IndicatorScheduler, VWAPSchedulerConfig } from '../../indicators/s
 import type { VWAPRenderState } from '../../indicators/state/vwapState'
 import { createVWAPStateKey, EMPTY_VWAP_STATE } from '../../indicators/state/vwapState'
 import { createSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
+import { tryDrawLinesGpu } from '../linesViaRenderer'
 
 import { createSingleLineTitleInfo } from './shared/titleInfo'
 
@@ -54,7 +55,7 @@ function createVWAPRendererPlugin(options: { paneId?: string } = {}): RendererPl
       return key ? [key] : []
     },
     draw(context: RenderContext) {
-      const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+      const { ctx, pane, range, scrollLeft, kLineCenters } = context
       const stateKey = resolveKey()
       if (!stateKey) return
       const state = pluginHost?.getSharedState<VWAPRenderState>(stateKey)
@@ -81,20 +82,7 @@ function createVWAPRendererPlugin(options: { paneId?: string } = {}): RendererPl
 
       if (points.length < 2) return
 
-      const enableWebGL = context.settings?.enableWebGLRendering !== false
-      let usedWebGL = false
-      if (enableWebGL && lineWebGLSurface?.isAvailable()) {
-        const allOk = lineWebGLSurface.drawLineStrips(
-          [{ points, width: 1, color: VWAP_COLOR }],
-          scrollLeft,
-        )
-        if (allOk) {
-          usedWebGL = true
-          lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
-        }
-      }
-
-      if (usedWebGL) return
+      if (tryDrawLinesGpu(context, [{ points, width: 1, color: VWAP_COLOR }], scrollLeft)) return
 
       ctx.save()
       ctx.translate(-scrollLeft, 0)

package/src/engine/renderers/Indicator/wma.ts

@@ -11,6 +11,7 @@ import type { IndicatorScheduler, WMASchedulerConfig } from '../../indicators/sc
 import type { WMARenderState } from '../../indicators/state/wmaState'
 import { createWMAStateKey, EMPTY_WMA_STATE } from '../../indicators/state/wmaState'
 import { createSparseVisibleStateComposer } from '../../indicators/visibleStateComposers'
+import { tryDrawLinesGpu } from '../linesViaRenderer'
 
 import { createSingleLineTitleInfo } from './shared/titleInfo'
 
@@ -62,7 +63,7 @@ function createWMARendererPlugin(options: WMARendererOptions = {}): RendererPlug
     },
 
     draw(context: RenderContext) {
-      const { ctx, pane, range, scrollLeft, kLineCenters, lineWebGLSurface } = context
+      const { ctx, pane, range, scrollLeft, kLineCenters } = context
 
       const stateKey = resolveKey()
       if (!stateKey) return
@@ -84,20 +85,7 @@ function createWMARendererPlugin(options: WMARendererOptions = {}): RendererPlug
 
       if (points.length < 2) return
 
-      const enableWebGL = context.settings?.enableWebGLRendering !== false
-      let usedWebGL = false
-      if (enableWebGL && lineWebGLSurface?.isAvailable()) {
-        const allOk = lineWebGLSurface.drawLineStrips(
-          [{ points, width: 1, color: WMA_COLOR }],
-          scrollLeft,
-        )
-        if (allOk) {
-          usedWebGL = true
-          lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
-        }
-      }
-
-      if (usedWebGL) return
+      if (tryDrawLinesGpu(context, [{ points, width: 1, color: WMA_COLOR }], scrollLeft)) return
 
       ctx.save()
       ctx.translate(-scrollLeft, 0)

package/src/engine/renderers/Indicator/wmsr.ts

@@ -16,6 +16,7 @@ import { createFixedRangeSparseVisibleStateComposer } from '../../indicators/vis
 
 import { createWmsrScaleRendererPlugin } from './scale/wmsr_scale'
 import { createSingleLineTitleInfo } from './shared/titleInfo'
+import { tryDrawLinesGpu } from '../linesViaRenderer'
 
 type LinePoint = { x: number; y: number }
 
@@ -180,7 +181,7 @@ function createWMSRRendererPlugin(options: WMSRRendererOptions = {}): RendererPl
     },
 
     draw(context: RenderContext) {
-      const { ctx, pane, range, scrollLeft, dpr, kLineCenters, lineWebGLSurface } = context
+      const { ctx, pane, range, scrollLeft, dpr, kLineCenters } = context
       const colors = resolveThemeColors(
         context.theme,
         context.isAsiaMarket,
@@ -258,22 +259,11 @@ function createWMSRRendererPlugin(options: WMSRRendererOptions = {}): RendererPl
       }
 
       // 绘制 WMSR 线（WebGL 优先，Canvas2D 回退）
-      const enableWebGL = context.settings?.enableWebGLRendering !== false
-      let usedWebGL = false
-      if (enableWebGL && lineWebGLSurface?.isAvailable()) {
-        if (params.showWMSR && cachedWMSRPoints.length >= 2) {
-          const ok = lineWebGLSurface.drawLineStrips(
-            [{ points: cachedWMSRPoints, width: 1, color: colors.wmsr.wmsr }],
-            scrollLeft,
-          )
-          if (ok) {
-            usedWebGL = true
-            lineWebGLSurface.compositeTo(ctx, { imageSmoothingEnabled: false })
-          }
-        }
-      }
-
-      if (!usedWebGL) {
+      const wmsrLines =
+        params.showWMSR && cachedWMSRPoints.length >= 2
+          ? [{ points: cachedWMSRPoints, width: 1, color: colors.wmsr.wmsr }]
+          : []
+      if (!tryDrawLinesGpu(context, wmsrLines, scrollLeft)) {
         drawWMSRLineWithCanvas2D(ctx, scrollLeft, cachedWMSRPoints, params, colors)
       }
     },

package/src/engine/renderers/__tests__/candle.sceneRenderer.test.ts

@@ -0,0 +1,208 @@
+import { describe, it, expect, vi } from 'vitest'
+
+import type { RenderContext } from '../../../foundation/plugin/index'
+import type { Renderer } from '../../../rendering/render/Renderer'
+import { createCandleRenderer } from '../candle'
+
+function makePane() {
+  return {
+    id: 'main',
+    top: 0,
+    height: 400,
+    role: 'price' as const,
+    capabilities: {},
+    yAxis: {
+      getDisplayRange: () => ({ maxPrice: 110, minPrice: 90 }),
+      getPaddingTop: () => 10,
+      getPaddingBottom: () => 10,
+      getScaleType: () => 'linear' as const,
+      priceToY: (p: number) => 200 - (p - 100),
+    },
+    priceRange: { min: 90, max: 110 },
+  }
+}
+
+function makeSceneRenderer() {
+  const compositeTo = vi.fn()
+  const drawInstances = vi.fn(() => true)
+  const writeBuffer = vi.fn()
+  const r: Renderer = {
+    surface: {
+      isAvailable: () => true,
+      resize: () => {},
+      bindRegion: () => true,
+      clearRegion: () => {},
+      compositeTo,
+      dispose: () => {},
+    },
+    caps: { compute: false, storageBuffer: false, maxInstances: 1e6, name: 'webgl2' },
+    createBuffer: vi.fn(() => ({}) as never),
+    writeBuffer,
+    destroyBuffer: vi.fn(),
+    createPipeline: vi.fn(() => ({}) as never),
+    destroyPipeline: vi.fn(),
+    createComputePipeline: () => {
+      throw new Error('no')
+    },
+    destroyComputePipeline: () => {},
+    beginFrame: vi.fn(),
+    drawInstances,
+    drawLines: vi.fn(),
+    dispatchCompute: () => {},
+    endFrame: vi.fn(),
+    dispose: vi.fn(),
+  }
+  return { r, drawInstances, writeBuffer, compositeTo }
+}
+
+describe('candle sceneRenderer path', () => {
+  it('draws via sceneRenderer.drawInstances and composites on webgl', () => {
+    const { r, drawInstances, compositeTo } = makeSceneRenderer()
+
+    const data = Array.from({ length: 5 }, (_, i) => ({
+      timestamp: i,
+      open: 100,
+      high: 105,
+      low: 95,
+      close: 102,
+      volume: 1000,
+    }))
+
+    const ctx = {
+      ctx: {
+        save: vi.fn(),
+        restore: vi.fn(),
+        translate: vi.fn(),
+        fillRect: vi.fn(),
+        beginPath: vi.fn(),
+        moveTo: vi.fn(),
+        lineTo: vi.fn(),
+        closePath: vi.fn(),
+        fill: vi.fn(),
+      } as unknown as CanvasRenderingContext2D,
+      pane: makePane(),
+      data,
+      period: 'daily',
+      range: { start: 0, end: 5 },
+      scrollLeft: 0,
+      kWidth: 8,
+      kGap: 2,
+      dpr: 1,
+      paneWidth: 800,
+      kLinePositions: [0, 10, 20, 30, 40],
+      kLineCenters: [4, 14, 24, 34, 44],
+      kBarRects: [],
+      theme: 'dark' as const,
+      viewport: { scrollLeft: 0, plotWidth: 800, plotHeight: 400 },
+      settings: { rendererBackend: 'webgl', showVolumePriceMarkers: false },
+      sceneRenderer: r,
+      zoomLevel: 1,
+    } as unknown as RenderContext
+
+    createCandleRenderer().draw(ctx)
+
+    expect(drawInstances).toHaveBeenCalled()
+    expect(compositeTo).toHaveBeenCalledOnce()
+  })
+
+  it('skips compositeTo when sceneRenderer is webgpu (hybrid DOM)', () => {
+    const { r, drawInstances, compositeTo } = makeSceneRenderer()
+    r.caps = { ...r.caps, name: 'webgpu' }
+
+    const data = Array.from({ length: 3 }, (_, i) => ({
+      timestamp: i,
+      open: 100,
+      high: 105,
+      low: 95,
+      close: 102,
+      volume: 1000,
+    }))
+
+    const ctx = {
+      ctx: {
+        save: vi.fn(),
+        restore: vi.fn(),
+        translate: vi.fn(),
+        fillRect: vi.fn(),
+        beginPath: vi.fn(),
+        moveTo: vi.fn(),
+        lineTo: vi.fn(),
+        closePath: vi.fn(),
+        fill: vi.fn(),
+      } as unknown as CanvasRenderingContext2D,
+      pane: makePane(),
+      data,
+      period: 'daily',
+      range: { start: 0, end: 3 },
+      scrollLeft: 0,
+      kWidth: 8,
+      kGap: 2,
+      dpr: 1,
+      paneWidth: 800,
+      kLinePositions: [0, 10, 20],
+      kLineCenters: [4, 14, 24],
+      kBarRects: [],
+      theme: 'dark' as const,
+      viewport: { scrollLeft: 0, plotWidth: 800, plotHeight: 400 },
+      settings: { rendererBackend: 'webgpu', showVolumePriceMarkers: false },
+      sceneRenderer: r,
+      zoomLevel: 1,
+    } as unknown as RenderContext
+
+    createCandleRenderer().draw(ctx)
+
+    expect(drawInstances).toHaveBeenCalled()
+    expect(compositeTo).not.toHaveBeenCalled()
+  })
+
+  it('falls to Canvas2D when drawInstances returns false (fail-closed)', () => {
+    const { r, drawInstances, compositeTo } = makeSceneRenderer()
+    drawInstances.mockReturnValue(false)
+    const fillRect = vi.fn()
+
+    const data = Array.from({ length: 3 }, (_, i) => ({
+      timestamp: i,
+      open: 100,
+      high: 105,
+      low: 95,
+      close: 102,
+      volume: 1000,
+    }))
+
+    const ctx = {
+      ctx: {
+        save: vi.fn(),
+        restore: vi.fn(),
+        translate: vi.fn(),
+        fillRect,
+        beginPath: vi.fn(),
+        moveTo: vi.fn(),
+        lineTo: vi.fn(),
+        closePath: vi.fn(),
+        fill: vi.fn(),
+      } as unknown as CanvasRenderingContext2D,
+      pane: makePane(),
+      data,
+      period: 'daily',
+      range: { start: 0, end: 3 },
+      scrollLeft: 0,
+      kWidth: 8,
+      kGap: 2,
+      dpr: 1,
+      paneWidth: 800,
+      kLinePositions: [0, 10, 20],
+      kLineCenters: [4, 14, 24],
+      kBarRects: [],
+      theme: 'dark' as const,
+      viewport: { scrollLeft: 0, plotWidth: 800, plotHeight: 400 },
+      settings: { rendererBackend: 'webgl', showVolumePriceMarkers: false },
+      sceneRenderer: r,
+      zoomLevel: 1,
+    } as unknown as RenderContext
+
+    createCandleRenderer().draw(ctx)
+
+    expect(compositeTo).not.toHaveBeenCalled()
+    expect(fillRect).toHaveBeenCalled()
+  })
+})

package/src/engine/renderers/__tests__/candleViaRenderer.test.ts

@@ -0,0 +1,100 @@
+import { describe, it, expect, vi } from 'vitest'
+
+import type { Renderer } from '../../../rendering/render/Renderer'
+import { drawCandlesViaRenderer } from '../candleViaRenderer'
+
+function mockRenderer(): Renderer & {
+  writeBuffer: ReturnType<typeof vi.fn>
+  drawInstances: ReturnType<typeof vi.fn>
+  createBuffer: ReturnType<typeof vi.fn>
+  createPipeline: ReturnType<typeof vi.fn>
+  destroyBuffer: ReturnType<typeof vi.fn>
+  destroyPipeline: ReturnType<typeof vi.fn>
+} {
+  return {
+    surface: {
+      isAvailable: () => true,
+      resize: () => {},
+      bindRegion: () => true,
+      clearRegion: () => {},
+      compositeTo: vi.fn(),
+      dispose: () => {},
+    },
+    caps: { compute: false, storageBuffer: false, maxInstances: 1_000_000, name: 'webgl2' },
+    createBuffer: vi.fn(() => ({}) as never),
+    writeBuffer: vi.fn(),
+    destroyBuffer: vi.fn(),
+    createPipeline: vi.fn(() => ({}) as never),
+    destroyPipeline: vi.fn(),
+    createComputePipeline: () => {
+      throw new Error('no')
+    },
+    destroyComputePipeline: () => {},
+    beginFrame: vi.fn(),
+    drawInstances: vi.fn(),
+    drawLines: vi.fn(),
+    dispatchCompute: () => {},
+    endFrame: vi.fn(),
+    dispose: vi.fn(),
+  } as never
+}
+
+describe('drawCandlesViaRenderer', () => {
+  const nonEmpty = {
+    upBodyCount: 1,
+    downBodyCount: 1,
+    upWickCount: 1,
+    downWickCount: 1,
+    upBodyBuf: new Float32Array([0, 0, 10, 20]),
+    downBodyBuf: new Float32Array([20, 0, 10, 20]),
+    upWickBuf: new Float32Array([5, 0, 1, 30]),
+    downWickBuf: new Float32Array([25, 0, 1, 30]),
+  }
+
+  it('issues 4 drawInstances for non-empty up/down body and wick', () => {
+    const r = mockRenderer()
+    r.drawInstances.mockReturnValue(true)
+    const ok = drawCandlesViaRenderer(r, nonEmpty, '#0f0', '#f00', 0)
+    expect(ok).toBe(true)
+    expect(r.drawInstances).toHaveBeenCalledTimes(4)
+    expect(r.writeBuffer).toHaveBeenCalledTimes(4)
+  })
+
+  it('returns true without draw when all counts are zero', () => {
+    const r = mockRenderer()
+    r.drawInstances.mockReturnValue(true)
+    const prepared = {
+      upBodyCount: 0,
+      downBodyCount: 0,
+      upWickCount: 0,
+      downWickCount: 0,
+      upBodyBuf: new Float32Array(0),
+      downBodyBuf: new Float32Array(0),
+      upWickBuf: new Float32Array(0),
+      downWickBuf: new Float32Array(0),
+    }
+    const ok = drawCandlesViaRenderer(r, prepared, '#0f0', '#f00', 0)
+    expect(ok).toBe(true)
+    expect(r.drawInstances).not.toHaveBeenCalled()
+  })
+
+  it('returns false when surface unavailable', () => {
+    const r = mockRenderer()
+    r.surface.isAvailable = () => false
+    expect(drawCandlesViaRenderer(r, nonEmpty, '#0f0', '#f00', 0)).toBe(false)
+  })
+
+  it('returns false when drawInstances silent-fails (fail-closed)', () => {
+    const r = mockRenderer()
+    r.drawInstances.mockReturnValue(false)
+    expect(drawCandlesViaRenderer(r, nonEmpty, '#0f0', '#f00', 0)).toBe(false)
+  })
+
+  it('returns false if any non-empty batch fails', () => {
+    const r = mockRenderer()
+    r.drawInstances
+      .mockReturnValueOnce(true)
+      .mockReturnValueOnce(false)
+    expect(drawCandlesViaRenderer(r, nonEmpty, '#0f0', '#f00', 0)).toBe(false)
+  })
+})