我的应用程序中有大约 10,000 个产品列表.角 2 和猫鼬每页显示 2 个延迟 18 个是否正常

Question

当我在我的电子网站上时，我的应用程序找到了大约 6000 个。每页大约有 18 个项目。我可以通过设置PRODUCT_PER_PAGE来控制每页的项目数。这是我在角度 2 中的冷杉应用程序，我正在尝试构建一个大型购物车。我的应用程序显示 18 页大约需要 2 秒。这正常吗？顺便说一下，下面是我的代码选择一个页面。提前谢谢。

onSelectPage(thePage: string) {
    //page(1/4) /*
/*  var slash = Number(page.indexOf('/'));
    var length = slash - 5;
    page = page.substr(5, length); */
    let page = Number(thePage);
    let productDisplay = this._searchProductService.products;
    this.products = [];
    this.productsNextColumn = [];       
    let pageNumber = Number(page) - 1;
    this.pageNumber = pageNumber;
    this.pageDisplay = pageNumber + 1;
    if(this.isClicked) {
        productDisplay = this.theClickedQueries;
        if(productDisplay.length > 0)
            productDisplay = this.theClickedQueries;
        else
            productDisplay = this._searchProductService.products;
    }
    let productDisplayLength = productDisplay.length;
    if(this.pageNumber == 0) {
        this.startDisplay = 0;
        this.endDisplay = this.PRODUCTS_PER_PAGE/2;
        this.previousPage = 'disabled';
        for(let i=this.startDisplay; i <this.endDisplay; i++) {
            this.products.push(productDisplay[i]);
        }
        let nextColumn = this.endDisplay + this.PRODUCTS_PER_PAGE/2;
        for(let i=this.endDisplay; i<nextColumn; i++){
            this.productsNextColumn.push(productDisplay[i]);
        }   
    }
    //Click on other pages..
    else {
        this.previousPage = '';
        this.startDisplay = this.pageNumber * this.PRODUCTS_PER_PAGE;
        this.endDisplay = this.startDisplay + this.PRODUCTS_PER_PAGE/2;
        if(productDisplayLength > this.endDisplay) {
            for(let i=this.startDisplay; i <this.endDisplay; i++) 
                this.products.push(productDisplay[i]);
            let nextColumn = this.endDisplay + this.PRODUCTS_PER_PAGE/2; 
            if(productDisplayLength >= nextColumn) {
                for(let i=this.endDisplay; i<nextColumn; i++)
                    this.productsNextColumn.push(productDisplay[i]);
                if(productDisplayLength > nextColumn)
                    this.nextPage = '';
                else
                    this.nextPage = 'disabled';
            } else {
                for(let i=this.endDisplay; i<productDisplayLength; i++){
                    this.productsNextColumn.push(productDisplay[i]);
                }
                this.nextPage = 'disabled';             
            }
        } else {
            for(let i=this.startDisplay; i <productDisplayLength; i++) 
                this.products.push(productDisplay[i]);  
        }
    }
    if(this.advertisements[this.pageNumber] != null) 
        this.advertisement = this.advertisements[this.pageNumber];              
}    

Answer 1

许多数据驱动应用程序使用的一种应用程序设计模式是服务器端分页。基本上，服务器将数据子集发送到客户端(又名"页面"(，客户端在需要时请求其他页面。下面是一个使用服务器端分页 https://ciphertrick.com/2015/08/31/server-side-pagination-in-angularjs 的 angularJS 示例