Dexie＆Angular 4：选择项目时性能下降

我在使用Angular 4应用程序中的Dexie从我的IndexedDB查询中选择项目（在1.000和4.000之间）时遇到问题。Dexie＆Angular 4：选择项目时性能下降

只有表中最高20.000项目，但这些选择需要多秒（5S在Chrome 61，高达（及以上）比20多岁的iOS上的10 & iOS的11）

下面是我的服务，它通过loadItems()

@Injectable() 
export class ItemService { 

    private buildings: Dexie.Table<Building, string>; 
    private people: Dexie.Table<Person, string>; 

    private activeZip: string; 

    constructor(
     private db: IndexeddbService, 
    ) { 
     this.buildings = this.db.table('buildings'); 
     this.people = this.db.table('people'); 
    } 

    loadItems(): Observable<{ 
     buildings: Building[], 
     people: Person[] 
    }> { 
     return Observable.combineLatest(
      this.loadBuildings(), 
      this.loadPeople(), 
     ).map(([buildings, people]) => { 
      return { 
       buildings, 
       people 
      }; 
     }); 
    } 

    private loadBuildings(): Observable<Building[]> { 
     return Observable.from(this.buildings.where('zip').equals(this.activeZip).toArray()); 
    } 

    private loadPeople(): Observable<Person[]> { 
     return Observable.from(this.people.where('zip').equals(this.activeZip).toArray()); 
    } 
}

取两个不同的表，并返回可观察到的所得的可观察是异步与NGRX效果，这将调度该数据写入的状态的动作处理，因此该组件可以呈现的信息。

@Effect() 
loadItems$: Observable<Action> = this.actions$ 
    .ofType(actions.ActionTypes.LOAD_ITEMS) 
    .map(_ => this.itemService.setActiveZip(this.localStorageService.getActiveZip())) 
    .switchMap(_ => this.itemService.loadItems()) 
    .map(items => new actions.LoadItemsSuccessAction(items)) 
    .catch(error => Observable.of(new actions.LoadItemsFailAction(error)));

我试图“延迟加载”通过https://github.com/raphinesse/dexie-batch块中的项目，但由此产生的批花500ms以上才能到达。

哪里有可能的性能瓶颈？我已经尝试在Angular的区域之外运行这个查询，但是这并没有提高性能和性能。

来源

2017-09-28 timbru31

你想在页面上同时放置4000个项目？ – alexKhymenko

创建一个plunker – Aravind

@alexKhymenko - 不，信息在商店中，并通过滚动指令，我只在用户触及底部时向视图添加50个项目。试图在用户触及底部时直接从数据库中加载项目，但即使iPad在这方面速度太慢。 – timbru31

随着大量的时间和调试，我已经确定了以下Dexie PR打破了IndexedDB的2.0 GETALL功能在Chrome和Safari：https://github.com/dfahlander/Dexie.js/pull/579

随着恢复到Dexie 2.0.0 beta.11性能（通过光标原始数据库查询GETALL从600-700ms回到60ms的）10倍左右的时间增加

编辑：Dexie 2.0.1已经发布了正确的修复此问题

来源

2017-09-29 10:08:43 timbru31

Dexie＆Angular 4：选择项目时性能下降

回答

相关问题