Home > Backend Development > PHP Tutorial > 用Jquery dataTable, 但页面上数据过多, 加载页面是会提示stop plugin. 如何提高效率.

用Jquery dataTable, 但页面上数据过多, 加载页面是会提示stop plugin. 如何提高效率.

WBOY
Release: 2016-06-06 20:40:44
Original
1241 people have browsed it

使用的框架是symfony, twig.
页面大约有6000条数据需要现实, 我是全部数据加载后使用dataTable来分页, 同时查询.
但是在加载时明显会卡住, 偶尔还会跳出busy 是否continue 或 stop script的confirm窗.

用Jquery dataTable, 但页面上数据过多, 加载页面是会提示stop plugin. 如何提高效率.

内存使用在67MB左右.

用Jquery dataTable, 但页面上数据过多, 加载页面是会提示stop plugin. 如何提高效率.

这是后台代码

<code>public function indexAction()
{
    $em = $this->getDoctrine()->getManager();
    $qb = $em->createQueryBuilder();
    $qb->select('p.id, p.name as pname, wave.name as wname')
            ->from('AlbatrossAceBundle:Project', 'p')
            ->leftJoin('p.customwave', 'wave');
    $result = $qb->getQuery()->getArrayResult();

    return $this->render('AlbatrossAceBundle:Project:index.html.twig', array(
        'entities' => $result,
    ));
}
</code>
Copy after login
Copy after login

这是我的dataTable配置

<code><script type="text/javascript">
$(function () {
    $('#data-table').dataTable({
        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
        "bFilter": true,
        "aaSorting": [[0, 'desc']],
        "iDisplayLength": 20
    });
    $('#data-table_filter').css('display', 'block');
});
</script>
</code>
Copy after login
Copy after login

不想在后台分页, 非常中意前端分页和查询. 请问有什么方法提高效率呢?

回复内容:

使用的框架是symfony, twig.
页面大约有6000条数据需要现实, 我是全部数据加载后使用dataTable来分页, 同时查询.
但是在加载时明显会卡住, 偶尔还会跳出busy 是否continue 或 stop script的confirm窗.

用Jquery dataTable, 但页面上数据过多, 加载页面是会提示stop plugin. 如何提高效率.

内存使用在67MB左右.

用Jquery dataTable, 但页面上数据过多, 加载页面是会提示stop plugin. 如何提高效率.

这是后台代码

<code>public function indexAction()
{
    $em = $this->getDoctrine()->getManager();
    $qb = $em->createQueryBuilder();
    $qb->select('p.id, p.name as pname, wave.name as wname')
            ->from('AlbatrossAceBundle:Project', 'p')
            ->leftJoin('p.customwave', 'wave');
    $result = $qb->getQuery()->getArrayResult();

    return $this->render('AlbatrossAceBundle:Project:index.html.twig', array(
        'entities' => $result,
    ));
}
</code>
Copy after login
Copy after login

这是我的dataTable配置

<code><script type="text/javascript">
$(function () {
    $('#data-table').dataTable({
        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
        "bFilter": true,
        "aaSorting": [[0, 'desc']],
        "iDisplayLength": 20
    });
    $('#data-table_filter').css('display', 'block');
});
</script>
</code>
Copy after login
Copy after login

不想在后台分页, 非常中意前端分页和查询. 请问有什么方法提高效率呢?

谢邀。

建议后端分页。

6000条数据无论对于前端还是后端来说都过于巨大了,这不是中意不中意的问题,这是能做不能做的问题,答案也很简单,不能做。

如果真的有6000条数据要用js来处理,写原生js可能会提高一部分效率,假使目前js引擎的速度都提高10倍,前端OK了,后端如此大的数据量也会在个位数并发的时候直接拖垮数据库。

写代码是为了解决问题,而不是为了个人感觉爽。

一次性加载6000条数据,在前端分页,不是违反最佳实践,而从根本上就是个错误的设计。

应该是有问题的,能不能查看是否代码有问题,或者这个插件有可能有内存泄露等bug。
呵呵,78MB,感觉有点...

用过前端缓存4000条数据,用的是taffy-db,无压力。

请问你6000条怎样的数据?? 是JSON吗?

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template