用於臨時存儲base64圖像數據的IndexedDB或javascript對象存儲？

Question

我的應用程序包含一個照片處理/編輯器部分。

其中我允許用戶在每次修改時操作圖像並保存圖像的「撤消」版本。這個'撤消狀態'作爲base64圖像數據存儲在javascript對象中。

這樣以前的版本可以稍後檢索。它工作得很好，但是我擔心如此直接在內存中存儲這麼多的圖像。

我不需要在用戶訪問之間保持這些撤消狀態，只有在用戶實際操作圖像時才需要存儲。

indexedDB是一個更好的選擇來存儲這些多個圖像？如果是這樣，爲什indexedDB在哪裏存儲數據，它直接在瀏覽器內存中？如果是這樣，以我現在的方式直接存儲在JavaScript對象中會有什麼不同？總之，我將相同圖像的多個版本存儲爲base64數據，目前直接存儲在javscript對象中供以後訪問。有沒有更好的方式臨時存儲這個數據客戶端？

Answer 1

這有點遲，但這是我剛剛遇到相同的情況後才發現的。 IndexedDB最適合於您可能需要在某個時候查詢的大量（r）數據。 IndexedDB還允許使用localstorage提供的5MB以上的「safezone」。 （當然，有一些瀏覽器問題，並且要查看哪個瀏覽器支持什麼，請按照下面的jstore鏈接。）

數據文件在哪裏？據我所知，任何本地存儲內容都存在於Web瀏覽器的臨時目錄中，或者取決於您的操作系統，在某些本地App Data目錄中。我還沒有測試過，但由於本地存儲類似於cookie，因此兩者都是「網頁瀏覽器的一部分」 - 這是有道理的。 （另外，在Firefox中你可以用Firebug直接檢查本地存儲的內容。）

因此，基於我的快速研究（意思是它並不全面），我發現localstorage和IndexedDB都不存儲數據在記憶中。請糾正我，如果我錯了！

這裏是一個網站，介紹更多關於localstorage和IndexedDB的信息。該網站還設有jstore.js，插件採取各種瀏覽器中合適的位置存儲數據的護理：

http://www.jstorage.info/ 

從

除此之外，還有一個有趣的文章，稱在IndexedDB的「存儲圖像和文件「在：

https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/ 

有一個在在Mozilla網站一些好的信息：

https://developer.mozilla.org/en-US/docs/DOM/Storage#Storage_location_and_clearing_the_data 

至於Firefox和Chrome，它指出：」在Firefox中的DOM存儲數據存儲在profile文件夾中的webappsstore.sqlite文件中（還有chromeappsstore.sqlite文件用於存儲瀏覽器自己的數據，特別是對於起始頁 - about：home，但可能用於具有「about：」URL的其他內部頁面）。 「

要真正理解將圖像存儲在localstorage或IndexedDB中會發生什麼情況，我虛心推薦檢查這些鏈接並遵循這些文章中的其他鏈接，尤其是Mozilla中的鏈接。