Question

我在Angular 4应用程序中通过我的IndexedDB与Dexie的查询选择项目（介于1.000和4.000之间）时遇到问题。

表格中只有最多20,000个项目，但选择这些项目需要多秒（Chrome 61上为5秒，iOS 10和iOS 11上最多（和更多）20秒）

以下是我的服务，它提取两个不同的表并通过loadItems()

返回一个Observable

@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效果异步处理生成的Observable，该效果调度将数据写入状态的Action，因此组件可以呈现信息。

@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)));

我试图＆＃34;懒惰＆＃34;通过https://github.com/raphinesse/dexie-batch分块的项目，但生成的批次需要超过500毫秒才能到达。

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

Answer 1

经过大量的时间和调试，我发现以下Dexie PR打破了Chrome和Safari中的IndexedDB 2.0 getAll功能：https://github.com/dfahlander/Dexie.js/pull/579

恢复到Dexie 2.0.0-beta.11性能提高了大约10倍（原始数据库查询通过游标到getAll从600-700ms回到60ms）

修改：Dexie 2.0.1已发布，并针对此问题提供了正确的解决方法

Dexie＆amp;角度4：选择项目时性能下降

1 个答案: