Use an OffscreenCanvas where applicable.

blueimp · blueimp · commit 4d8377763069 · 2020-04-29T01:09:06.000+09:00
Resolves blueimp#104
diff --git a/js/load-image-orientation.js b/js/load-image-orientation.js
@@ -84,7 +84,7 @@ Exif orientation values to correctly display the letter F:
       // Check if the browser supports automatic image orientation:
       $.orientation = img.width === 2 && img.height === 3
       if ($.orientation) {
-        var canvas = $.createCanvas(1, 1)
+        var canvas = $.createCanvas(1, 1, true)
         var ctx = canvas.getContext('2d')
         ctx.drawImage(img, 1, 1, 1, 1, 0, 0, 1, 1)
         // Check if the source image coordinates (sX, sY, sWidth, sHeight) are
diff --git a/js/load-image-scale.js b/js/load-image-scale.js
@@ -27,7 +27,10 @@
 
   var originalTransform = loadImage.transform
 
-  loadImage.createCanvas = function (width, height) {
+  loadImage.createCanvas = function (width, height, offscreen) {
+    if (offscreen && window.OffscreenCanvas) {
+      return new OffscreenCanvas(width, height)
+    }
     var canvas = document.createElement('canvas')
     canvas.width = width
     canvas.height = height
@@ -247,7 +250,7 @@
         // Write the complete source image to an intermediate canvas first:
         tmp = img
         // eslint-disable-next-line no-param-reassign
-        img = loadImage.createCanvas(width, height)
+        img = loadImage.createCanvas(width, height, true)
         loadImage.drawImage(
           tmp,
           img,
@@ -270,7 +273,8 @@
         while (sourceWidth * downsamplingRatio > destWidth) {
           canvas = loadImage.createCanvas(
             sourceWidth * downsamplingRatio,
-            sourceHeight * downsamplingRatio
+            sourceHeight * downsamplingRatio,
+            true
           )
           loadImage.drawImage(
             img,
