优化首次载入流程

2026-09-08 17:26:41 +08:00 · 2023-09-19 13:57:37 +08:00
parent b1635b0715
commit e5b836462f
2 changed files with 118 additions and 108 deletions
@@ -30,7 +30,6 @@
 </head>

 <body>
-  <div id="app">
  <div id="loading-bg">
    <div class="loading-logo">
      <!-- Logo -->
@@ -145,6 +144,7 @@
      <div class="effect-3 effects"></div>
    </div>
  </div>
+  <div id="app">
  </div>
  <script type="module" src="/src/main.ts"></script>
  <script>
@@ -43,6 +43,16 @@ router.beforeEach((to, from, next) => {
  }
 })

-router.afterEach((to) => {
+// 记录首次开启app
+let isFirstApp: Boolean = true
+router.afterEach(() => {
  doneNProgress()
+  if (isFirstApp) {
+    // 标记首次载入完成, 再隐藏loading页面, 让首次载入更加丝滑
+    isFirstApp = false
+    const loading_bg = document.getElementById('loading-bg')
+    if (loading_bg)
+      // 或许这里需要再多加一点延迟才能改善ios的bug
+      document.body.removeChild(loading_bg)
+  }
 })