perf: 优化客户端加载

This commit is contained in:
kuaifan 2024-12-18 15:23:25 +08:00
parent e541757b76
commit 95ab44d118
4 changed files with 81 additions and 60 deletions

View File

@ -434,7 +434,7 @@ function createChildWindow(args) {
if (/^https?:/i.test(hash)) {
browser.loadURL(hash).then(_ => { }).catch(_ => { })
} else if (isPreload) {
browser.webContents.executeJavaScript(`if(typeof $A.goForward === 'function'){$A.goForward('${hash}')}else{throw new Error('no function')}`, true).catch(() => {
browser.webContents.executeJavaScript(`if(typeof window.__initializeApp === 'function'){window.__initializeApp('${hash}')}else{throw new Error('no function')}`, true).catch(() => {
utils.loadUrlOrFile(browser, devloadUrl, hash)
});
} else {

View File

@ -82,19 +82,11 @@ export default {
},
mounted() {
window.addEventListener('resize', this.windowSizeListener)
window.addEventListener('scroll', this.windowScrollListener)
window.addEventListener('message', this.windowHandleMessage)
window.addEventListener('fullscreenchange', this.handleFullscreenchange);
this.appInter = setInterval(this.appTimerHandler, 1000)
$A.loadVConsole()
},
beforeDestroy() {
window.removeEventListener('resize', this.windowSizeListener)
window.removeEventListener('scroll', this.windowScrollListener)
window.removeEventListener('message', this.windowHandleMessage)
window.removeEventListener('fullscreenchange', this.handleFullscreenchange);
this.appInter && clearInterval(this.appInter)
},
@ -250,59 +242,10 @@ export default {
}
},
windowSizeListener() {
const windowWidth = $A(window).width(),
windowHeight = $A(window).height(),
windowOrientation = $A.screenOrientation()
this.$store.state.windowTouch = "ontouchend" in document
this.$store.state.windowWidth = windowWidth
this.$store.state.windowHeight = windowHeight
this.$store.state.windowOrientation = windowOrientation
this.$store.state.windowLandscape = windowOrientation === 'landscape'
this.$store.state.windowPortrait = windowOrientation === 'portrait'
this.$store.state.formOptions = {
class: windowWidth > 576 ? '' : 'form-label-weight-bold',
labelPosition: windowWidth > 576 ? 'right' : 'top',
labelWidth: windowWidth > 576 ? 'auto' : '',
}
$A.eeuiAppSendMessage({
action: 'windowSize',
width: windowWidth,
height: windowHeight,
});
},
windowScrollListener() {
this.$store.state.windowScrollY = window.scrollY
},
windowHandleMessage({data}) {
data = $A.jsonParse(data);
if (data.action === 'eeuiAppSendMessage') {
const items = $A.isArray(data.data) ? data.data : [data.data];
items.forEach(item => {
$A.eeuiAppSendMessage(item);
})
}
},
onRouterViewMounted() {
document.documentElement.setAttribute("data-platform", $A.isElectron ? "desktop" : $A.isEEUiApp ? "app" : "web")
},
handleFullscreenchange() {
if (document.fullscreenElement) {
$A("body").addClass("fullscreen-mode")
} else {
$A("body").removeClass("fullscreen-mode")
}
},
/**
* 获取链接打开方式
* @param url

View File

@ -263,7 +263,8 @@ Vue.config.productionTip = false;
Vue.mixin(mixin)
let app;
store.dispatch("init").then(action => {
const $init = async () => {
const action = await store.dispatch("init");
microappInit();
@ -287,4 +288,26 @@ store.dispatch("init").then(action => {
if (typeof window.LANGUAGE_DATA[`i_${languageName}`] !== "undefined") {
ViewUI.locale(window.LANGUAGE_DATA[`i_${languageName}`]);
}
})
}
const $preload = async () => {
await store.dispatch("preload");
const currentPath = (window.location.pathname || window.location.hash).replace(/^[#\/]/, '');
if (currentPath !== 'preload') {
$init().catch(_ => {})
return
}
window.__initializeApp = (route) => {
if (/^https?:\/\//.test(route)) {
if ($A.getDomain(route) !== $A.getDomain($A.mainUrl())) {
window.location.href = url;
return;
}
route = route.replace(/^https?:\/\/[^\/]+/, '');
}
window.history.replaceState(null, '', route)
$init().catch(_ => {})
}
}
$preload().catch(_ => {})

View File

@ -4,6 +4,61 @@ import {$callData, $urlSafe, SSEClient} from './utils'
import emitter from "./events";
export default {
/**
* 预加载
* @param state
*/
preload({state}) {
window.addEventListener('resize', () => {
const windowWidth = $A(window).width(),
windowHeight = $A(window).height(),
windowOrientation = $A.screenOrientation()
state.windowTouch = "ontouchend" in document
state.windowWidth = windowWidth
state.windowHeight = windowHeight
state.windowOrientation = windowOrientation
state.windowLandscape = windowOrientation === 'landscape'
state.windowPortrait = windowOrientation === 'portrait'
state.formOptions = {
class: windowWidth > 576 ? '' : 'form-label-weight-bold',
labelPosition: windowWidth > 576 ? 'right' : 'top',
labelWidth: windowWidth > 576 ? 'auto' : '',
}
$A.eeuiAppSendMessage({
action: 'windowSize',
width: windowWidth,
height: windowHeight,
});
})
window.addEventListener('scroll', () => {
state.windowScrollY = window.scrollY
})
window.addEventListener('message', ({data}) => {
data = $A.jsonParse(data);
if (data.action === 'eeuiAppSendMessage') {
const items = $A.isArray(data.data) ? data.data : [data.data];
items.forEach(item => {
$A.eeuiAppSendMessage(item);
})
}
})
window.addEventListener('fullscreenchange', () => {
if (document.fullscreenElement) {
$A("body").addClass("fullscreen-mode")
} else {
$A("body").removeClass("fullscreen-mode")
}
});
},
/**
* 初始化
* @param state