Question

我正在尝试使用Nodejs，Angular 6和SQL来构建应用程序。在我的数据库中，我有80.000多个项目，当我尝试使用ngx-pagination进行分页时，它的运行速度非常慢（数据库中的get发生在15秒内，但是页面的渲染速度超过了1 ，5分钟）

这是我的代码段：

.html

<table>
    <thead>
    ...
    </thead>
    <tbody>
        <tr *ngFor="let ded of filteredArray | orderBy : key : reverse | { itemsPerPage: crtPage, currentPage: p, totalItems: itemsLength() }"
            <td>{{ ded.name }}</td>
            <td>{{ ded.group }}</td>
            <td>{{ ded.age }}</td>
        <tr>

    </tbody>

    <div class="hint-text">
        <span>
            Showing {{ itemsLength() }} entries.
        </span>
    </div>

<table>

.ts

ngOnInit() {
    this.refreshItemsList()
}

refreshItemsList() {
    this.dedService.getNNItems().subscribe((res) => {
      this.extractItems(res)
    });
}

extractItems(res) {
    this.filteredArray = res
}

itemsLength() {
    return this.filteredArray.length
}

我该怎么做才能更快地渲染项目？谢谢。

Answer 1

因此，如果您尝试获取80k元素和页面客户端，那不是一个好方法。每次刷新时，它都会占用大量内存和计算能力。

看看服务器端分页：https://www.npmjs.com/package/ngx-pagination#server-side-paging

Nodejs方面，您可以使用类似以下内容对结果进行分页：

var query = "Select * from ?? DESC limit ? OFFSET ?";

//Mention table from where you want to fetch records example-users & send limit and start 

var table = ["your table",LimitNum,startNum];
query = mysql.format(query, table);
connection.query(query, function(err, rest) {
 if(err){
  res.json(err);
}
else{
// Total Count varibale display total Count in Db and data display the records
   res.json("Total Count": totalCount , "data":rest)
}

Source

ngx-pagination-渲染页面非常慢

1 个答案: