Documentation / @finchart/core / index / applyColor
Function: applyColor()
applyColor(
context,channel,color,verdicts?):void
Defined in: packages/core/src/render/canvas-renderer.ts:577
Checks whether an assignment actually took.
ctx.fillStyle = "nope" doesn't throw — it's ignored, and the previous command's color stays in place, so a single typo gets drawn in a neighbor's color. It's not just typos — currentColor, light-dark(...), and an undefined var(--brand) all pass straight through getComputedStyle and arrive here too.
It judges by reading back — setting transparent first and then assigning means "it didn't change" is exactly "it was rejected." Since the browser normalizes colors (#fff → rgb(...)), this checks "did it change," not string equality.
But that read-back itself was expensive — reading a canvas channel makes the browser serialize the current color as a CSS string, and doing that twice per command runs the serialization 34,000 times in a frame with 17,000 commands.
| hover frame | total | commit |
|---|---|---|
| before read-back | 3.70ms | 2.42ms |
| after adding read-back | 9.70ms | 8.22ms |
| bypassing read-back only | 4.00ms | 2.66ms |
So the verdict gets cached — a canvas's color parsing is purely a function of the string, so once per value is enough. Without a cache, it's the old path unchanged (slow, but correct).
Parameters
context
channel
"fillStyle" | "strokeStyle"
color
string | CanvasGradientLike | CanvasPatternLike
verdicts?
Returns
void