이미지가 하나만 다운로드됩니다

지난 질문에서 캔버스를 이용하는 건 좋은 방법이 아니라는 답을 얻었고. 그리하여 이미지를 Blob화 시킨 뒤, 해당 Blob 객체를 합쳐 다운로드 한다는 생각을 하게 되었습니다. 그러나 실제로 다음과 같이 코드를 작성후 실행했을 때, imgs[0]의 이미지만 다운로드됩니다. 이미지 전부를 합쳐 다운받으려면 어떻게 해야합니까? 그런데, 더 어려운 점은 final size는 정상적으로 모든 blob의 사이즈를 합친 것 만큼 나오나, 다운로드된 이미지의 용량은 final size에 한참 못미칩니다.

try {
        console.log(`length : ${imgs.length}`);
        let a = document.createElement("a");
        let b = new Blob(imgs, { type: "image/png" });
        console.log(`final size : ${b.size}`);
        console.log(`final type : ${b.type}`);
        a.href = URL.createObjectURL(b);
        a.download = `0.png`;
        a.click();
        URL.revokeObjectURL(a.href);
    } catch (error) {
        console.error(error);
    }