Disable using Transferables in Safari

src/data/feature_position_map.js

@@ -63,7 +63,9 @@ export default class FeaturePositionMap {
 
         sort(ids, positions, 0, ids.length - 1);
 
-        transferables.push(ids.buffer, positions.buffer);
+        if (transferables) {
+            transferables.push(ids.buffer, positions.buffer);
+        }
 
         return {ids, positions};
     }

src/util/actor.js

@@ -1,6 +1,7 @@
 // @flow
 
-import {bindAll, isWorker} from './util';
+import {bindAll, isWorker, isSafari} from './util';
+import window from './window';
 import {serialize, deserialize} from './web_worker_transfer';
 import ThrottledInvoker from './throttled_invoker';
 
@@ -28,6 +29,7 @@ class Actor {
     taskQueue: Array<number>;
     cancelCallbacks: { number: Cancelable };
     invoker: ThrottledInvoker;
+    globalScope: any;
 
     constructor(target: any, parent: any, mapId: ?number) {
         this.target = target;
@@ -40,6 +42,7 @@ class Actor {
         bindAll(['receive', 'process'], this);
         this.invoker = new ThrottledInvoker(this.process);
         this.target.addEventListener('message', this.receive, false);
+        this.globalScope = isWorker() ? target : window;
     }
 
     /**
@@ -59,7 +62,7 @@ class Actor {
         if (callback) {
             this.callbacks[id] = callback;
         }
-        const buffers: Array<Transferable> = [];
+        const buffers: ?Array<Transferable> = isSafari(this.globalScope) ? undefined : [];
         this.target.postMessage({
             id,
             type,
@@ -158,10 +161,10 @@ class Actor {
             }
         } else {
             let completed = false;
+            const buffers: ?Array<Transferable> = isSafari(this.globalScope) ? undefined : [];
             const done = task.hasCallback ? (err, data) => {
                 completed = true;
                 delete this.cancelCallbacks[id];
-                const buffers: Array<Transferable> = [];
                 this.target.postMessage({
                     id,
                     type: '<response>',

src/util/util.js

@@ -449,6 +449,28 @@ export function parseCacheControl(cacheControl: string): Object {
     return header;
 }
 
+let _isSafari = null;
+
+/**
+ * Retuns true when run in WebKit derived browsers.
+ * This is used as a workaround for a memory leak in Safari caused by using Transferable objects to
+ * transfer data between WebWorker's and the main thread.
+ * https://github.com/mapbox/mapbox-gl-js/issues/8771
+ *
+ * This should be removed once the underlying Safari issue is fixed.
+ *
+ * @private
+ * @returns {boolean}
+ */
+export function isSafari(scope: any): boolean {
+    if (_isSafari == null) {
+        const userAgent = scope.navigator ? scope.navigator.userAgent : null;
+        _isSafari = !!scope.safari ||
+        !!(userAgent && (/\b(iPad|iPhone|iPod)\b/.test(userAgent) || (!!userAgent.match('Safari') && !userAgent.match('Chrome'))));
+    }
+    return _isSafari;
+}
+
 export function storageAvailable(type: string): boolean {
     try {
         const storage = window[type];

src/util/web_worker_transfer.js

@@ -119,7 +119,7 @@ function isArrayBuffer(val: any): boolean {
  *
  * @private
  */
-export function serialize(input: mixed, transferables?: Array<Transferable>): Serialized {
+export function serialize(input: mixed, transferables: ?Array<Transferable>): Serialized {
     if (input === null ||
         input === undefined ||
         typeof input === 'boolean' ||