IndexedDB 主线程和 WebWorker 事件监听器

Question

您好，我正在开发一个使用 indexeDB 的应用程序。根据应用程序配置，我可以选择是从 WebWorker 还是从主线程 UI 使用 indexeDB。无论配置如何，始终会建立来自主 UI 线程的连接。但是，根据配置，如果选择，繁重的工作将由工作人员完成。

导入原型示例：

Database.prototype.importItem = function(item, callback) {

    if (this.settings.useWorker) {

        this.postMessage({
            cmd: "importItem",
            data: item
        }, callback);

    } else {

        var that = this;
        var transaction = this.db.transaction(this.settings.collection, "readwrite");
        var objectStore = transaction.objectStore(this.settings.collection);
        var request = objectStore.add(item);

        request.onerror = function(evt) {
            if (callback && callback instanceof Function) {
                callback(new ApplicationError("importItem error", evt.target.error), null);
            }
        };

        request.onsuccess = function(evt) {
            if (callback && callback instanceof Function) {
                callback(null, evt.target.result);
            }
        };

        transaction.oncomplete = function(evt) {};

    }
};

我很好奇的想法是来自 indexedDB 的 required 事件侦听器，示例：

Database.prototype.connect = function() {

    if (!this.supported()) {
        return this.emit("error", new ApplicationError("IndexedDB not supported!"));
    }

    var that = this;
    var openRequest = window.indexedDB.open(this.settings.dbName, this.settings.dbVersion);

    /**
     * [onerror description]
     * @param  {[type]} evt [description]
     * @return {[type]}     [description]
     */
    openRequest.onerror = function(evt) {
        that.emit("error", new ApplicationError("openRequest.onerror error", evt.target.error));
    };

    /**
     * [onblocked description]
     * @param  {[type]} evt [description]
     * @return {[type]}     [description]
     */
    openRequest.onblocked = function(evt) {
        // If some other tab is loaded with the database, then it needs to be closed
        // before we can proceed.
        alert("Please close all other tabs with this site open!");
    };

    /**
     * [onsuccess description]
     * @param  {[type]} evt [description]
     * @return {[type]}     [description]
     */
    openRequest.onsuccess = function(evt) {

        that.db = evt.target.result;

        that.db.onerror = function(evt) {
            logger.warn("openRequest.onsuccess error", evt.target);
        };

        that.db.onabort = function(evt) {
            logger.warn("openRequest.onsuccess abort", evt.target);
        };

        that.db.onversionchange = function(evt) {
            that.db.close();
            that.emit("versionchange", new ApplicationError("openRequest.onsuccess version change", evt.target));
        };

        if (that.settings.useWorker) {
            that.requestWorker();
        } else {
            that.emit("connect");
        }

    };

    /**
     * [onupgradeneeded description]
     * @param  {[type]} evt [description]
     * @return {[type]}     [description]
     */
    openRequest.onupgradeneeded = function(evt) {

        var stores = {};

        that.db = evt.target.result;

        that.db.onerror = function(evt) {
            logger.warn("openRequest.onupgradeneeded error", evt.target);
        };

        that.db.onabort = function(evt) {
            logger.warn("openRequest.onupgradeneeded abort", evt.target);
        };

        that.db.onversionchange = function(evt) {
            that.db.close();
            that.emit("versionchange", new ApplicationError("openRequest.onupgradeneeded version change", evt.target));
        };

        // Check for the objectStore - collection and delete it if exists
        if (that.db.objectStoreNames.contains(that.settings.collection)) {
            that.db.deleteObjectStore(that.settings.collection);
        }

        // Create new objectStore
        stores[that.settings.collection] = that.db.createObjectStore(that.settings.collection, {
            keyPath: that.settings.indexes[0]
        });

        // Create database indexes
        that.settings.indexes.forEach(function(index) {
            stores[that.settings.collection].createIndex(index, index, {
                unique: false
            });
        });

        that.upgraded = true;
        that.emit("upgrade");

    };

    /**
     * [onbeforeunload description]
     * @param  {[type]} evt [description]
     * @return {[type]}     [description]
     */
    window.onbeforeunload = function(evt) {
        that.db.close();
    };

};

因为我总是首先从主 ui 连接，然后从 worker 连接，我是否应该只在主 UI 线程中监听像 "onblocked, versionchange" 这样的事件而不是在工人？我假设不需要从两个线程收听？

更新

我知道这是一个奇怪的实现，但我考虑它的原因是因为我在一台拥有 3GB 内存和 2 个内核的机器上开发一个应用程序...我还有一种方法可以从我的数据库中迭代集合中的所有记录。我在想的是将检索到的每条记录传递给另一种方法以进行图像加载和操作，然后可能会调用回调……这将限制内存使用，因为如果我没记错的话，它会在系列中完成。但是我不确定交易是否仍然存在。

底线是我考虑 2 个连接（因为 1 个方法）的主要原因，我想知道我是否可以避免双重事件侦听器。也许有一些在 1 个线程中。

Answer 1

你做错了。不应在两个线程上打开 IndexedDB 连接。它会使您的应用程序架构不必要地复杂化。从 IndexedDB 检索的数据可以通过 Web workers' messaging channel.

与 UI 线程轻松交换

IndexedDB 主线程和 WebWorker 事件监听器

IndexedDB main thread & WebWorker eventlisteners

javascript

web-worker

indexeddb