如何使用網頁加載指示燈/進度條在MVC

這裏是我的模型：如何使用網頁加載指示燈/進度條在MVC

public class Pitchermodels 
{ 
InsideEdEntities ieEntity = new InsideEdEntities(); 
PitcherProfileEntities ppEntity = new PitcherProfileEntities(); 

Pitcher5model p5Mod = new Pitcher5model(); 
Pitcher6model p6Mod = new Pitcher6model(); 

public Pitcher5model pitcher5(long? _pid) 
    { 
     if (p5Mod.exist(_pid) == true) 
     { 
      p5Mod.playerinfo = ieEntity.ppsproc_playerinfo(_pid).FirstOrDefault(); 
      p5Mod.ListP5T1 = ppEntity.ppsproc_newP5_T1(_pid).ToList(); 
      p5Mod.ListP5T2 = ppEntity.ppsproc_P5_T2(_pid).ToList(); 
      return p5Mod; 
     } 
     else 
     { 
      return null; 
     } 
    } 

public Pitcher6model pitcher6(long? _pid) 
    { 
     if (p6Mod.exist(_pid) == true) 
     { 
      p6Mod.playerinfo = ieEntity.ppsproc_playerinfo(_pid).FirstOrDefault(); 
      p6Mod.ListP6T1 = ppEntity.ppsproc_P6(_pid).ToList(); 
      return p6Mod; 
     } 
     else 
     { 
      return null; 
     } 
    } 
}

這裏是我的控制器：

public ActionResult AllPitchers(long? _pid) 
    { 
     Pitchermodels pMods = new Pitchermodels(); 
     return View(pMods); 
    }

這是我的觀點：

@model MVCdodgersplayerinfohub.Models.Pitchermodels 
@{ 
    Layout = null; 
} 
<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="width=device-width" /> 
<title>All Pitcher Reports</title> 
<link href="~/LA.ico" rel="shortcut icon" type="image/x-icon" /> 

</head> 
<body> 
    <div> 
     @Html.Partial("Pitcher5",Model.pitcher5(Convert.ToInt32(Request.QueryString["_pid"]))) 
    </div> 
    <p style="page-break-before:always;"></p> 
    <div> 
     @Html.Partial("Pitcher6",Model.pitcher6(Convert.ToInt32(Request.QueryString["_pid"]))) 
    </div> 
</body> 
</html>

的一件不太好的事情是，加載時間可能需要2分鐘，而用戶覺得它可能不會加載（鼠標正在旋轉）。是否可以加入進度條？我認爲大多數用戶喜歡進度條，因爲至少他們知道它正在工作，並且需要多長時間。

來源

2013-09-27 rbs

還有，你需要了解瀏覽器如何工作的幾件事情：

如果打開一個網頁，什麼都不會顯示，直到連接被關閉。瀏覽器稍後解析圖像和其他內容，以便在初始頁面打開後打開
除非知道正在接收的數據的大小，否則無法確定打開頁面的當前狀態。爲此，頁面必須開始發送數據，並且您需要確切知道數據的大小。例如，文件具有數據的設置大小，因此您可以使用Javascript將進度條附加到它。所有數據都在服務器上處理，而瀏覽器仍在等待響應。
您需要在前端（html端）進行某種跟蹤。這意味着您至少需要擁有某種可打開頁面的基本shell，以便跟蹤事務。這可以通過使用AJAX加載網站部分並粗略估計打開所需的時間（並將其應用於與時間相關的進度欄）來完成。將進度條分解爲加載的段（即加載的1/4段，進度條是1/4）將在此設置中起作用。

我在這裏可以看到的真正問題是，您正在尋找一個快速解決方案，而不是試圖在房間裏拍攝大象。 2分鐘對於一個網站來說是一個非常長的加載時間，這意味着控制器中發生的事情正在控制這段時間。發送HTML所花費的時間在當今的互聯網中非常快，所以這不是問題的根源。以下是幾個可幫助您查找問題的步驟：

查看您的數據庫調用。你是否多次調用數據庫來獲取您可能已有的一段數據？
您正在加載的數據非常大。你是加載整個表格而不是僅僅是你需要的列嗎？你加入了非常大的桌子嗎？
如果這依賴說，一個文件來加載數據，有什麼別的使用該文件和程序正在等待訪問？
看看你的收藏。你是否分揀，再次分揀和整理？你是否在不同的集合類型之間轉換（即LinkedList到Array到List到其他）？如果你有很大的集合，你試圖通過C＃進行排序，你可以將它們排序到其他地方，比如在數據庫的查詢中？
在什麼情況下你的頁面變慢？儘管擁有相同數量的數據，頁面的打開速度會快得多嗎？如果是這樣，瓶頸可能發生在一個非常特定的地方。
你在慢速服務器上運行這個，即。在家？這可能會對性能產生巨大影響。

這些只是一些。 2分鐘的時間太長了，而且在您進一步開發網站時會變得更糟。對於簡單收集簡單數據的簡單網站，即使在忙碌的一天，您也沒有辦法達到2分鐘，而沒有任何潛在的問題。如果您的網站被大量使用並且代碼速度很慢，請查看最常見的代碼段並嘗試先優化它們;然後繼續優化其他較少使用的代碼段。

如果您在優化絕大多數網站後仍然遇到很多性能問題，請考慮在部分視圖中使用AJAX。雖然他們不會增加您的總體性能，但它可以讓您分段打開您的網站，提供更多的視覺反饋，告訴用戶網頁仍在加載。

來源

2013-09-27 06:12:46

是的。您可以使用等待彈出窗口來查看組件中的加載時間。例如。如果使用等待彈出組件，請調用.ajaxStart（）事件中的彈出窗口，並關閉AjaxComplete事件中的等待彈出窗口。

請檢查以下ajax事件以作進一步參考。

http://api.jquery.com/category/ajax/global-ajax-event-handlers/

來源

2013-09-27 06:16:49 RGR

如何使用網頁加載指示燈/進度條在MVC

回答

相關問題