TEST1. click:img.src=canvas.toDataURL() : :2540:100%
TEST2. click:canvas.drawImage(canvas) : :20240:797%
TEST3. click:canvas.drawImage(image) : :64937:2557%
TEST4. click:canvas.putImageData(canvas.getImageData()) : :4072:160%
TEST4_1. click:canvas.putImageData(imageData) : :8691:342%
TEST5. click:canvas.clear() : :127550:5022%
주의 : 수정된 canvas를 사용하였음.
테스트 할 때 마다 숫자가 요동침...
크롬 버전 42.0.2311.135 에서 테스트
결론
canvas.clear() > canvas.drawImage(image) > canvas.drawImage(canvas) >canvas.putImageData(imageData) >canvas.putImageData(canvas.getImageData()) > img.src=canvas.toDataURL()
img.src=canvas.toDataURL()은 될 수 있으면 쓰지 말라. 하지만 image를 붙여넣기위한 이미지를 만든다면 무시.(1회동작이니깐)
canvas.putImageData(canvas.getImageData())는 비트 단위 정확한 이동 등에만 사용하라, 그게 아니면 canvas.drawImage(canvas) 쪽이 더 빠르다.
canvas.drawImage(canvas) 는 생각보다 느리지만, reisze등을 생각한다면 어쩔 수 없다.(리사이즈로 처리되면 더욱더 느려진다.)
getImageData()와 putImageData()의 속도는 거의 같은 듯(getImageData를 한 번만 하면 속도가 약 2배 정도 나온다.)