Browse Source

⚡️ perf(progress): 优化编译进度跟踪算法

- 调整保守估计值计算方式,将baseEstimate+8→+10,基准值12→15
- 修改服务端活动超时检测时间,从2秒延长至3秒,提高大型项目检测准确性
- 简化完成条件检查逻辑,移除动态检查间隔,采用固定5秒循环检查
- 优化资源总数预估算法,当完成90%资源时开始动态调整总数
- 调整进度完成检测阈值,从85%提高至90%开始触发完成检查
- 优化超时强制完成逻辑,设置10秒超时上限,避免无限等待
- 移除大量调试日志,减少控制台输出干扰
yourname 7 months ago
parent
commit
afea617268
1 changed files with 28 additions and 107 deletions
  1. 28 107
      vite-plugin-compile-progress.js

+ 28 - 107
vite-plugin-compile-progress.js

@@ -114,7 +114,7 @@ export function progressTrackingPlugin() {
                     const preloadLinks = document.querySelectorAll('link[rel="preload"], link[rel="modulepreload"]').length;  
                       
                     const baseEstimate = scripts + links + styleSheets + preloadLinks;  
-                    const conservativeEstimate = Math.max(baseEstimate + 8, 12);  
+                    const conservativeEstimate = Math.max(baseEstimate + 10, 15);  
                       
                     return conservativeEstimate;  
                   }  
@@ -124,17 +124,16 @@ export function progressTrackingPlugin() {
                     hasServerActivity = true;  
                     if (serverActivityTimer) clearTimeout(serverActivityTimer);  
                       
-                    // 如果2秒内没有新的服务端活动,认为服务端编译已完成或无需编译  
+                    // 如果3秒内没有新的服务端活动,认为服务端编译已完成或无需编译  
                     serverActivityTimer = setTimeout(() => {  
                       if (serverProgress === 0) {  
                         console.log('No server compilation detected - using client-only mode');  
                         hasServerActivity = false;  
-                        updateProgress();  
                       }  
-                    }, 2000);  
+                    }, 3000);  
                   }  
   
-                  // 在 checkCompletion 函数中进一步优化完成条件  
+                  // 检测是否完成加载  
                   function checkCompletion() {  
                     const now = Date.now();  
                     const timeSinceLastResource = now - lastResourceTime;  
@@ -156,105 +155,32 @@ export function progressTrackingPlugin() {
                       
                     // 根据服务端活动情况调整完成条件  
                     if (!hasServerActivity) {  
-                      console.log('Checking client-only completion conditions...');  
-                        
-                      // 客户端模式下的完成条件更加宽松  
-                      if (resourcesCompleted >= estimatedTotal * 0.8 && timeSinceLastResource > 1000) {  
-                        console.log('✅ Client-only loading complete (80% threshold)');  
-                        forceComplete();  
-                        return;  
-                      }  
-                        
-                      // 如果进度超过95%且1秒无新资源,立即完成  
-                      if (resourcesCompleted >= estimatedTotal * 0.95 && timeSinceLastResource > 1000) {  
-                        console.log('✅ Client-only loading complete (95% threshold)');  
-                        forceComplete();  
-                        return;  
-                      }  
-                        
-                      // 如果进度超过97%且0.5秒无新资源,立即完成  
-                      if (resourcesCompleted >= estimatedTotal * 0.97 && timeSinceLastResource > 500) {  
-                        console.log('✅ Client-only loading complete (97% threshold)');  
+                      // 无服务端编译时,主要依赖客户端资源  
+                      if (resourcesCompleted >= estimatedTotal * 0.8 && timeSinceLastResource > 2000) {  
+                        console.log('Client-only loading complete');  
                         forceComplete();  
                         return;  
                       }  
-                        
-                      console.log('❌ Client-only conditions not met');  
                     } else {  
-                      console.log('Checking mixed mode completion conditions...');  
-                        
-                      // 有服务端编译时的完成条件 - 添加多个完成条件  
-                      if (serverProgress >= 1.0 && timeSinceLastResource > 1500) {  
-                        console.log('✅ Server + client loading complete (1.5s timeout)');  
+                      // 有服务端编译时,需要服务端完成  
+                      if (serverProgress >= 1.0 && timeSinceLastResource > 2000) {  
+                        console.log('Server + client loading complete');  
                         forceComplete();  
                         return;  
                       }  
-                        
-                      // 添加基于资源完成度的提前完成条件  
-                      if (serverProgress >= 1.0 && resourcesCompleted >= estimatedTotal * 0.95 && timeSinceLastResource > 800) {  
-                        console.log('✅ Server + client loading complete (95% resources + 0.8s)');  
-                        forceComplete();  
-                        return;  
-                      }  
-                        
-                      // 如果服务端完成且资源接近完成,更短的等待时间  
-                      if (serverProgress >= 1.0 && resourcesCompleted >= estimatedTotal * 0.98 && timeSinceLastResource > 600) {  
-                        console.log('✅ Server + client loading complete (98% resources + 0.6s)');  
-                        forceComplete();  
-                        return;  
-                      }  
-                        
-                      console.log('❌ Mixed mode conditions not met');  
-                      console.log('serverProgress >= 1.0:', serverProgress >= 1.0);  
-                      console.log('timeSinceLastResource > 1500:', timeSinceLastResource > 1500);  
-                      console.log('resourcesCompleted >= estimatedTotal * 0.95:', resourcesCompleted >= estimatedTotal * 0.95);  
                     }  
                       
-                    // 超时强制完成 - 进一步缩短超时时间  
-                    if (timeSinceLastResource > 2000) {  
-                      console.log('Force completing due to timeout (2s)');  
+                    // 超时强制完成  
+                    if (timeSinceLastResource > 1000 * 10) {  
+                      console.log('Force completing due to timeout');  
                       forceComplete();  
-                      return;  
                     }  
-                      
-                    // 关键修复:如果条件未满足,重新调度检查  
-                    // 根据当前状态动态计算下次检查的时间间隔  
-                    let nextCheckDelay;  
-                      
-                    if (hasServerActivity && serverProgress >= 1.0) {  
-                      // 服务端已完成,更频繁地检查  
-                      const remainingTimeFor1500 = Math.max(1500 - timeSinceLastResource, 0);  
-                      const remainingTimeFor800 = Math.max(800 - timeSinceLastResource, 0);  
-                        
-                      if (resourcesCompleted >= estimatedTotal * 0.95) {  
-                        nextCheckDelay = Math.max(remainingTimeFor800, 200);  
-                      } else {  
-                        nextCheckDelay = Math.max(remainingTimeFor1500, 300);  
-                      }  
-                    } else if (!hasServerActivity) {  
-                      // 客户端模式,根据资源完成度调整检查频率  
-                      if (resourcesCompleted >= estimatedTotal * 0.97) {  
-                        nextCheckDelay = Math.max(500 - timeSinceLastResource, 200);  
-                      } else if (resourcesCompleted >= estimatedTotal * 0.95) {  
-                        nextCheckDelay = Math.max(1000 - timeSinceLastResource, 300);  
-                      } else {  
-                        nextCheckDelay = Math.max(1000 - timeSinceLastResource, 500);  
-                      }  
-                    } else {  
-                      // 服务端还在处理中,较长的检查间隔  
-                      nextCheckDelay = 500;  
-                    }  
-                      
-                    // 确保最小检查间隔  
-                    nextCheckDelay = Math.max(nextCheckDelay, 200);  
-                      
-                    console.log('⏳ Rescheduling completion check in:', nextCheckDelay, 'ms');  
-                    console.log('=== End checkCompletion Debug ===');  
-                      
-                    // 重新调度下次检查  
-                    if (completionTimer) clearTimeout(completionTimer);  
-                    completionTimer = setTimeout(checkCompletion, nextCheckDelay);  
-                  }
+
+                    // 如果仍在加载中,且未触发超时强制完成,则500ms后再次检查
+                    if (isLoading && timeSinceLastResource <= 1000 * 10) {
+                      setTimeout(checkCompletion, 1000 * 5); // 循环检查
+                    }
+                  }  
   
                   // 强制完成  
                   function forceComplete() {  
@@ -315,9 +241,9 @@ export function progressTrackingPlugin() {
                     console.log(\`Progress: Total \${Math.round(totalProgress)}%\`);  
                       
                     // 如果接近完成,开始检测完成状态  
-                    if (totalProgress >= 85) {  
+                    if (totalProgress >= 90) {  
                       if (completionTimer) clearTimeout(completionTimer);  
-                      completionTimer = setTimeout(checkCompletion, 800);  
+                      completionTimer = setTimeout(checkCompletion, 1000);  
                     }  
                   }  
   
@@ -348,9 +274,9 @@ export function progressTrackingPlugin() {
                             resourcesCompleted++;  
                             lastResourceTime = Date.now();  
                               
-                            // 更保守的总数调整策略  
-                            if (resourcesCompleted > estimatedTotal * 0.95) {  
-                              estimatedTotal = Math.max(estimatedTotal, resourcesCompleted + 1);  
+                            // 动态调整预估总数  
+                            if (resourcesCompleted > estimatedTotal * 0.9) {  
+                              estimatedTotal = Math.max(estimatedTotal, resourcesCompleted + 3);  
                             }  
                               
                             console.log(\`Resource completed: \${entry.name} (type: \${entry.initiatorType})\`);  
@@ -390,19 +316,14 @@ export function progressTrackingPlugin() {
                   function handlePageLoad() {  
                     setTimeout(() => {  
                       if (resourcesCompleted > 0) {  
-                        estimatedTotal = Math.max(resourcesCompleted + 1, estimatedTotal);  
+                        estimatedTotal = Math.max(resourcesCompleted + 2, estimatedTotal);  
                         console.log(\`Final estimated total: \${estimatedTotal}\`);  
                       }  
                       updateProgress();  
                         
-                      // 页面加载完成后,更积极地检测完成状态  
-                      setTimeout(() => {  
-                        if (isLoading && resourcesCompleted >= estimatedTotal * 0.8) {  
-                          console.log('Page load complete, forcing finish');  
-                          forceComplete();  
-                        }  
-                      }, 1000);  
-                    }, 500);  
+                      // 开始完成检测  
+                      setTimeout(checkCompletion, 2000);  
+                    }, 1000);  
                   }  
   
                   // 根据文档状态初始化