Улучшить резкость линий при рендеринге в Canvas на компьютере с Windows/Linux (соотношение пикселей устройства <2)?

Я пытаюсь нарисовать структуру, подобную сетке, с помощью HTML Canvas(2d Context), но четкость линий моей сетки нечеткая, толстая и плохая при сравнении моей Canvas Grid и Div Grid. Пожалуйста помоги.

context.strokeWidth = 1;
context.lineWidth   = 1;

function scaleCanvas(canvas, width, height) {
        var ratio           = Math.ceil(Math.max(window.devicePixelRatio, 1));
        var context         = canvas.getContext('2d'); 
        canvas.width        = width * ratio;
        canvas.height       = height * ratio;
        canvas.style.width  = width + 'px';
        canvas.style.height = height + 'px';
        context.scale(ratio, ratio);
    }