IndexedDB 就是瀏覽器提供的本地資料庫，它可以被網頁尾本建立和操作。
背景
隨著瀏覽器的功能不斷增強，越來越多的網站開始考慮，將大量資料儲存在客戶端，這樣可以減少從伺服器獲取資料，直接從本地獲取資料。
現有的瀏覽器資料儲存方案，都不適合儲存大量資料：Cookie 的大小不超過4KB，且每次請求都會傳送回伺服器；LocalStorage 在 2.5MB 到 10MB 之間（各家瀏覽器不同），而且不提供搜尋功能，不能建立自定義的索引。所以，需要一種新的解決方案，這就是 IndexedDB 誕生的背景。
我們可以透過開發者工具檢視 IndexedDB 中的儲存資料：
特點
通俗地說，IndexedDB 就是瀏覽器提供的本地資料庫，它可以被網頁尾本建立和操作。IndexedDB 允許儲存大量資料，提供查詢介面，還能建立索引。這些都是 LocalStorage 所不具備的。就資料庫型別而言，IndexedDB 不屬於關係型資料庫（不支援 SQL 查詢語句），更接近 NoSQL 資料庫。
IndexedDB 具有以下特點：
（1）鍵值對儲存。 IndexedDB 內部採用物件倉庫（object store）存放資料。所有型別的資料都可以直接存入，包括 JavaScript 物件。物件倉庫中，資料以”鍵值對”的形式儲存，每一個資料記錄都有對應的主鍵，主鍵是獨一無二的，不能有重複，否則會丟擲一個錯誤。
（2）非同步。 IndexedDB 操作時不會鎖死瀏覽器，使用者依然可以進行其他操作，這與 LocalStorage 形成對比，後者的操作是同步的。非同步設計是為了防止大量資料的讀寫，拖慢網頁的表現。
（3）支援事務。 IndexedDB 支援事務（transaction），這意味著一系列操作步驟之中，只要有一步失敗，整個事務就都取消，資料庫回滾到事務發生之前的狀態，不存在只改寫一部分資料的情況。
（4）同源限制 IndexedDB 受到同源限制，每一個資料庫對應建立它的域名。網頁只能訪問自身域名下的資料庫，而不能訪問跨域的資料庫。
（5）儲存空間大 IndexedDB 的儲存空間比 LocalStorage 大得多，一般來說不少於 250MB，甚至沒有上限。
（6）支援二進位制儲存。 IndexedDB 不僅可以儲存字串，還可以儲存二進位制資料（ArrayBuffer 物件和 Blob 物件）。
作用
IndexedDB 資料庫的使用目前可以直接在 HTTP 協議下使用，這個和 cacheStorage 快取儲存必須使用 HTTPS 協議不一樣。所以就應用場景來講，IndexedDB 資料庫還是挺廣的，考慮到 IE10 也支援，所以基本可以確定在實際專案中應用是絕對不成問題的。
例如，頁面中一些不常變動的結構化資料，我們就可以使用 IndexedDB 資料庫儲存在本地，有助於增強頁面的互動效能。
總結
這一節主要是認識一下 IndexedDB，後續會進行詳細的講解。
~
~本文完，感謝閱讀！
~
學習有趣的知識，結識有趣的朋友，塑造有趣的靈魂！
大家好，我是〖程式設計三昧〗的作者 隱逸王，我的公眾號是『程式設計三昧』，歡迎關注，希望大家多多指教！
你來，懷揣期望，我有墨香相迎！ 你歸，無論得失，唯以餘韻相贈！
知識與技能並重，內力和外功兼修，理論和實踐兩手都要抓、兩手都要硬！
本作品採用《CC 協議》，轉載必須註明作者和本文連結