How to do border smoothing in canvas?

Question

JavaScript

Hello!
Help, please, to solve the problem of anti-aliasing in canvas.
There is a circle with a gradient border:

context.arc(width / 2 + lineWidth / 2, width / 2 + lineWidth / 2, width / 2, 1.5 * Math.PI, radian + 1.5 * Math.PI, false);
      var gradient = context.createLinearGradient(0, 0, 50, 100);
      gradient.addColorStop(0, '#ff7801');
      gradient.addColorStop(0.5, '#54149d');
      gradient.addColorStop(1, '#54149d');
     context.strokeStyle = gradient;
     context.lineCap = 'round';
     context.lineWidth = 5;

The fact is that the edges of the frame are pixelated and fuzzy.
How to smooth them so that the edges are smooth?