github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-12 11:19:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化动态加载静态资源

Browse Source
This commit is contained in:
kuaifan 2023-04-02 22:41:49 +08:00
parent b580a9f7ad
commit d11a89d02c
9 changed files with 163 additions and 142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
resources/assets/js/App.vue
View File

@ -120,11 +120,7 @@ export default {
$A.IDBString("logOpen").then(r => { $A.IDBString("logOpen").then(r => {
$A.openLog = r === "open" $A.openLog = r === "open"
if ($A.openLog) { if ($A.openLog) {
$A.loadScript('js/vconsole.min.js', (e) => { $A.loadScript('js/vconsole.min.js').then(_ => {
if (e !== null || typeof window.VConsole !== 'function') {
$A.modalError("vConsole 组件加载失败！");
return;
}
window.vConsole = new window.VConsole({ window.vConsole = new window.VConsole({
onReady: () => { onReady: () => {
console.log('vConsole: onReady'); console.log('vConsole: onReady');
@ -133,7 +129,9 @@ export default {
console.log('vConsole: onClearLog'); console.log('vConsole: onClearLog');
} }
}); });
}); }).catch(_ => {
$A.modalError("vConsole 组件加载失败！");
})
} }
}) })
} }

4
resources/assets/js/components/AceEditor.vue
View File

@ -187,7 +187,7 @@ export default {
$A.loadScriptS([ $A.loadScriptS([
'js/ace/ace.js', 'js/ace/ace.js',
'js/ace/mode-json.js', 'js/ace/mode-json.js',
], () => { ]).then(_ => {
// set init editor size // set init editor size
this.setSize(this.$el, {height: this.height, width: this.width}) this.setSize(this.$el, {height: this.height, width: this.width})
@ -234,7 +234,7 @@ export default {
this.code = this.editor.getValue() this.code = this.editor.getValue()
this.$emit('input', this.code); this.$emit('input', this.code);
}); });
}); })
}, },
methods: { methods: {
/** /**

8
resources/assets/js/components/MDEditor/index.vue
View File

@ -225,17 +225,15 @@
} }
}, },
htmlOk() { htmlOk() {
$A.loadScript('js/html2md.js', (e) => { $A.loadScript('js/html2md.js').then(_ => {
if (e !== null || typeof toMarkdown !== 'function') {
$A.modalError("组件加载失败！");
return;
}
if (this.transfer) { if (this.transfer) {
this.$refs.md2.insertContent('\n' + toMarkdown(this.htmlValue, { gfm: true })); this.$refs.md2.insertContent('\n' + toMarkdown(this.htmlValue, { gfm: true }));
} else { } else {
this.$refs.md1.insertContent('\n' + toMarkdown(this.htmlValue, { gfm: true })); this.$refs.md1.insertContent('\n' + toMarkdown(this.htmlValue, { gfm: true }));
} }
this.htmlValue = ""; this.htmlValue = "";
}).catch(_ => {
$A.modalError("组件加载失败！");
}); });
}, },

11
resources/assets/js/components/OnlyOffice.vue
View File

@ -156,12 +156,7 @@ export default {
} }
this.loading = true; this.loading = true;
this.loadError = false; this.loadError = false;
$A.loadScript($A.apiUrl("../office/web-apps/apps/api/documents/api.js"), (e) => { $A.loadScript($A.apiUrl("../office/web-apps/apps/api/documents/api.js")).then(_ => {
this.loading = false;
if (e !== null) {
this.loadError = true;
return;
}
if (!this.documentKey) { if (!this.documentKey) {
this.handleClose(); this.handleClose();
return return
@ -172,6 +167,10 @@ export default {
} else { } else {
this.loadFile(); this.loadFile();
} }
}).catch(_ => {
this.loadError = true
}).finally(_ => {
this.loading = false
}) })
}, },
immediate: true, immediate: true,

45
resources/assets/js/components/PreviewImage/components/swipe.vue
View File

@ -79,33 +79,32 @@ export default {
showHideAnimationType: 'none', showHideAnimationType: 'none',
pswpModule: () => import('photoswipe'), pswpModule: () => import('photoswipe'),
}); });
this.lightbox.on('change', () => { this.lightbox.on('change', _ => {
if (htmlZoom) { if (!htmlZoom) {
$A.loadScript('js/pinch-zoom.umd.min.js', _ => { return;
if (PinchZoom !== 'object') { }
const swiperItems = document.querySelector(`.${this.className}`).querySelectorAll(".preview-image-swipe") $A.loadScript('js/pinch-zoom.umd.min.js').then(_ => {
swiperItems.forEach(swipeItem => { const swiperItems = document.querySelector(`.${this.className}`).querySelectorAll(".preview-image-swipe")
if (swipeItem.getAttribute("data-init-pinch-zoom") !== "init") { swiperItems.forEach(swipeItem => {
swipeItem.setAttribute("data-init-pinch-zoom", "init") if (swipeItem.getAttribute("data-init-pinch-zoom") !== "init") {
swipeItem.querySelector("img").addEventListener("pointermove", e => { swipeItem.setAttribute("data-init-pinch-zoom", "init")
if (dragIng) { swipeItem.querySelector("img").addEventListener("pointermove", e => {
e.stopPropagation(); if (dragIng) {
} e.stopPropagation();
}) }
new PinchZoom.default(swipeItem, { })
draggableUnzoomed: false, new PinchZoom.default(swipeItem, {
onDragStart: () => { draggableUnzoomed: false,
dragIng = true; onDragStart: () => {
}, dragIng = true;
onDragEnd: () => { },
dragIng = false; onDragEnd: () => {
} dragIng = false;
})
} }
}) })
} }
}) })
} })
}); });
this.lightbox.on('close', () => { this.lightbox.on('close', () => {
this.$emit("on-close") this.$emit("on-close")

213
resources/assets/js/functions/common.js vendored
View File

@ -906,110 +906,137 @@ const localforage = require("localforage");
/** /**
* 动态加载js文件 * 动态加载js文件
* @param url * @param url
* @param callback * @returns {Promise<unknown>}
*/ */
loadScript(url, callback) { loadScript(url) {
url = $A.originUrl(url); return new Promise(async (resolve, reject) => {
if (this.rightExists(url, '.css')) { url = $A.originUrl(url)
this.loadCss(url, callback) if (this.rightExists(url, '.css')) {
return; return resolve(this.loadCss(url))
}
if (this.__loadScript[url] === true) {
typeof callback === "function" && callback(null);
return;
}
let script = document.createElement("script");
script.type = "text/javascript";
if (script.readyState) {
script.onreadystatechange = () => {
if (script.readyState === "loaded" || script.readyState === "complete") {
script.onreadystatechange = null;
this.__loadScript[url] = true;
typeof callback === "function" && callback(null);
}
};
} else {
script.onload = () => {
this.__loadScript[url] = true;
typeof callback === "function" && callback(null);
};
script.onerror = (e) => {
typeof callback === "function" && callback(e);
};
}
if (this.rightExists(url, '.js')) {
script.src = url + "?hash=" + window.systemInfo.version;
} else {
script.src = url;
}
document.body.appendChild(script);
},
loadScriptS(urls, callback) {
let i = 0;
let recursiveCallback = () => {
if (++i < urls.length) {
this.loadScript(urls[i], recursiveCallback)
} else {
typeof callback === "function" && callback(null);
} }
} //
this.loadScript(urls[0], recursiveCallback); let i = 0
while (this.__loadScript[url] === "loading") {
await new Promise(r => setTimeout(r, 1000))
i++
if (i > 30) {
return reject("加载超时")
}
}
if (this.__loadScript[url] === "loaded") {
return resolve(false)
}
this.__loadScript[url] = "loading"
//
const script = document.createElement("script")
script.type = "text/javascript"
if (script.readyState) {
script.onreadystatechange = () => {
if (script.readyState === "loaded" || script.readyState === "complete") {
script.onreadystatechange = null
this.__loadScript[url] = "loaded"
resolve(true)
}
}
} else {
script.onload = () => {
this.__loadScript[url] = "loaded"
resolve(true)
}
script.onerror = (e) => {
this.__loadScript[url] = "error"
reject(e)
}
}
if (this.rightExists(url, '.js')) {
script.src = url + "?hash=" + window.systemInfo.version
} else {
script.src = url
}
document.body.appendChild(script)
})
},
loadScriptS(urls) {
return new Promise(resolve => {
let i = 0
const recursiveCallback = () => {
if (++i < urls.length) {
this.loadScript(urls[i]).finally(recursiveCallback)
} else {
resolve()
}
}
this.loadScript(urls[0]).finally(recursiveCallback)
})
}, },
__loadScript: {}, __loadScript: {},
/** /**
* 动态加载css * 动态加载css文件
* @param url * @param url
* @param callback * @returns {Promise<unknown>}
*/ */
loadCss(url, callback) { loadCss(url) {
url = $A.originUrl(url); return new Promise(async (resolve, reject) => {
if (this.rightExists(url, '.js')) { url = $A.originUrl(url)
this.loadScript(url, callback) if (this.rightExists(url, '.js')) {
return; return resolve(this.loadScript(url))
} }
if (this.__loadCss[url] === true) { //
typeof callback === "function" && callback(null); let i = 0
return; while (this.__loadCss[url] === "loading") {
} await new Promise(r => setTimeout(r, 1000))
let script = document.createElement('link'); i++
if (script.readyState) { if (i > 30) {
script.onreadystatechange = () => { return reject("加载超时")
if (script.readyState == 'loaded' || script.readyState == 'complete') { }
script.onreadystatechange = null; }
this.__loadCss[url] = true; if (this.__loadCss[url] === "loaded") {
typeof callback === "function" && callback(null); return resolve(false)
}
this.__loadCss[url] = "loading"
//
const script = document.createElement('link')
if (script.readyState) {
script.onreadystatechange = () => {
if (script.readyState == 'loaded' || script.readyState == 'complete') {
script.onreadystatechange = null
this.__loadCss[url] = "loaded"
resolve(true)
}
}
} else {
script.onload = () => {
this.__loadCss[url] = "loaded"
resolve(true)
} }
}; script.onerror = (e) => {
} else { this.__loadCss[url] = "error"
script.onload = () => { reject(e)
this.__loadCss[url] = true; }
typeof callback === "function" && callback(null);
};
script.onerror = (e) => {
typeof callback === "function" && callback(e);
};
}
script.rel = 'stylesheet';
if (this.rightExists(url, '.css')) {
script.href = url + "?hash=" + window.systemInfo.version;
} else {
script.href = url;
}
document.getElementsByTagName('head').item(0).appendChild(script);
},
loadCssS(urls, callback) {
let i = 0;
let recursiveCallback = () => {
if (++i < urls.length) {
this.loadCss(urls[i], recursiveCallback)
} else {
typeof callback === "function" && callback(null);
} }
} script.rel = 'stylesheet'
this.loadCss(urls[0], recursiveCallback); if (this.rightExists(url, '.css')) {
script.href = url + "?hash=" + window.systemInfo.version
} else {
script.href = url
}
document.getElementsByTagName('head').item(0).appendChild(script)
})
},
loadCssS(urls) {
return new Promise(resolve => {
let i = 0
const recursiveCallback = () => {
if (++i < urls.length) {
this.loadCss(urls[i]).finally(recursiveCallback)
} else {
resolve()
}
}
this.loadCss(urls[0]).finally(recursiveCallback)
})
}, },
__loadCss: {}, __loadCss: {},

2
resources/assets/js/pages/manage/components/ChatInput/emoji.vue
View File

@ -114,7 +114,7 @@ export default {
$A.loadScriptS([ $A.loadScriptS([
'js/emoji.all.js', 'js/emoji.all.js',
'js/emoticon.all.js', 'js/emoticon.all.js',
], _ => { ]).then(_ => {
const baseUrl = $A.apiUrl("../images/emoticon") const baseUrl = $A.apiUrl("../images/emoticon")
if ($A.isArray(window.emojiData)) { if ($A.isArray(window.emojiData)) {
this.emojiData = window.emojiData.sort(function (a, b) { this.emojiData = window.emojiData.sort(function (a, b) {

4
resources/assets/js/pages/manage/components/ChatInput/index.vue
View File

@ -721,8 +721,8 @@ export default {
'js/recorder/recorder.mp3.min.js', 'js/recorder/recorder.mp3.min.js',
'js/recorder/lib.fft.js', 'js/recorder/lib.fft.js',
'js/recorder/frequency.histogram.view.js', 'js/recorder/frequency.histogram.view.js',
], (e) => { ]).then(_ => {
if (e !== null || typeof window.Recorder !== 'function') { if (typeof window.Recorder !== 'function') {
return; return;
} }
this.recordRec = window.Recorder({ this.recordRec = window.Recorder({

8
resources/assets/js/store/actions.js vendored
View File

@ -95,12 +95,12 @@ export default {
}) })
// 加载语言包 // 加载语言包
$A.loadScriptS([ await $A.loadScriptS([
`language/web/key.js`, `language/web/key.js`,
`language/web/${languageType}.js`, `language/web/${languageType}.js`,
], _ => { ])
resolve(action)
}); resolve(action)
}) })
}, },