diff --git a/README.md b/README.md
index ac49eb6a5..d3084fdd5 100644
--- a/README.md
+++ b/README.md
@@ -118,7 +118,7 @@ var art = new Artplayer({
 
 ## Proxys
 
--   [Canvas](https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas) (WIP)
+-   [Canvas](https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas)
 -   [WebAV](https://artplayer.org/?libs=./uncompiled/artplayer-proxy-webav/index.js&example=webav) (WIP)
 
 ## Changelog
diff --git a/docs/compiled/artplayer-proxy-canvas.js b/docs/compiled/artplayer-proxy-canvas.js
new file mode 100644
index 000000000..c92ec6e84
--- /dev/null
+++ b/docs/compiled/artplayer-proxy-canvas.js
@@ -0,0 +1,8 @@
+
+/*!
+ * artplayer-proxy-canvas.js v1.0.0
+ * Github: https://github.com/zhw2590582/ArtPlayer
+ * (c) 2017-2024 Harvey Zack
+ * Released under the MIT License.
+ */
+!function(e,t,n,o,r){var i="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof global?global:{},a="function"==typeof i[o]&&i[o],u=a.cache||{},f="undefined"!=typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(t,n){if(!u[t]){if(!e[t]){var r="function"==typeof i[o]&&i[o];if(!n&&r)return r(t,!0);if(a)return a(t,!0);if(f&&"string"==typeof t)return f(t);var d=Error("Cannot find module '"+t+"'");throw d.code="MODULE_NOT_FOUND",d}p.resolve=function(n){var o=e[t][1][n];return null!=o?o:n},p.cache={};var c=u[t]=new l.Module(t);e[t][0].call(c.exports,p,c,c.exports,this)}return u[t].exports;function p(e){var t=p.resolve(e);return!1===t?{}:l(t)}}l.isParcelRequire=!0,l.Module=function(e){this.id=e,this.bundle=l,this.exports={}},l.modules=e,l.cache=u,l.parent=a,l.register=function(t,n){e[t]=[function(e,t){t.exports=n},{}]},Object.defineProperty(l,"root",{get:function(){return i[o]}}),i[o]=l;for(var d=0;d<t.length;d++)l(t[d]);if(n){var c=l(n);"object"==typeof exports&&"undefined"!=typeof module?module.exports=c:"function"==typeof define&&define.amd&&define(function(){return c})}}({"4A0Ge":[function(e,t,n){var o=e("@parcel/transformer-js/src/esmodule-helpers.js");function r(e){return t=>{let{constructor:n}=t,{createElement:o}=n.utils,r=o("canvas"),i=o("video"),a=r.getContext("2d"),u=null,f={};for(let e in r)"function"==typeof r[e]&&(f[e]=r[e].bind(r));for(let e in i)e in r||Object.defineProperty(r,e,{get(){let t=i[e];return"function"==typeof t?t.bind(i):t},set(t){i[e]=t},configurable:!0,enumerable:!0});for(let e in f)r[e]=function(...t){return e in f?f[e](...t):i[e].apply(i,t)};return function(){let{events:e}=n.config;setTimeout(()=>{e.forEach(e=>{t.proxy(i,e,e=>{t.emit(`video:${e.type}`,e)})})})}(),t.on("video:loadedmetadata",()=>{r.width=i.videoWidth,r.height=i.videoHeight}),t.on("video:play",()=>{cancelAnimationFrame(u),d()}),t.on("video:pause",()=>{cancelAnimationFrame(u)}),t.on("resize",()=>{(function(){let e,n;let o=t.template?.$player;if(!o||t.option.autoSize)return;let a=i.videoWidth/i.videoHeight,u=o.clientWidth,f=o.clientHeight;u/f>a?e=(n=f)*a:n=(e=u)/a,r.width=e,r.height=n;let l=(u-e)/2,d=(f-n)/2;Object.assign(r.style,{padding:`${d}px ${l}px`})})(),l()}),t.on("destroy",()=>{cancelAnimationFrame(u)}),r;async function l(){try{if("undefined"!=typeof createImageBitmap){let e=await createImageBitmap(i);a.drawImage(e,0,0,r.width,r.height),e.close()}else a.drawImage(i,0,0,r.width,r.height);e&&e(a,i),t.emit("artplayerProxyCanvas:draw",a,i)}catch(e){t.emit("artplayerProxyCanvas:error",e)}}async function d(){await l(),u=requestAnimationFrame(d)}}}o.defineInteropFlag(n),o.export(n,"default",()=>r),"undefined"!=typeof window&&(window.artplayerProxyCanvas=r)},{"@parcel/transformer-js/src/esmodule-helpers.js":"hqP7A"}],hqP7A:[function(e,t,n){n.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},n.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.exportAll=function(e,t){return Object.keys(e).forEach(function(n){"default"===n||"__esModule"===n||Object.prototype.hasOwnProperty.call(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:function(){return e[n]}})}),t},n.export=function(e,t,n){Object.defineProperty(e,t,{enumerable:!0,get:n})}},{}]},["4A0Ge"],"4A0Ge","parcelRequire94c2");
\ No newline at end of file
diff --git a/docs/compiled/artplayer-proxy-canvas.legacy.js b/docs/compiled/artplayer-proxy-canvas.legacy.js
new file mode 100644
index 000000000..8729c73cb
--- /dev/null
+++ b/docs/compiled/artplayer-proxy-canvas.legacy.js
@@ -0,0 +1,8 @@
+
+/*!
+ * artplayer-proxy-canvas.js v1.0.0
+ * Github: https://github.com/zhw2590582/ArtPlayer
+ * (c) 2017-2024 Harvey Zack
+ * Released under the MIT License.
+ */
+!function(e,r,t,n,o){var a="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof global?global:{},i="function"==typeof a[n]&&a[n],u=i.cache||{},c="undefined"!=typeof module&&"function"==typeof module.require&&module.require.bind(module);function s(r,t){if(!u[r]){if(!e[r]){var o="function"==typeof a[n]&&a[n];if(!t&&o)return o(r,!0);if(i)return i(r,!0);if(c&&"string"==typeof r)return c(r);var f=Error("Cannot find module '"+r+"'");throw f.code="MODULE_NOT_FOUND",f}p.resolve=function(t){var n=e[r][1][t];return null!=n?n:t},p.cache={};var l=u[r]=new s.Module(r);e[r][0].call(l.exports,p,l,l.exports,this)}return u[r].exports;function p(e){var r=p.resolve(e);return!1===r?{}:s(r)}}s.isParcelRequire=!0,s.Module=function(e){this.id=e,this.bundle=s,this.exports={}},s.modules=e,s.cache=u,s.parent=i,s.register=function(r,t){e[r]=[function(e,r){r.exports=t},{}]},Object.defineProperty(s,"root",{get:function(){return a[n]}}),a[n]=s;for(var f=0;f<r.length;f++)s(r[f]);if(t){var l=s(t);"object"==typeof exports&&"undefined"!=typeof module?module.exports=l:"function"==typeof define&&define.amd&&define(function(){return l})}}({duBsy:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"default",function(){return u});var o=e("@swc/helpers/_/_async_to_generator"),a=e("@swc/helpers/_/_to_consumable_array"),i=e("@swc/helpers/_/_ts_generator");function u(e){return function(r){var t,n=function(e){e in f||Object.defineProperty(f,e,{get:function(){var r=l[e];return"function"==typeof r?r.bind(l):r},set:function(r){l[e]=r},configurable:!0,enumerable:!0})},u=function(e){f[e]=function(){for(var r=arguments.length,t=Array(r),n=0;n<r;n++)t[n]=arguments[n];return e in d?d[e].apply(d,(0,a._)(t)):l[e].apply(l,t)}},c=r.constructor,s=c.utils.createElement,f=s("canvas"),l=s("video"),p=f.getContext("2d"),_=null,d={};for(var y in f)"function"==typeof f[y]&&(d[y]=f[y].bind(f));for(var h in l)n(h);for(var m in d)u(m);return t=c.config.events,setTimeout(function(){t.forEach(function(e){r.proxy(l,e,function(e){r.emit("video:".concat(e.type),e)})})}),r.on("video:loadedmetadata",function(){f.width=l.videoWidth,f.height=l.videoHeight}),r.on("video:play",function(){cancelAnimationFrame(_),j()}),r.on("video:pause",function(){cancelAnimationFrame(_)}),r.on("resize",function(){(function(){var e,t,n,o=null===(e=r.template)||void 0===e?void 0:e.$player;if(o&&!r.option.autoSize){var a=l.videoWidth/l.videoHeight,i=o.clientWidth,u=o.clientHeight;i/u>a?t=(n=u)*a:n=(t=i)/a,f.width=t,f.height=n;var c=(i-t)/2,s=(u-n)/2;Object.assign(f.style,{padding:"".concat(s,"px ").concat(c,"px")})}})(),v()}),r.on("destroy",function(){cancelAnimationFrame(_)}),f;function v(){return b.apply(this,arguments)}function b(){return(b=(0,o._)(function(){var t,n;return(0,i._)(this,function(o){switch(o.label){case 0:if(o.trys.push([0,4,,5]),!("undefined"!=typeof createImageBitmap))return[3,2];return[4,createImageBitmap(l)];case 1:return t=o.sent(),p.drawImage(t,0,0,f.width,f.height),t.close(),[3,3];case 2:p.drawImage(l,0,0,f.width,f.height),o.label=3;case 3:return e&&e(p,l),r.emit("artplayerProxyCanvas:draw",p,l),[3,5];case 4:return n=o.sent(),r.emit("artplayerProxyCanvas:error",n),[3,5];case 5:return[2]}})})).apply(this,arguments)}function j(){return g.apply(this,arguments)}function g(){return(g=(0,o._)(function(){return(0,i._)(this,function(e){switch(e.label){case 0:return[4,v()];case 1:return e.sent(),_=requestAnimationFrame(j),[2]}})})).apply(this,arguments)}}}"undefined"!=typeof window&&(window.artplayerProxyCanvas=u)},{"@swc/helpers/_/_async_to_generator":"h1sPa","@swc/helpers/_/_to_consumable_array":"gPzaF","@swc/helpers/_/_ts_generator":"ilbUJ","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],h1sPa:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e,r,t,n,o,a,i){try{var u=e[a](i),c=u.value}catch(e){t(e);return}u.done?r(c):Promise.resolve(c).then(n,o)}function a(e){return function(){var r=this,t=arguments;return new Promise(function(n,a){var i=e.apply(r,t);function u(e){o(i,n,a,u,c,"next",e)}function c(e){o(i,n,a,u,c,"throw",e)}u(void 0)})}}n.defineInteropFlag(t),n.export(t,"_async_to_generator",function(){return a}),n.export(t,"_",function(){return a})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],jOuxX:[function(e,r,t){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,r){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(r,t)||Object.defineProperty(r,t,{enumerable:!0,get:function(){return e[t]}})}),r},t.export=function(e,r,t){Object.defineProperty(e,r,{enumerable:!0,get:t})}},{}],gPzaF:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_to_consumable_array",function(){return c}),n.export(t,"_",function(){return c});var o=e("./_array_without_holes.js"),a=e("./_iterable_to_array.js"),i=e("./_non_iterable_spread.js"),u=e("./_unsupported_iterable_to_array.js");function c(e){return(0,o._array_without_holes)(e)||(0,a._iterable_to_array)(e)||(0,u._unsupported_iterable_to_array)(e)||(0,i._non_iterable_spread)()}},{"./_array_without_holes.js":"jSAgp","./_iterable_to_array.js":"kgkiP","./_non_iterable_spread.js":"ex5Ja","./_unsupported_iterable_to_array.js":"a4any","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],jSAgp:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_array_without_holes",function(){return a}),n.export(t,"_",function(){return a});var o=e("./_array_like_to_array.js");function a(e){if(Array.isArray(e))return(0,o._array_like_to_array)(e)}},{"./_array_like_to_array.js":"12ujZ","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],"12ujZ":[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=Array(r);t<r;t++)n[t]=e[t];return n}n.defineInteropFlag(t),n.export(t,"_array_like_to_array",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],kgkiP:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}n.defineInteropFlag(t),n.export(t,"_iterable_to_array",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],ex5Ja:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(){throw TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}n.defineInteropFlag(t),n.export(t,"_non_iterable_spread",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],a4any:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_unsupported_iterable_to_array",function(){return a}),n.export(t,"_",function(){return a});var o=e("./_array_like_to_array.js");function a(e,r){if(e){if("string"==typeof e)return(0,o._array_like_to_array)(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);if("Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t)return Array.from(t);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return(0,o._array_like_to_array)(e,r)}}},{"./_array_like_to_array.js":"12ujZ","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],ilbUJ:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_",function(){return o.__generator}),n.export(t,"_ts_generator",function(){return o.__generator});var o=e("tslib")},{tslib:"2NqC1","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],"2NqC1":[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"__extends",function(){return i}),n.export(t,"__assign",function(){return u}),n.export(t,"__rest",function(){return c}),n.export(t,"__decorate",function(){return s}),n.export(t,"__param",function(){return f}),n.export(t,"__esDecorate",function(){return l}),n.export(t,"__runInitializers",function(){return p}),n.export(t,"__propKey",function(){return _}),n.export(t,"__setFunctionName",function(){return d}),n.export(t,"__metadata",function(){return y}),n.export(t,"__awaiter",function(){return h}),n.export(t,"__generator",function(){return m}),n.export(t,"__createBinding",function(){return v}),n.export(t,"__exportStar",function(){return b}),n.export(t,"__values",function(){return j}),n.export(t,"__read",function(){return g}),n.export(t,"__spread",function(){return x}),n.export(t,"__spreadArrays",function(){return w}),n.export(t,"__spreadArray",function(){return O}),n.export(t,"__await",function(){return P}),n.export(t,"__asyncGenerator",function(){return S}),n.export(t,"__asyncDelegator",function(){return E}),n.export(t,"__asyncValues",function(){return I}),n.export(t,"__makeTemplateObject",function(){return F}),n.export(t,"__importStar",function(){return k}),n.export(t,"__importDefault",function(){return A}),n.export(t,"__classPrivateFieldGet",function(){return D}),n.export(t,"__classPrivateFieldSet",function(){return C}),n.export(t,"__classPrivateFieldIn",function(){return R}),n.export(t,"__addDisposableResource",function(){return X}),n.export(t,"__disposeResources",function(){return q});var o=e("@swc/helpers/_/_type_of"),a=function(e,r){return(a=Object.setPrototypeOf||({__proto__:[]})instanceof Array&&function(e,r){e.__proto__=r}||function(e,r){for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])})(e,r)};function i(e,r){if("function"!=typeof r&&null!==r)throw TypeError("Class extends value "+String(r)+" is not a constructor or null");function t(){this.constructor=e}a(e,r),e.prototype=null===r?Object.create(r):(t.prototype=r.prototype,new t)}var u=function(){return(u=Object.assign||function(e){for(var r,t=1,n=arguments.length;t<n;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e}).apply(this,arguments)};function c(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&0>r.indexOf(n)&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols)for(var o=0,n=Object.getOwnPropertySymbols(e);o<n.length;o++)0>r.indexOf(n[o])&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(t[n[o]]=e[n[o]]);return t}function s(e,r,t,n){var o,a=arguments.length,i=a<3?r:null===n?n=Object.getOwnPropertyDescriptor(r,t):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,r,t,n);else for(var u=e.length-1;u>=0;u--)(o=e[u])&&(i=(a<3?o(i):a>3?o(r,t,i):o(r,t))||i);return a>3&&i&&Object.defineProperty(r,t,i),i}function f(e,r){return function(t,n){r(t,n,e)}}function l(e,r,t,n,o,a){function i(e){if(void 0!==e&&"function"!=typeof e)throw TypeError("Function expected");return e}for(var u,c=n.kind,s="getter"===c?"get":"setter"===c?"set":"value",f=!r&&e?n.static?e:e.prototype:null,l=r||(f?Object.getOwnPropertyDescriptor(f,n.name):{}),p=!1,_=t.length-1;_>=0;_--){var d={};for(var y in n)d[y]="access"===y?{}:n[y];for(var y in n.access)d.access[y]=n.access[y];d.addInitializer=function(e){if(p)throw TypeError("Cannot add initializers after decoration has completed");a.push(i(e||null))};var h=(0,t[_])("accessor"===c?{get:l.get,set:l.set}:l[s],d);if("accessor"===c){if(void 0===h)continue;if(null===h||"object"!=typeof h)throw TypeError("Object expected");(u=i(h.get))&&(l.get=u),(u=i(h.set))&&(l.set=u),(u=i(h.init))&&o.unshift(u)}else(u=i(h))&&("field"===c?o.unshift(u):l[s]=u)}f&&Object.defineProperty(f,n.name,l),p=!0}function p(e,r,t){for(var n=arguments.length>2,o=0;o<r.length;o++)t=n?r[o].call(e,t):r[o].call(e);return n?t:void 0}function _(e){return(void 0===e?"undefined":(0,o._)(e))==="symbol"?e:"".concat(e)}function d(e,r,t){return(void 0===r?"undefined":(0,o._)(r))==="symbol"&&(r=r.description?"[".concat(r.description,"]"):""),Object.defineProperty(e,"name",{configurable:!0,value:t?"".concat(t," ",r):r})}function y(e,r){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,r)}function h(e,r,t,n){return new(t||(t=Promise))(function(o,a){function i(e){try{c(n.next(e))}catch(e){a(e)}}function u(e){try{c(n.throw(e))}catch(e){a(e)}}function c(e){var r;e.done?o(e.value):((r=e.value)instanceof t?r:new t(function(e){e(r)})).then(i,u)}c((n=n.apply(e,r||[])).next())})}function m(e,r){var t,n,o,a,i={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return a={next:u(0),throw:u(1),return:u(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function u(u){return function(c){return function(u){if(t)throw TypeError("Generator is already executing.");for(;a&&(a=0,u[0]&&(i=0)),i;)try{if(t=1,n&&(o=2&u[0]?n.return:u[0]?n.throw||((o=n.return)&&o.call(n),0):n.next)&&!(o=o.call(n,u[1])).done)return o;switch(n=0,o&&(u=[2&u[0],o.value]),u[0]){case 0:case 1:o=u;break;case 4:return i.label++,{value:u[1],done:!1};case 5:i.label++,n=u[1],u=[0];continue;case 7:u=i.ops.pop(),i.trys.pop();continue;default:if(!(o=(o=i.trys).length>0&&o[o.length-1])&&(6===u[0]||2===u[0])){i=0;continue}if(3===u[0]&&(!o||u[1]>o[0]&&u[1]<o[3])){i.label=u[1];break}if(6===u[0]&&i.label<o[1]){i.label=o[1],o=u;break}if(o&&i.label<o[2]){i.label=o[2],i.ops.push(u);break}o[2]&&i.ops.pop(),i.trys.pop();continue}u=r.call(e,i)}catch(e){u=[6,e],n=0}finally{t=o=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}([u,c])}}}var v=Object.create?function(e,r,t,n){void 0===n&&(n=t);var o=Object.getOwnPropertyDescriptor(r,t);(!o||("get"in o?!r.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return r[t]}}),Object.defineProperty(e,n,o)}:function(e,r,t,n){void 0===n&&(n=t),e[n]=r[t]};function b(e,r){for(var t in e)"default"===t||Object.prototype.hasOwnProperty.call(r,t)||v(r,e,t)}function j(e){var r="function"==typeof Symbol&&Symbol.iterator,t=r&&e[r],n=0;if(t)return t.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw TypeError(r?"Object is not iterable.":"Symbol.iterator is not defined.")}function g(e,r){var t="function"==typeof Symbol&&e[Symbol.iterator];if(!t)return e;var n,o,a=t.call(e),i=[];try{for(;(void 0===r||r-- >0)&&!(n=a.next()).done;)i.push(n.value)}catch(e){o={error:e}}finally{try{n&&!n.done&&(t=a.return)&&t.call(a)}finally{if(o)throw o.error}}return i}function x(){for(var e=[],r=0;r<arguments.length;r++)e=e.concat(g(arguments[r]));return e}function w(){for(var e=0,r=0,t=arguments.length;r<t;r++)e+=arguments[r].length;for(var n=Array(e),o=0,r=0;r<t;r++)for(var a=arguments[r],i=0,u=a.length;i<u;i++,o++)n[o]=a[i];return n}function O(e,r,t){if(t||2==arguments.length)for(var n,o=0,a=r.length;o<a;o++)!n&&o in r||(n||(n=Array.prototype.slice.call(r,0,o)),n[o]=r[o]);return e.concat(n||Array.prototype.slice.call(r))}function P(e){return this instanceof P?(this.v=e,this):new P(e)}function S(e,r,t){if(!Symbol.asyncIterator)throw TypeError("Symbol.asyncIterator is not defined.");var n,o=t.apply(e,r||[]),a=[];return n={},i("next"),i("throw"),i("return",function(e){return function(r){return Promise.resolve(r).then(e,s)}}),n[Symbol.asyncIterator]=function(){return this},n;function i(e,r){o[e]&&(n[e]=function(r){return new Promise(function(t,n){a.push([e,r,t,n])>1||u(e,r)})},r&&(n[e]=r(n[e])))}function u(e,r){try{var t;(t=o[e](r)).value instanceof P?Promise.resolve(t.value.v).then(c,s):f(a[0][2],t)}catch(e){f(a[0][3],e)}}function c(e){u("next",e)}function s(e){u("throw",e)}function f(e,r){e(r),a.shift(),a.length&&u(a[0][0],a[0][1])}}function E(e){var r,t;return r={},n("next"),n("throw",function(e){throw e}),n("return"),r[Symbol.iterator]=function(){return this},r;function n(n,o){r[n]=e[n]?function(r){return(t=!t)?{value:P(e[n](r)),done:!1}:o?o(r):r}:o}}function I(e){if(!Symbol.asyncIterator)throw TypeError("Symbol.asyncIterator is not defined.");var r,t=e[Symbol.asyncIterator];return t?t.call(e):(e=j(e),r={},n("next"),n("throw"),n("return"),r[Symbol.asyncIterator]=function(){return this},r);function n(t){r[t]=e[t]&&function(r){return new Promise(function(n,o){!function(e,r,t,n){Promise.resolve(n).then(function(r){e({value:r,done:t})},r)}(n,o,(r=e[t](r)).done,r.value)})}}}function F(e,r){return Object.defineProperty?Object.defineProperty(e,"raw",{value:r}):e.raw=r,e}var T=Object.create?function(e,r){Object.defineProperty(e,"default",{enumerable:!0,value:r})}:function(e,r){e.default=r};function k(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)"default"!==t&&Object.prototype.hasOwnProperty.call(e,t)&&v(r,e,t);return T(r,e),r}function A(e){return e&&e.__esModule?e:{default:e}}function D(e,r,t,n){if("a"===t&&!n)throw TypeError("Private accessor was defined without a getter");if("function"==typeof r?e!==r||!n:!r.has(e))throw TypeError("Cannot read private member from an object whose class did not declare it");return"m"===t?n:"a"===t?n.call(e):n?n.value:r.get(e)}function C(e,r,t,n,o){if("m"===n)throw TypeError("Private method is not writable");if("a"===n&&!o)throw TypeError("Private accessor was defined without a setter");if("function"==typeof r?e!==r||!o:!r.has(e))throw TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?o.call(e,t):o?o.value=t:r.set(e,t),t}function R(e,r){if(null===r||"object"!=typeof r&&"function"!=typeof r)throw TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?r===e:e.has(r)}function X(e,r,t){if(null!=r){var n,o;if("object"!=typeof r&&"function"!=typeof r)throw TypeError("Object expected.");if(t){if(!Symbol.asyncDispose)throw TypeError("Symbol.asyncDispose is not defined.");n=r[Symbol.asyncDispose]}if(void 0===n){if(!Symbol.dispose)throw TypeError("Symbol.dispose is not defined.");n=r[Symbol.dispose],t&&(o=n)}if("function"!=typeof n)throw TypeError("Object not disposable.");o&&(n=function(){try{o.call(this)}catch(e){return Promise.reject(e)}}),e.stack.push({value:r,dispose:n,async:t})}else t&&e.stack.push({async:!0});return r}var M="function"==typeof SuppressedError?SuppressedError:function(e,r,t){var n=Error(t);return n.name="SuppressedError",n.error=e,n.suppressed=r,n};function q(e){function r(r){e.error=e.hasError?new M(r,e.error,"An error was suppressed during disposal."):r,e.hasError=!0}return function t(){for(;e.stack.length;){var n=e.stack.pop();try{var o=n.dispose&&n.dispose.call(n.value);if(n.async)return Promise.resolve(o).then(t,function(e){return r(e),t()})}catch(e){r(e)}}if(e.hasError)throw e.error}()}t.default={__extends:i,__assign:u,__rest:c,__decorate:s,__param:f,__metadata:y,__awaiter:h,__generator:m,__createBinding:v,__exportStar:b,__values:j,__read:g,__spread:x,__spreadArrays:w,__spreadArray:O,__await:P,__asyncGenerator:S,__asyncDelegator:E,__asyncValues:I,__makeTemplateObject:F,__importStar:k,__importDefault:A,__classPrivateFieldGet:D,__classPrivateFieldSet:C,__classPrivateFieldIn:R,__addDisposableResource:X,__disposeResources:q}},{"@swc/helpers/_/_type_of":"aFoNC","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],aFoNC:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e){return e&&"undefined"!=typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}n.defineInteropFlag(t),n.export(t,"_type_of",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}]},["duBsy"],"duBsy","parcelRequire94c2");
\ No newline at end of file
diff --git a/packages/artplayer-proxy-canvas/dist/artplayer-proxy-canvas.js b/packages/artplayer-proxy-canvas/dist/artplayer-proxy-canvas.js
new file mode 100644
index 000000000..c92ec6e84
--- /dev/null
+++ b/packages/artplayer-proxy-canvas/dist/artplayer-proxy-canvas.js
@@ -0,0 +1,8 @@
+
+/*!
+ * artplayer-proxy-canvas.js v1.0.0
+ * Github: https://github.com/zhw2590582/ArtPlayer
+ * (c) 2017-2024 Harvey Zack
+ * Released under the MIT License.
+ */
+!function(e,t,n,o,r){var i="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof global?global:{},a="function"==typeof i[o]&&i[o],u=a.cache||{},f="undefined"!=typeof module&&"function"==typeof module.require&&module.require.bind(module);function l(t,n){if(!u[t]){if(!e[t]){var r="function"==typeof i[o]&&i[o];if(!n&&r)return r(t,!0);if(a)return a(t,!0);if(f&&"string"==typeof t)return f(t);var d=Error("Cannot find module '"+t+"'");throw d.code="MODULE_NOT_FOUND",d}p.resolve=function(n){var o=e[t][1][n];return null!=o?o:n},p.cache={};var c=u[t]=new l.Module(t);e[t][0].call(c.exports,p,c,c.exports,this)}return u[t].exports;function p(e){var t=p.resolve(e);return!1===t?{}:l(t)}}l.isParcelRequire=!0,l.Module=function(e){this.id=e,this.bundle=l,this.exports={}},l.modules=e,l.cache=u,l.parent=a,l.register=function(t,n){e[t]=[function(e,t){t.exports=n},{}]},Object.defineProperty(l,"root",{get:function(){return i[o]}}),i[o]=l;for(var d=0;d<t.length;d++)l(t[d]);if(n){var c=l(n);"object"==typeof exports&&"undefined"!=typeof module?module.exports=c:"function"==typeof define&&define.amd&&define(function(){return c})}}({"4A0Ge":[function(e,t,n){var o=e("@parcel/transformer-js/src/esmodule-helpers.js");function r(e){return t=>{let{constructor:n}=t,{createElement:o}=n.utils,r=o("canvas"),i=o("video"),a=r.getContext("2d"),u=null,f={};for(let e in r)"function"==typeof r[e]&&(f[e]=r[e].bind(r));for(let e in i)e in r||Object.defineProperty(r,e,{get(){let t=i[e];return"function"==typeof t?t.bind(i):t},set(t){i[e]=t},configurable:!0,enumerable:!0});for(let e in f)r[e]=function(...t){return e in f?f[e](...t):i[e].apply(i,t)};return function(){let{events:e}=n.config;setTimeout(()=>{e.forEach(e=>{t.proxy(i,e,e=>{t.emit(`video:${e.type}`,e)})})})}(),t.on("video:loadedmetadata",()=>{r.width=i.videoWidth,r.height=i.videoHeight}),t.on("video:play",()=>{cancelAnimationFrame(u),d()}),t.on("video:pause",()=>{cancelAnimationFrame(u)}),t.on("resize",()=>{(function(){let e,n;let o=t.template?.$player;if(!o||t.option.autoSize)return;let a=i.videoWidth/i.videoHeight,u=o.clientWidth,f=o.clientHeight;u/f>a?e=(n=f)*a:n=(e=u)/a,r.width=e,r.height=n;let l=(u-e)/2,d=(f-n)/2;Object.assign(r.style,{padding:`${d}px ${l}px`})})(),l()}),t.on("destroy",()=>{cancelAnimationFrame(u)}),r;async function l(){try{if("undefined"!=typeof createImageBitmap){let e=await createImageBitmap(i);a.drawImage(e,0,0,r.width,r.height),e.close()}else a.drawImage(i,0,0,r.width,r.height);e&&e(a,i),t.emit("artplayerProxyCanvas:draw",a,i)}catch(e){t.emit("artplayerProxyCanvas:error",e)}}async function d(){await l(),u=requestAnimationFrame(d)}}}o.defineInteropFlag(n),o.export(n,"default",()=>r),"undefined"!=typeof window&&(window.artplayerProxyCanvas=r)},{"@parcel/transformer-js/src/esmodule-helpers.js":"hqP7A"}],hqP7A:[function(e,t,n){n.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},n.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.exportAll=function(e,t){return Object.keys(e).forEach(function(n){"default"===n||"__esModule"===n||Object.prototype.hasOwnProperty.call(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:function(){return e[n]}})}),t},n.export=function(e,t,n){Object.defineProperty(e,t,{enumerable:!0,get:n})}},{}]},["4A0Ge"],"4A0Ge","parcelRequire94c2");
\ No newline at end of file
diff --git a/packages/artplayer-proxy-canvas/dist/artplayer-proxy-canvas.legacy.js b/packages/artplayer-proxy-canvas/dist/artplayer-proxy-canvas.legacy.js
new file mode 100644
index 000000000..8729c73cb
--- /dev/null
+++ b/packages/artplayer-proxy-canvas/dist/artplayer-proxy-canvas.legacy.js
@@ -0,0 +1,8 @@
+
+/*!
+ * artplayer-proxy-canvas.js v1.0.0
+ * Github: https://github.com/zhw2590582/ArtPlayer
+ * (c) 2017-2024 Harvey Zack
+ * Released under the MIT License.
+ */
+!function(e,r,t,n,o){var a="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:"undefined"!=typeof global?global:{},i="function"==typeof a[n]&&a[n],u=i.cache||{},c="undefined"!=typeof module&&"function"==typeof module.require&&module.require.bind(module);function s(r,t){if(!u[r]){if(!e[r]){var o="function"==typeof a[n]&&a[n];if(!t&&o)return o(r,!0);if(i)return i(r,!0);if(c&&"string"==typeof r)return c(r);var f=Error("Cannot find module '"+r+"'");throw f.code="MODULE_NOT_FOUND",f}p.resolve=function(t){var n=e[r][1][t];return null!=n?n:t},p.cache={};var l=u[r]=new s.Module(r);e[r][0].call(l.exports,p,l,l.exports,this)}return u[r].exports;function p(e){var r=p.resolve(e);return!1===r?{}:s(r)}}s.isParcelRequire=!0,s.Module=function(e){this.id=e,this.bundle=s,this.exports={}},s.modules=e,s.cache=u,s.parent=i,s.register=function(r,t){e[r]=[function(e,r){r.exports=t},{}]},Object.defineProperty(s,"root",{get:function(){return a[n]}}),a[n]=s;for(var f=0;f<r.length;f++)s(r[f]);if(t){var l=s(t);"object"==typeof exports&&"undefined"!=typeof module?module.exports=l:"function"==typeof define&&define.amd&&define(function(){return l})}}({duBsy:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"default",function(){return u});var o=e("@swc/helpers/_/_async_to_generator"),a=e("@swc/helpers/_/_to_consumable_array"),i=e("@swc/helpers/_/_ts_generator");function u(e){return function(r){var t,n=function(e){e in f||Object.defineProperty(f,e,{get:function(){var r=l[e];return"function"==typeof r?r.bind(l):r},set:function(r){l[e]=r},configurable:!0,enumerable:!0})},u=function(e){f[e]=function(){for(var r=arguments.length,t=Array(r),n=0;n<r;n++)t[n]=arguments[n];return e in d?d[e].apply(d,(0,a._)(t)):l[e].apply(l,t)}},c=r.constructor,s=c.utils.createElement,f=s("canvas"),l=s("video"),p=f.getContext("2d"),_=null,d={};for(var y in f)"function"==typeof f[y]&&(d[y]=f[y].bind(f));for(var h in l)n(h);for(var m in d)u(m);return t=c.config.events,setTimeout(function(){t.forEach(function(e){r.proxy(l,e,function(e){r.emit("video:".concat(e.type),e)})})}),r.on("video:loadedmetadata",function(){f.width=l.videoWidth,f.height=l.videoHeight}),r.on("video:play",function(){cancelAnimationFrame(_),j()}),r.on("video:pause",function(){cancelAnimationFrame(_)}),r.on("resize",function(){(function(){var e,t,n,o=null===(e=r.template)||void 0===e?void 0:e.$player;if(o&&!r.option.autoSize){var a=l.videoWidth/l.videoHeight,i=o.clientWidth,u=o.clientHeight;i/u>a?t=(n=u)*a:n=(t=i)/a,f.width=t,f.height=n;var c=(i-t)/2,s=(u-n)/2;Object.assign(f.style,{padding:"".concat(s,"px ").concat(c,"px")})}})(),v()}),r.on("destroy",function(){cancelAnimationFrame(_)}),f;function v(){return b.apply(this,arguments)}function b(){return(b=(0,o._)(function(){var t,n;return(0,i._)(this,function(o){switch(o.label){case 0:if(o.trys.push([0,4,,5]),!("undefined"!=typeof createImageBitmap))return[3,2];return[4,createImageBitmap(l)];case 1:return t=o.sent(),p.drawImage(t,0,0,f.width,f.height),t.close(),[3,3];case 2:p.drawImage(l,0,0,f.width,f.height),o.label=3;case 3:return e&&e(p,l),r.emit("artplayerProxyCanvas:draw",p,l),[3,5];case 4:return n=o.sent(),r.emit("artplayerProxyCanvas:error",n),[3,5];case 5:return[2]}})})).apply(this,arguments)}function j(){return g.apply(this,arguments)}function g(){return(g=(0,o._)(function(){return(0,i._)(this,function(e){switch(e.label){case 0:return[4,v()];case 1:return e.sent(),_=requestAnimationFrame(j),[2]}})})).apply(this,arguments)}}}"undefined"!=typeof window&&(window.artplayerProxyCanvas=u)},{"@swc/helpers/_/_async_to_generator":"h1sPa","@swc/helpers/_/_to_consumable_array":"gPzaF","@swc/helpers/_/_ts_generator":"ilbUJ","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],h1sPa:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e,r,t,n,o,a,i){try{var u=e[a](i),c=u.value}catch(e){t(e);return}u.done?r(c):Promise.resolve(c).then(n,o)}function a(e){return function(){var r=this,t=arguments;return new Promise(function(n,a){var i=e.apply(r,t);function u(e){o(i,n,a,u,c,"next",e)}function c(e){o(i,n,a,u,c,"throw",e)}u(void 0)})}}n.defineInteropFlag(t),n.export(t,"_async_to_generator",function(){return a}),n.export(t,"_",function(){return a})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],jOuxX:[function(e,r,t){t.interopDefault=function(e){return e&&e.__esModule?e:{default:e}},t.defineInteropFlag=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.exportAll=function(e,r){return Object.keys(e).forEach(function(t){"default"===t||"__esModule"===t||Object.prototype.hasOwnProperty.call(r,t)||Object.defineProperty(r,t,{enumerable:!0,get:function(){return e[t]}})}),r},t.export=function(e,r,t){Object.defineProperty(e,r,{enumerable:!0,get:t})}},{}],gPzaF:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_to_consumable_array",function(){return c}),n.export(t,"_",function(){return c});var o=e("./_array_without_holes.js"),a=e("./_iterable_to_array.js"),i=e("./_non_iterable_spread.js"),u=e("./_unsupported_iterable_to_array.js");function c(e){return(0,o._array_without_holes)(e)||(0,a._iterable_to_array)(e)||(0,u._unsupported_iterable_to_array)(e)||(0,i._non_iterable_spread)()}},{"./_array_without_holes.js":"jSAgp","./_iterable_to_array.js":"kgkiP","./_non_iterable_spread.js":"ex5Ja","./_unsupported_iterable_to_array.js":"a4any","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],jSAgp:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_array_without_holes",function(){return a}),n.export(t,"_",function(){return a});var o=e("./_array_like_to_array.js");function a(e){if(Array.isArray(e))return(0,o._array_like_to_array)(e)}},{"./_array_like_to_array.js":"12ujZ","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],"12ujZ":[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=Array(r);t<r;t++)n[t]=e[t];return n}n.defineInteropFlag(t),n.export(t,"_array_like_to_array",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],kgkiP:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}n.defineInteropFlag(t),n.export(t,"_iterable_to_array",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],ex5Ja:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(){throw TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}n.defineInteropFlag(t),n.export(t,"_non_iterable_spread",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],a4any:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_unsupported_iterable_to_array",function(){return a}),n.export(t,"_",function(){return a});var o=e("./_array_like_to_array.js");function a(e,r){if(e){if("string"==typeof e)return(0,o._array_like_to_array)(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);if("Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t)return Array.from(t);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return(0,o._array_like_to_array)(e,r)}}},{"./_array_like_to_array.js":"12ujZ","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],ilbUJ:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"_",function(){return o.__generator}),n.export(t,"_ts_generator",function(){return o.__generator});var o=e("tslib")},{tslib:"2NqC1","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],"2NqC1":[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");n.defineInteropFlag(t),n.export(t,"__extends",function(){return i}),n.export(t,"__assign",function(){return u}),n.export(t,"__rest",function(){return c}),n.export(t,"__decorate",function(){return s}),n.export(t,"__param",function(){return f}),n.export(t,"__esDecorate",function(){return l}),n.export(t,"__runInitializers",function(){return p}),n.export(t,"__propKey",function(){return _}),n.export(t,"__setFunctionName",function(){return d}),n.export(t,"__metadata",function(){return y}),n.export(t,"__awaiter",function(){return h}),n.export(t,"__generator",function(){return m}),n.export(t,"__createBinding",function(){return v}),n.export(t,"__exportStar",function(){return b}),n.export(t,"__values",function(){return j}),n.export(t,"__read",function(){return g}),n.export(t,"__spread",function(){return x}),n.export(t,"__spreadArrays",function(){return w}),n.export(t,"__spreadArray",function(){return O}),n.export(t,"__await",function(){return P}),n.export(t,"__asyncGenerator",function(){return S}),n.export(t,"__asyncDelegator",function(){return E}),n.export(t,"__asyncValues",function(){return I}),n.export(t,"__makeTemplateObject",function(){return F}),n.export(t,"__importStar",function(){return k}),n.export(t,"__importDefault",function(){return A}),n.export(t,"__classPrivateFieldGet",function(){return D}),n.export(t,"__classPrivateFieldSet",function(){return C}),n.export(t,"__classPrivateFieldIn",function(){return R}),n.export(t,"__addDisposableResource",function(){return X}),n.export(t,"__disposeResources",function(){return q});var o=e("@swc/helpers/_/_type_of"),a=function(e,r){return(a=Object.setPrototypeOf||({__proto__:[]})instanceof Array&&function(e,r){e.__proto__=r}||function(e,r){for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])})(e,r)};function i(e,r){if("function"!=typeof r&&null!==r)throw TypeError("Class extends value "+String(r)+" is not a constructor or null");function t(){this.constructor=e}a(e,r),e.prototype=null===r?Object.create(r):(t.prototype=r.prototype,new t)}var u=function(){return(u=Object.assign||function(e){for(var r,t=1,n=arguments.length;t<n;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e}).apply(this,arguments)};function c(e,r){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&0>r.indexOf(n)&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols)for(var o=0,n=Object.getOwnPropertySymbols(e);o<n.length;o++)0>r.indexOf(n[o])&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(t[n[o]]=e[n[o]]);return t}function s(e,r,t,n){var o,a=arguments.length,i=a<3?r:null===n?n=Object.getOwnPropertyDescriptor(r,t):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,r,t,n);else for(var u=e.length-1;u>=0;u--)(o=e[u])&&(i=(a<3?o(i):a>3?o(r,t,i):o(r,t))||i);return a>3&&i&&Object.defineProperty(r,t,i),i}function f(e,r){return function(t,n){r(t,n,e)}}function l(e,r,t,n,o,a){function i(e){if(void 0!==e&&"function"!=typeof e)throw TypeError("Function expected");return e}for(var u,c=n.kind,s="getter"===c?"get":"setter"===c?"set":"value",f=!r&&e?n.static?e:e.prototype:null,l=r||(f?Object.getOwnPropertyDescriptor(f,n.name):{}),p=!1,_=t.length-1;_>=0;_--){var d={};for(var y in n)d[y]="access"===y?{}:n[y];for(var y in n.access)d.access[y]=n.access[y];d.addInitializer=function(e){if(p)throw TypeError("Cannot add initializers after decoration has completed");a.push(i(e||null))};var h=(0,t[_])("accessor"===c?{get:l.get,set:l.set}:l[s],d);if("accessor"===c){if(void 0===h)continue;if(null===h||"object"!=typeof h)throw TypeError("Object expected");(u=i(h.get))&&(l.get=u),(u=i(h.set))&&(l.set=u),(u=i(h.init))&&o.unshift(u)}else(u=i(h))&&("field"===c?o.unshift(u):l[s]=u)}f&&Object.defineProperty(f,n.name,l),p=!0}function p(e,r,t){for(var n=arguments.length>2,o=0;o<r.length;o++)t=n?r[o].call(e,t):r[o].call(e);return n?t:void 0}function _(e){return(void 0===e?"undefined":(0,o._)(e))==="symbol"?e:"".concat(e)}function d(e,r,t){return(void 0===r?"undefined":(0,o._)(r))==="symbol"&&(r=r.description?"[".concat(r.description,"]"):""),Object.defineProperty(e,"name",{configurable:!0,value:t?"".concat(t," ",r):r})}function y(e,r){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,r)}function h(e,r,t,n){return new(t||(t=Promise))(function(o,a){function i(e){try{c(n.next(e))}catch(e){a(e)}}function u(e){try{c(n.throw(e))}catch(e){a(e)}}function c(e){var r;e.done?o(e.value):((r=e.value)instanceof t?r:new t(function(e){e(r)})).then(i,u)}c((n=n.apply(e,r||[])).next())})}function m(e,r){var t,n,o,a,i={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return a={next:u(0),throw:u(1),return:u(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function u(u){return function(c){return function(u){if(t)throw TypeError("Generator is already executing.");for(;a&&(a=0,u[0]&&(i=0)),i;)try{if(t=1,n&&(o=2&u[0]?n.return:u[0]?n.throw||((o=n.return)&&o.call(n),0):n.next)&&!(o=o.call(n,u[1])).done)return o;switch(n=0,o&&(u=[2&u[0],o.value]),u[0]){case 0:case 1:o=u;break;case 4:return i.label++,{value:u[1],done:!1};case 5:i.label++,n=u[1],u=[0];continue;case 7:u=i.ops.pop(),i.trys.pop();continue;default:if(!(o=(o=i.trys).length>0&&o[o.length-1])&&(6===u[0]||2===u[0])){i=0;continue}if(3===u[0]&&(!o||u[1]>o[0]&&u[1]<o[3])){i.label=u[1];break}if(6===u[0]&&i.label<o[1]){i.label=o[1],o=u;break}if(o&&i.label<o[2]){i.label=o[2],i.ops.push(u);break}o[2]&&i.ops.pop(),i.trys.pop();continue}u=r.call(e,i)}catch(e){u=[6,e],n=0}finally{t=o=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}([u,c])}}}var v=Object.create?function(e,r,t,n){void 0===n&&(n=t);var o=Object.getOwnPropertyDescriptor(r,t);(!o||("get"in o?!r.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return r[t]}}),Object.defineProperty(e,n,o)}:function(e,r,t,n){void 0===n&&(n=t),e[n]=r[t]};function b(e,r){for(var t in e)"default"===t||Object.prototype.hasOwnProperty.call(r,t)||v(r,e,t)}function j(e){var r="function"==typeof Symbol&&Symbol.iterator,t=r&&e[r],n=0;if(t)return t.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw TypeError(r?"Object is not iterable.":"Symbol.iterator is not defined.")}function g(e,r){var t="function"==typeof Symbol&&e[Symbol.iterator];if(!t)return e;var n,o,a=t.call(e),i=[];try{for(;(void 0===r||r-- >0)&&!(n=a.next()).done;)i.push(n.value)}catch(e){o={error:e}}finally{try{n&&!n.done&&(t=a.return)&&t.call(a)}finally{if(o)throw o.error}}return i}function x(){for(var e=[],r=0;r<arguments.length;r++)e=e.concat(g(arguments[r]));return e}function w(){for(var e=0,r=0,t=arguments.length;r<t;r++)e+=arguments[r].length;for(var n=Array(e),o=0,r=0;r<t;r++)for(var a=arguments[r],i=0,u=a.length;i<u;i++,o++)n[o]=a[i];return n}function O(e,r,t){if(t||2==arguments.length)for(var n,o=0,a=r.length;o<a;o++)!n&&o in r||(n||(n=Array.prototype.slice.call(r,0,o)),n[o]=r[o]);return e.concat(n||Array.prototype.slice.call(r))}function P(e){return this instanceof P?(this.v=e,this):new P(e)}function S(e,r,t){if(!Symbol.asyncIterator)throw TypeError("Symbol.asyncIterator is not defined.");var n,o=t.apply(e,r||[]),a=[];return n={},i("next"),i("throw"),i("return",function(e){return function(r){return Promise.resolve(r).then(e,s)}}),n[Symbol.asyncIterator]=function(){return this},n;function i(e,r){o[e]&&(n[e]=function(r){return new Promise(function(t,n){a.push([e,r,t,n])>1||u(e,r)})},r&&(n[e]=r(n[e])))}function u(e,r){try{var t;(t=o[e](r)).value instanceof P?Promise.resolve(t.value.v).then(c,s):f(a[0][2],t)}catch(e){f(a[0][3],e)}}function c(e){u("next",e)}function s(e){u("throw",e)}function f(e,r){e(r),a.shift(),a.length&&u(a[0][0],a[0][1])}}function E(e){var r,t;return r={},n("next"),n("throw",function(e){throw e}),n("return"),r[Symbol.iterator]=function(){return this},r;function n(n,o){r[n]=e[n]?function(r){return(t=!t)?{value:P(e[n](r)),done:!1}:o?o(r):r}:o}}function I(e){if(!Symbol.asyncIterator)throw TypeError("Symbol.asyncIterator is not defined.");var r,t=e[Symbol.asyncIterator];return t?t.call(e):(e=j(e),r={},n("next"),n("throw"),n("return"),r[Symbol.asyncIterator]=function(){return this},r);function n(t){r[t]=e[t]&&function(r){return new Promise(function(n,o){!function(e,r,t,n){Promise.resolve(n).then(function(r){e({value:r,done:t})},r)}(n,o,(r=e[t](r)).done,r.value)})}}}function F(e,r){return Object.defineProperty?Object.defineProperty(e,"raw",{value:r}):e.raw=r,e}var T=Object.create?function(e,r){Object.defineProperty(e,"default",{enumerable:!0,value:r})}:function(e,r){e.default=r};function k(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)"default"!==t&&Object.prototype.hasOwnProperty.call(e,t)&&v(r,e,t);return T(r,e),r}function A(e){return e&&e.__esModule?e:{default:e}}function D(e,r,t,n){if("a"===t&&!n)throw TypeError("Private accessor was defined without a getter");if("function"==typeof r?e!==r||!n:!r.has(e))throw TypeError("Cannot read private member from an object whose class did not declare it");return"m"===t?n:"a"===t?n.call(e):n?n.value:r.get(e)}function C(e,r,t,n,o){if("m"===n)throw TypeError("Private method is not writable");if("a"===n&&!o)throw TypeError("Private accessor was defined without a setter");if("function"==typeof r?e!==r||!o:!r.has(e))throw TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?o.call(e,t):o?o.value=t:r.set(e,t),t}function R(e,r){if(null===r||"object"!=typeof r&&"function"!=typeof r)throw TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?r===e:e.has(r)}function X(e,r,t){if(null!=r){var n,o;if("object"!=typeof r&&"function"!=typeof r)throw TypeError("Object expected.");if(t){if(!Symbol.asyncDispose)throw TypeError("Symbol.asyncDispose is not defined.");n=r[Symbol.asyncDispose]}if(void 0===n){if(!Symbol.dispose)throw TypeError("Symbol.dispose is not defined.");n=r[Symbol.dispose],t&&(o=n)}if("function"!=typeof n)throw TypeError("Object not disposable.");o&&(n=function(){try{o.call(this)}catch(e){return Promise.reject(e)}}),e.stack.push({value:r,dispose:n,async:t})}else t&&e.stack.push({async:!0});return r}var M="function"==typeof SuppressedError?SuppressedError:function(e,r,t){var n=Error(t);return n.name="SuppressedError",n.error=e,n.suppressed=r,n};function q(e){function r(r){e.error=e.hasError?new M(r,e.error,"An error was suppressed during disposal."):r,e.hasError=!0}return function t(){for(;e.stack.length;){var n=e.stack.pop();try{var o=n.dispose&&n.dispose.call(n.value);if(n.async)return Promise.resolve(o).then(t,function(e){return r(e),t()})}catch(e){r(e)}}if(e.hasError)throw e.error}()}t.default={__extends:i,__assign:u,__rest:c,__decorate:s,__param:f,__metadata:y,__awaiter:h,__generator:m,__createBinding:v,__exportStar:b,__values:j,__read:g,__spread:x,__spreadArrays:w,__spreadArray:O,__await:P,__asyncGenerator:S,__asyncDelegator:E,__asyncValues:I,__makeTemplateObject:F,__importStar:k,__importDefault:A,__classPrivateFieldGet:D,__classPrivateFieldSet:C,__classPrivateFieldIn:R,__addDisposableResource:X,__disposeResources:q}},{"@swc/helpers/_/_type_of":"aFoNC","@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}],aFoNC:[function(e,r,t){var n=e("@parcel/transformer-js/src/esmodule-helpers.js");function o(e){return e&&"undefined"!=typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}n.defineInteropFlag(t),n.export(t,"_type_of",function(){return o}),n.export(t,"_",function(){return o})},{"@parcel/transformer-js/src/esmodule-helpers.js":"jOuxX"}]},["duBsy"],"duBsy","parcelRequire94c2");
\ No newline at end of file
diff --git a/packages/artplayer-vitepress/docs/.vitepress/config.js b/packages/artplayer-vitepress/docs/.vitepress/config.js
index 9362e2eb5..36702e80d 100644
--- a/packages/artplayer-vitepress/docs/.vitepress/config.js
+++ b/packages/artplayer-vitepress/docs/.vitepress/config.js
@@ -89,6 +89,13 @@ const config = {
             { text: 'webtorrent.js', link: 'https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent' },
           ]
         },
+        {
+          text: '代理',
+          collapsible: true,
+          items: [
+            { text: 'Canvas', link: 'https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas' },
+          ]
+        },
       ],
       '/en/': [
         {
@@ -149,6 +156,13 @@ const config = {
             { text: 'webtorrent.js', link: 'https://artplayer.org/?libs=https://cdn.jsdelivr.net/npm/webtorrent@1/webtorrent.min.js&example=webtorrent' },
           ]
         },
+        {
+          text: 'Proxy',
+          collapsible: true,
+          items: [
+            { text: 'Canvas', link: 'https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvas' },
+          ]
+        },
       ],
     },
     editLink: {