如何提升大数据量页面的加载速度？

[Mark2Win]

大家好,现有一报表需要加载（报表用table控件呈现），大概有10k行，现加载这个页面需要20s左右，请问：

不考虑前后台种种优化，不用分页，如何实现 一点击报表加载按钮，报表逐(n)行显示出来？有没有好的解决方案？

[beckylds]

我记得好像在起点碰到过这个功能。
在阅读当前小说得时候有个 阅读全部的按钮。
应该是一样的功能

[7仔]

这种用法是最快的:

1.
在工程中添加一个这个文件BaoBiaoHandler.ashx;
然后把按钮的链接指向这个文件；在这个文件中你就可以随便的写了；这个文件之所以快的原因是因为它本身就是一个http处理程序，并且它不要状态保存等一些操作，是一个直接执行的文件，类似于java中的serlvet文件。

它的写法和普通的cs文件没什么区别；一样的。

你要生成报表
context.Response.ContentType = "image/jpeg";这个属性是必须；
FileStream fs = File.Open(context.Request.PhysicalApplicationPath + "d6dd57088b97b79e0b7b821e.gif", FileMode.Open);

byte[] fsBuffer = new byte[fs.Length];
int i = fs.Read(fsBuffer, 0, fsBuffer.Length);
fs.Close();

context.Response.WriteFile(context.Request.PhysicalApplicationPath + "d6dd57088b97b79e0b7b821e.gif"); //.BinaryWrite(fsBuffer); //.OutputStream.Write(fsBuffer, 0, count);
context.Response.Flush();
这个是生成一个图片；你可以修改成你的需要。

2.
你也可以这样，写一个cs文件继承自IHttpHandler接口，实现一个自己的Http处理程序，
public class Httphandler : IHttpHandler
{
public Httphandler()
{

}

#region IHttpHandler 成员

bool IHttpHandler.IsReusable
{
get { return true; }
}

void IHttpHandler.ProcessRequest(HttpContext context)
{


System.Data.SqlClient.SqlDataAdapter adp = new System.Data.SqlClient.SqlDataAdapter(SqlString,Conn);
DataSet ds = new DataSet();
adp.Fill(ds);
DataGrid dg = new DataGrid();
dg.DataSource = ds.Tables[0];
dg.DataBind();
StringWriter sw=new StringWriter ();
HtmlTextWriter htw=new HtmlTextWriter (sw);
dg .RenderControl (htw);
string html = sw.ToString();
context.Response.Write(html);
}

#endregion
}
}
也可以，然后你要在web.config文件中注册以下这个
<httpHandlers>
<add verb ="*" path ="*.sqlx" type="Httphandler"/>//这个cs文件放在App_Code中
</httpHandlers>
然后再IIS中添加一个isapi映射，对这个sqlx的请求都会使用这个类来返回了，非常快；
扩展名可以随便定义的

[熊孩子开学喽]

不考虑前后台种种优化，不用分页，如何实现 一点击报表加载按钮，报表逐(n)行显示出来？有没有好的解决方案？

你都把"好的解决方案"统统否决了.

那就只能硬来了,你升级服务器,升级网络,升级客户机吧.

[b哈利路亚d]

这种数据量只能考虑数据库分页了
给你个提示，传入数据库页码和页面条数，数据库只返回相应条数的数据
即传说中的后台分页，这样别管你数据nnnnk条，都很快。
相应的控件网上有很多，开源的也有，可以自己看看。

[jtg98g3]

不要一次显示一万行，一次显示n行，当滑条滑到当前显示的行的时候，你的程序在从数据库读取数据显示给用户看。

[bwangel]

很显然，应该导出为Excel. 10K行在Excel看是小Case啦

[vrhero]

[Quote=引用 55 楼 jason1019 的回复:]
我觉得客户无非就是要有一个良好的体验，既然有这样的要求，用Ajax就是较好的选择，这样就不会让界面堵死在那里，至于javascript的执行效率问题，相对于对数据库的查询时间来说，可以忽略。
[/Quote]
1页10K行数据无论如何都不能叫“良好的体验”...人是会疲劳的...无论是大脑还是眼睛...
所有试图以技术解决此需求的努力都是在自讨苦吃...

[程序可以让尸体动起来]

无用功能，改一下：用户点击报表后，直接提示：“系统正在导出excel文件，需要花费一定时间” 给他倒个excel就可以了。剩下的交给客户对10k条数据 进行分析。否则谁有空 拖滚动条浏览10k条记录？

[-布谷鸟-]

BT的需求总会有的,就象有些需求是无聊的一样.但却给技术实现提出挑战.
我最近也在琢磨一个大表的显示,但还没有BT到10K行.以下是我的实现思路,不知能否对楼主起点作用?

Javascript+DHTML:

1,将表格中内容生成为Array数据;
2,建立表格对象,将Array数据分布在表格中;
3,尽量用table的属性来风格化表格,不要用CSS;
4,也许用户还有更BT的打印需求,用其它方式可能不能满足;


告诉用户,10K行数据,不是1K行数据,总要花些时间的.将电脑的所有优势都挖掘出来还不能解决问题的话,只有从改善硬件上来想办法了.

一头牛拉再轻的车也不会象飞一样, 除非你会吹! ^-^

[Mark2Win]

我们有excel导出功能，而且在这个报表上试验感觉速度蛮快，问题是这么多报表中，唯独这一个用excel导出的方式，感觉很怪（而且每个报表上都有excel导出按钮）。

还有就是利用Ajax的朋友，请你们不要去后面取数据，自己就在前端用javascript生成table试一下，不要说10000×12了，你就生成一个1000*12的表格试一下.

那个说 js的执行效率相对去数据库取数据效率高的朋友，我们的sql运算是优化的，只要0.3s，但是请你用js去生成一个1000×12的表格试一下看看是多少秒。

————————————————————————————————————————————————————————————

感谢那位说 tbody是分块加载的朋友，我想能不能在这里做一下文章，我试一下，后面会送上报告。

请大家继续提供宝贵建议！

[SADOCom]

学习中，期待楼主的报告

[qq22345111]

期待报告

[haoyuzhou009]

10K 显示为了好看么?太多了点吧

[madogao]

[Quote=引用 71 楼 Mark2Win 的回复:]
我们有excel导出功能，而且在这个报表上试验感觉速度蛮快，问题是这么多报表中，唯独这一个用excel导出的方式，感觉很怪（而且每个报表上都有excel导出按钮）。

还有就是利用Ajax的朋友，请你们不要去后面取数据，自己就在前端用javascript生成table试一下，不要说10000×12了，你就生成一个1000*12的表格试一下.

那个说 js的执行效率相对去数据库取数据效率高的朋友，我们的sql运算是优化的，只要0.3s，但是请你用js去生…
[/Quote]

谁说用javascript就要生成table了?table是后面生成的,拿过来只是inner就行了

[地下室小红叔]

[Quote=引用 66 楼 madogao 的回复:]
方案二:如楼主所说,利用滚动条动作window.onscroll,计算应该显示的行数,动态调用Ajax去取得当前页面应该显示的数[/Quote]

此法可行 比如当前有8000条记录 约占有8000行 只在滚动条当前所在的屏幕区显示指定的一定数据量(如100条) 其它只是900行回车符"<br>" 如果拖动鼠标后没有超过此100条的区域就正常显示 否则再重新通过ajax调用输出 取数据用分页存储过程 其实是分页存储过程的变相实现 (即共有记录8000条 每页100条记录 共80页 由滚动条位置判断当前页) 当然这个"当前页"的判断要麻烦点 表头和表尾部分处理费事些 但花些时间能够实现

[madogao]

[Quote=引用 45 楼 Mark2Win 的回复:]
再谢谢各位的帮助！

提议用Ajax的朋友是不是要考虑一下 javascript 的执行效率？先生成100行，再异步取数据，这样生成表格的效率？？反正我是一直反对遇到问题就Ajax的，Ajax不是万能的，实际情况实际分析。

还有楼上建议作弊的朋友，当客户没有输入，打开报表链接就要显示的时候怎么作弊？呵呵。

还有就是建议报表没必要显示这么多行的朋友，既然是报表，为何不能显示这么多行？报表大，打开慢，这个没有问题，问题…
[/Quote]

一万行数据,就算用最简单的DIV+CSS,生成的HTML代码也要3M~5M吧,也就是说相当于下载一首MP3了,如果不用异步读取数据,只能一次性从服务器将这首Mp3下载下来,也就是说,只能靠服务器性能和网络传输速度了,很难很无奈

所以Ajax的确是个很不错的选择

方案一:写一个分页存储过程,载入页面后,算好行数及页数,将10000行数据同时进行10~20个页数的异步读取,也就相当于多线程下载.

方案二:如楼主所说,利用滚动条动作window.onscroll,计算应该显示的行数,动态调用Ajax去取得当前页面应该显示的数据

楼主可以比较一下两种方案的效率及实现难度再进行决择!

[cangwu_lee]

不緩存輸出

[yuelailiu]

生成csv,然后让客户自己excel表格处理.

[lionz1023]

qq空间，就是采用的当点击滚动条或者pagedown,pageup的时候继续加载下面信息，不过有个问题就是 当10k条数据呈现在在浏览器后 就算是速度快了，客户拖动薯条的时候ie假死的可能性相当高啊，基本上属于在一屏看完后，就不能往下看了，鼠标滚轴一下拉就会死喽

[kay1990]

坐等楼主结贴报告