JsPDF Compression generates blur PDF

Question

I'm using PDFJs to annotate pdf using fabric js and to save the result canvas images to pdf using JsPDF.

This is how I'm saving it:

 canvas.height = viewport.height;
    canvas.width = viewport.width;
    var width = canvas.width;
    var height = canvas.height;
    var pdf = new jsPDF('p', 'pt', [width, height]);
    $.each(inst.fabricObjects, function (index, fabricObj) {
        if (index != 0) {
            pdf.addPage();
            pdf.setPage(index + 1);
        }
        var imgData = fabricObj.toDataURL({
            format: 'jpg',
            quality: 0.9
        });
        pdf.addImage(imgData, 'jpg', 0, 0, width, height, null, 'FAST');
        //pdf.addImage(imgData, 'JPEG', 0, 0, canvas.width, canvas.height);
    });
 pdf.save("sample.pdf");

This results increase of PDF size from 3.12MB to 11.2MB and it looks blurred.

This code which I'm using earlier was saving the PDF with huge size

 var pdf = new jsPDF();
 $.each(inst.fabricObjects, function (index, fabricObj) {
     if (index != 0) {
        pdf.addPage();
        pdf.setPage(index + 1);
      }
   pdf.addImage(fabricObj.toDataURL(), 'JPG', 0, 0, canvas.width, canvas.height);
 });

Original File Size: 3.12MB

Saved PDF File Size : 213MB