2014-10-08 76 views
4

在我們的MVC5項目中,有一個頁面,用戶可以在其中檢查多個資產。 每個資產都由複選框和名稱代表。當有很多輸入時,Chrome瀏覽器很慢

當有大量的資產(約800-1000)的Chrome變得極其緩慢。甚至有時會顯示消息「頁面不負責任」。

看起來像這樣: - 頁面被部分呈現並被複制到帶有複選框的DIV - 然後有30-40-50秒的延遲。有時,錯誤消息 - 與複選框DIV提供,而該頁面的其餘部分呈現過

在FF和IE瀏覽它的確定。

在此先感謝

我同意,這不是一個很好的用戶體驗,但在目前階段,我需要解決這個問題。 這裏是標記(這個div是4級嵌套):

<div class="list"> 
     @for (int i = 0; i < Model.Items.Count; i++) 
     { 
      <text> 
       @{var cid = Guid.NewGuid().ToString();} 
       @Html.HiddenFor(m => Model.Items[i].Id) 
       @Html.CheckBoxFor(m => Model.Items[i].Selected, new { id = cid }) 
       <label for="@cid">@Trakopolis.WebSite.AppHelper.GetLocalizedString(Model.Items[i].Name)</label><br /> 
      </text> 
     } 
    </div> 
+0

「有時會出現錯誤信息」 - 謹慎詳細說明? – 2014-10-08 10:29:20

+0

每種資產的標記開銷有多大? Chrome應該可以處理1000個複選框,但如果每個複選框都嵌套在4級深度的表格中,那麼標記可能會變得非常大,非常快。您可能還想要分頁資產列表。如果在某個時候會有5000個資產會怎樣?將所有內容放在一個頁面上並不能很好地擴展。 – HaukurHaf 2014-10-08 10:31:25

+0

請分享您的代碼(HTML渲染和/或剃刀)如何複選框創建或呈現 – Pete 2014-10-08 10:32:57

回答

0

看起來Chrome中無法使用關閉標籤複選框下拉標記並<br>以某種方式迫使更多的瀏覽器內部的檢查和結果緩慢的頁面呈現在比較到IE和FF瀏覽器(使用結束標籤)。爲了避免Chrome的加載速度慢,因爲<br />標籤你可以使用開閉<div>反而加快頁面了一點,但我不知道是否<input>元素可以被莫名其妙地更換。

1

與Safari相同的問題,我懷疑是一個webkit的bug。任何包含數百或數千個輸入字段的頁面將非常緩慢地導航或編輯。

Why does Safari Mobile have trouble handling many input fields on iOS 8

我們有一個網頁有300行的一些表格,每排有幾個細胞,每個單元格是可編輯的(輸入)。上面給出的鏈接

解決方法很好地工作。

1

你可以嘗試使用JavaScript來實現這一切,其中一切都是純文本的數據屬性和點擊,輸入元素臨時添加,輸入元素接受輸入,將其發送到服務器(或將其保存在indexeddb中使用服務工作者的異步),並刪除自己或等待下一個輸入。

<td id=「unique-id1」 data-url=「/action」 data-name=「InputName」>data</td> 
相關問題