时间戳

首页 > 解决方案 > 在 Angular2+ 中正确使用 PouchDB？

javascript - 在 Angular2+ 中正确使用 PouchDB？

问题描述

我试图将对象存储在客户端的 pouchdb 中。

创建数据库并获取所有文档运行良好。但是当我尝试通过 db.find() 查询数据库时，需要几分钟才能得到它——浏览器也会滞后，CPU 和 RAM 也会增加很多。

我知道有错误，但我不知道我做错了什么。

这里是角度 pouchDB 服务：

import { Injectable } from '@angular/core';
import PouchDB from 'pouchdb';
import PouchFind from 'pouchdb-find';
import { IImage } from '../_interfaces/image';
import { ISelector } from '../_interfaces/pouchdb-selector';
PouchDB.plugin(PouchFind);

@Injectable({
  providedIn: 'root'
})
export class PouchdbService {
  public pouchdb = new PouchDB("pouchform");
  
  constructor() {
    this.pouchdb.info().then(function (info) {
      console.log(info);
    })
  }

  insert(content: IImage){
    this.pouchdb.post(content)
  }

  getAll(): Promise<IImage[]>{
    return new Promise<IImage[]>((resolve, reject) => {
      this.pouchdb.allDocs({include_docs: true, attachments: true})
        .then(data => {
          let rows: any = data.rows
          let images: IImage[] = rows.map(d => d.doc)
          resolve(images)
      })
    })
  }

  query(selector: ISelector): Promise<any>{
    return new Promise<any>((resolve, reject) => {
        this.pouchdb.find({
          selector: selector.selectors // e.g. it is {cam_brand: "Apple"}
        }).then(result => {
          console.log(result)
          resolve(result)
        }).catch(err => {
          console.log("err", err)
        })
    })
  }
}

查询：

this.pouchdb.query({selectors: {cam_brand: "Apple"}}).then(i => {
  console.log("filtered" , i)
})

我之前也尝试过 createIndex，但它并没有提高性能

例如：

编辑：现在我直接用 indexedDB 尝试了 id。当我添加这 400 个对象（在 for 循环中一个接一个）时，循环在几毫秒内完成。等待 2-3 分钟后，插入的响应发生。我想我对 indexedDB 本身有一些问题。

如果这有帮助，我正在使用带有电子的 Angular 10。

EDIT-Electron：我现在将 pouchdb 迁移到一个新的锅炉模板中。在平台上的“热重载”功能上：“WEB”它工作正常。但是，当我构建具有平台 win32 的电子产品时，它的行为同样缓慢，我需要一些特殊的进口来解决这个问题吗？

标签： javascriptangularindexeddbpouchdb

解决方案

推荐阅读