toDataURL이 왜 느린가요?

네트워크를 통해 간단한 이미지를 전송하면 빠릅니다. toDataURL을 사용하여 캔버스에서 생성 된 동일한 이미지를 전송하려고하면 속도가 훨씬 느려집니다. 왜?toDataURL이 왜 느린가요?

출처

2013-12-13 good_evening

충분하지 않은 정보 :이 경우

, JPEG이 방법을 지정합니다. – akonsu

최적화? 생성 된 이미지와 비교할 때 일반 이미지의 무게는 얼마입니까? – Boaz

는'transfer'를 정의합니다 – charlietfl

당신은 일반적으로 너무 많은 컨텍스트를 수 있도록 제공되지 않습니다

브라우저는 작은 헤더와 자료-64 스트림으로 이미지를 인코딩합니다 toDataURL()를 사용하는 경우. Base-64는 인코딩되지 않은 크기에 비해 크기를 항상 33 % 늘립니다.

기본적으로 JPEG 인코딩 파일을 전송하는 경우 일반적으로 이미지의 PNG 버전보다 크기가 작습니다. toDataURL의 이미지 유형을 지정하는 것을 잊어 버리면 브라우저는 항상 PNG로 기본 설정됩니다.

var quality = 0.7; 
var dataUri = canvas.toDataURL('image/jpeg', quality);

출처

2013-12-13 13:58:51 K3N

질문을 따르십시오. 성능 측면에서 localstorage라고 할 수있게 dataUri를 저장하는 데 단점이 있습니까? – JohnAndrews

@JohnAndrews는 성능을 위해 (오버 헤드는 여전히있을 수 있지만) localSotrage는 문자열 만 취하므로 data-uri가 필요합니다. 그러나 스토리지 공간 *은 쉽게 문제가 될 것입니다. IndexedDB는이 IMHO를위한 더 나은 선택이며 Blob을 저장할 수 있습니다. – K3N

아아, 그게 입력 된 이미지로 기본 설정 될 것이라고 생각했고, jpeg로 변경하면 빠른 방식으로 제작되었습니다. 'canvas.toBlob'를 구현하는 Chrome을 기대하면서 더 빠르고 비 블로킹 할 수 있습니다. –

toDataURL이 왜 느린가요?

답변

관련 문제