移除两个依赖

packages/artplayer/package.json

@@ -27,8 +27,6 @@
     "balloon-css": "^0.5.0",
     "draggabilly": "^2.2.0",
     "option-validator": "^1.1.1",
-    "resize-observer": "^1.0.0",
-    "screenfull": "^4.2.0",
-    "tiny-emitter": "^2.1.0"
+    "screenfull": "^4.2.0"
   }
 }

packages/artplayer/src/emitter.js

@@ -0,0 +1,42 @@
+export default class Emitter {
+    on(name, fn, ctx) {
+        const e = this.e || (this.e = {});
+        (e[name] || (e[name] = [])).push({ fn, ctx });
+        return this;
+    }
+
+    once(name, fn, ctx) {
+        const self = this;
+        function listener(...args) {
+            self.off(name, listener);
+            fn.apply(ctx, args);
+        }
+        listener._ = fn;
+        return this.on(name, listener, ctx);
+    }
+
+    emit(name, ...data) {
+        const evtArr = ((this.e || (this.e = {}))[name] || []).slice();
+        for (let i = 0; i < evtArr.length; i += 1) {
+            evtArr[i].fn.apply(evtArr[i].ctx, data);
+        }
+        return this;
+    }
+
+    off(name, callback) {
+        const e = this.e || (this.e = {});
+        const evts = e[name];
+        const liveEvents = [];
+        if (evts && callback) {
+            for (let i = 0, len = evts.length; i < len; i += 1) {
+                if (evts[i].fn !== callback && evts[i].fn._ !== callback) liveEvents.push(evts[i]);
+            }
+        }
+        if (liveEvents.length) {
+            e[name] = liveEvents;
+        } else {
+            delete e[name];
+        }
+        return this;
+    }
+}

packages/artplayer/src/events/resizeInit.js

@@ -1,24 +1,41 @@
-import { ResizeObserver } from 'resize-observer';
+import { throttle } from '../utils';
 
 export default function resizeInit(art, events) {
     const {
         option,
+        player,
         template: { $player },
     } = art;
-    
-    const resizeObserver = new ResizeObserver(() => {
-        if (option.autoSize) {
-            if (!art.player.fullscreen && !art.player.fullscreenWeb && !art.player.pip) {
-                art.player.autoSize = true;
-            } else {
-                art.player.autoSize = false;
+
+    const object = document.createElement('object');
+    object.setAttribute('aria-hidden', 'true');
+    object.setAttribute('tabindex', -1);
+    object.type = 'text/html';
+    object.data = 'about:blank';
+    let playerWidth = player.width;
+    let playerHeight = player.height;
+    const resizeFn = throttle(() => {
+        if (player.width !== playerWidth || player.height !== playerHeight) {
+            playerWidth = player.width;
+            playerHeight = player.height;
+            if (option.autoSize) {
+                if (!art.player.fullscreen && !art.player.fullscreenWeb && !art.player.pip) {
+                    art.player.autoSize = true;
+                } else {
+                    art.player.autoSize = false;
+                }
             }
+            art.player.aspectRatioReset = true;
+            art.emit('resize', {
+                width: player.width,
+                height: player.height,
+            });
         }
-        art.player.aspectRatioReset = true;
-        art.emit('resize', $player);
-    });
-    resizeObserver.observe($player);
-    events.destroyEvents.push(() => {
-        resizeObserver.unobserve($player);
+    }, 500);
+
+    events.proxy(object, 'load', () => {
+        events.proxy(object.contentDocument.defaultView, 'resize', resizeFn);
     });
+
+    $player.appendChild(object);
 }

packages/artplayer/src/index.js

@@ -1,8 +1,8 @@
 import './style';
 import 'balloon-css/balloon.min.css';
-import Emitter from 'tiny-emitter';
 import Draggabilly from 'draggabilly';
 import validator from 'option-validator';
+import Emitter from './emitter';
 import * as utils from './utils';
 import scheme from './scheme';
 import config from './config';

packages/artplayer/src/style/artplayer.scss

@@ -33,4 +33,16 @@
             fill: #fff;
         }
     }
+
+    & >>> object {
+        display: block;
+        position: absolute;
+        top: 0;
+        left: 0;
+        height: 100%;
+        width: 100%;
+        overflow: hidden;
+        pointer-events: none;
+        z-index: -1;
+    }
 }

packages/artplayer/src/utils/index.js

@@ -61,6 +61,31 @@ export function debounce(func, wait, context) {
     return fn;
 }
 
+export function throttle(callback, delay) {
+    let isThrottled = false;
+    let args;
+    let context;
+    function fn(...args2) {
+        if (isThrottled) {
+            args = args2;
+            context = this;
+            return;
+        }
+
+        isThrottled = true;
+        callback.apply(this, args2);
+        setTimeout(() => {
+            isThrottled = false;
+            if (args) {
+                fn.apply(context, args);
+                args = null;
+                context = null;
+            }
+        }, delay);
+    }
+    return fn;
+}
+
 export function mergeDeep(...objects) {
     const isObject = item => item && typeof item === 'object' && !Array.isArray(item);
     return objects.reduce((prev, obj) => {