Performance issue while trying to use gradient for realtime plot - ios

Question

I need to build a realtime plot sin(x)
So I update it 25 times per second. I try to use gradient for the plot line to make it transparent in the end:
Everything looks good - but the performance is critically low.. When I not creating gradient - everything works good.
The needed plot looks like this:
Is it possible to improve my code to solve the performance issue?
CGContextSaveGState(context);
CGFloat value;
UIBezierPath *graph = [UIBezierPath new];
for (NSUInteger counter = 0; counter < historyArray.count; counter++) {
value = [historyArray[counter] floatValue];
if (counter == 0) {
[graph moveToPoint:CGPointMake((CGFloat) (bounds.origin.x + bounds.size.width * 0.75 / 40), (CGFloat) (bounds.origin.y + bounds.size.height / 2 - value * bounds.size.height / 2.1))];
} else {
[graph addLineToPoint:CGPointMake((CGFloat) (bounds.origin.x + (float) counter / (float) (40 - 1) * bounds.size.width * 0.75), (CGFloat) (bounds.origin.y + bounds.size.height / 2 - value * bounds.size.height / 2.1))];
}
}
if (historyArray.count > 0) {
CGFloat colors[] = {
0.0, 1.0, 1.0, 0.0,
0.0, 1.0, 1.0, 1.0,
0.0, 1.0, 1.0, 1.0
};
CGColorSpaceRef baseSpace = CGColorSpaceCreateDeviceRGB();
CGGradientRef gradient = CGGradientCreateWithColorComponents(baseSpace, colors, NULL, 3);
CGColorSpaceRelease(baseSpace), baseSpace = NULL;
CGContextSetLineWidth(context, 2.f);
CGContextSetLineJoin(context, kCGLineJoinRound);
CGContextSetLineCap(context, kCGLineCapRound);
CGContextAddPath(context, graph.CGPath);
CGContextReplacePathWithStrokedPath(context);
CGContextClip(context);
// Define the start and end points for the gradient
// This determines the direction in which the gradient is drawn
CGPoint startPoint = bounds.origin;
CGPoint endPoint = CGPointMake(bounds.origin.x + bounds.size.width, bounds.origin.y);
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
CGGradientRelease(gradient), gradient = NULL;
CGContextRestoreGState(context);
}

Answer 1

Creating the gradient isn't likely to be the performance problem. It's more likely clipping it to a complex path. It's not totally clear from your code how many line segments your path has, but I suspect it's in the hundreds, right?
As for more-performant ways to do this:
Reduce the number of points in the path - if you're plotting points every X pixels horizontally, then you're plotting more than you need when the curve isn't changing much (near the peaks and troughs).
Do away with the gradient altogether, and just draw your path with multiple differently-colored line segments. This might actually end up looking better, anyway, since you can adjust the transparency by distance traveled, rather than by horizontal coordinate.
If you really do want the horizontal gradient, try applying it to subsets of the path, which might be faster than doing it all at once.