StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I do not simulate so heavy page, but I have an other way to load page. Maybe, it can be a reference for you.</p> <ol> <li>Separate each page request at action side, and return for only one page content.</li> <li>Collect "style" content to css class, to reduce page content.</li> <li>Improve performance of LINQ with PLINQ.</li> </ol> <p>I notice the code output every page content.</p> <pre><code>var queries = from n in db.vwGood select n; long counter = 0; for (int i = 1; i <= iPage; i++) { foreach (var q in queries) { counter++; } } </code></pre> <p>I suggest you can </p> <ol> <li>modify LINQ with Paging function.</li> <li>Update LINQ as PLINQ to improve performance. I add AsParallel() after db.vwGood, I am not sure what db.vwGood instance and wish this modify can be good.</li> <li>Not return HTML content in Razor View, but in Action.</li> </ol> <p>Pseudo code of Action is as below,</p> <pre><code>// iAmount is record amount in each page. int iAmount = 50; // queries is only the iPage content // but not all of content from page one to page iPage. var queries = (from n in db.vwGood.AsParallel() select n) .Skip(iPage - 1).Take(iAmount); long counter = 0; string strContent = string.Empty; foreach (var q in queries) { counter++; // Generate Cotnent here. strContent += @"<li class='YourClassName'><p>@counter</p></li>" } return Content(strContent) </code></pre> <p>When ShowMore button is clicked, ShowMore_OnClick() is performanced.</p> <pre><code><input type="button" style="width: 100%" id="BtnShowMore" value="MORE" onclick="return ShowMore_OnClick();" /> </code></pre> <p>This is JavaScript for Loading function. I notice you do not use button to control content display, but scrollPagination. You can modify the JavaScript to suit with scrollPagination plugin. The thinking of code structure is same.</p> <pre><code> var PageNO = 1; function ShowMore_OnClick() { var BtnShowMore = document.getElementById("BtnShowMore"); BtnShowMore.value = "Loading..."; jQuery.post( "/Home/GetHomeEventAjax/", { "PageNO": PageNO + 1 }, function (data, states) { if (states == "success") { var EventListArea = document.getElementById("EventListArea"); var newCommentItem = document.createElement("DIV"); newCommentItem.setAttribute("ID", "EventItem"); newCommentItem.innerHTML = data; EventListArea.appendChild(newCommentItem); PageNO = PageNO + 1; BtnShowMore.value = "More"; } } ); } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload