摘要:简介离线存储,提供强大的封装专业封装给封装类似类似接口如果你熟悉那一定会用使用类似的接口操作基于的浏览器端数据库基于的浏览器端数据库小型数据库,浏览器端基于风格的接口,让它非常可爱
查看原文
有些安全性不太重要的数据,我不想花大力气搞一台服务器,再安装mysql或者 monogdb,再写点rest接口。这也太麻烦了,浏览器里本来就有很好用的数据库。你为什么不尝试一下呢?1. 客户端存储目前有两个方案比较
方案 | 优点 | 缺点 |
---|---|---|
localStorage | 简单易用,同步操作 | 存储容量小,一般不超过10MB |
indexDB | 接口都是异步的,操作不便 | 容量比localStorage大 |
如果要使用localStorage,那么存储量比较小。如果是用indexDB,那么最好找点开源库,直接封装友好的API, 来方便我们使用indexDB。
下面介绍一些很好用的的库。
2. 简介 2.1. localForage离线存储, 提供强大的API封装IndexedDB,WebSQL,localStorage
12073 star
https://github.com/localForag...
localforage.setItem("key", "value", function (err) { // if err is non-null, we got an error localforage.getItem("key", function (err, value) { // if err is non-null, we got an error. otherwise, value is the value }); });2.2. Dexie.js
专业封装 IndexedDB
3040 star
https://github.com/dfahlander...
const db = new Dexie("MyDatabase"); // Declare tables, IDs and indexes db.version(1).stores({ friends: "++id, name, age" }); // Find some old friends await db.friends .where("age") .above(75) .toArray(); // or make a new one await db.friends.add({ name: "Camilla", age: 25, street: "East 13:th Street", picture: await getBlob("camilla.png") });2.3. zangodb
给HTML5 IndexedDB 封装类似mongodb类似接口, 如果你熟悉mongodb, 那一定会用zangodb
688 star
https://github.com/erikolson1...
let db = new zango.Db("mydb", { people: ["age"] }); let people = db.collection("people"); let docs = [ { name: "Frank", age: 20 }, { name: "Thomas", age: 33 }, { name: "Todd", age: 33 }, { name: "John", age: 28 }, { name: "Peter", age: 33 }, { name: "George", age: 28 } ]; people.insert(docs).then(() => { return people.find({ name: { $ne: "John" }, age: { $gt: 20 } }).group({ _id: { age: "$age" }, count: { $sum: 1 } }).project({ _id: 0, age: "$_id.age" }).sort({ age: -1 }).forEach(doc => console.log("doc:", doc)); }).catch(error => console.error(error));2.4. JsStore
使用类似 sql的接口操作 indexDB
74 star
https://github.com/ujjwalgupt...
var value = { column1: value1, column2: value2, column3: value3, ... columnN: valueN }; connection.insert({ into: "TABLE_NAME", values: [Value], //you can insert multiple values at a time }).then(function(rowsAffected) { if (rowsAffected > 0) { alert("Successfully Added"); } }).catch(function(error) { alert(error.message); });2.5. minimongo
基于localstorage的浏览器端mongodb数据库
697 star
https://github.com/mWater/min...
// Require minimongo var minimongo = require("minimongo"); var LocalDb = minimongo.MemoryDb; // Create local db (in memory database with no backing) db = new LocalDb(); // Add a collection to the database db.addCollection("animals"); doc = { species: "dog", name: "Bingo" }; // Always use upsert for both inserts and modifies db.animals.upsert(doc, function() { // Success: // Query dog (with no query options beyond a selector) db.animals.findOne({ species:"dog" }, {}, function(res) { console.log("Dog"s name is: " + res.name); }); });2.6. pouchdb
基于indexDB的CouchDB-style浏览器端数据库
10599 star
https://github.com/pouchdb/po...
var db = new PouchDB("dbname"); db.put({ _id: "dave@gmail.com", name: "David", age: 69 }); db.changes().on("change", function() { console.log("Ch-Ch-Changes"); }); db.replicate.to("http://example.com/mydb");2.7. lowdb
小型json数据库,浏览器端基于localStorage, lodash风格的接口,让它非常可爱
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/107903.html
摘要:简介离线存储,提供强大的封装专业封装给封装类似类似接口如果你熟悉那一定会用使用类似的接口操作基于的浏览器端数据库基于的浏览器端数据库小型数据库,浏览器端基于风格的接口,让它非常可爱 查看原文 有些安全性不太重要的数据,我不想花大力气搞一台服务器,再安装mysql或者 monogdb,再写点rest接口。这也太麻烦了,浏览器里本来就有很好用的数据库。你为什么不尝试一下呢? 1. 客户端存...
摘要:私有缓存就是用户专享的,各级代理不能缓存的缓存。代表使用内存中的缓存,则代表使用的是硬盘中的缓存,浏览器读取缓存的顺序为。 作为一名前端工作人员,前端的缓存知识是必须掌握的,因为一个网站打开网页的速度直接关系到用户体验,用户粘度,而提高网页的打开速度有很多方面需要优化,其中比较重要的一点就是利用好缓存,缓存文件可以重复利用,还可以减少带宽,降低网络负荷。 1 缓存 缓存从宏观上分为私有...
摘要:私有缓存就是用户专享的,各级代理不能缓存的缓存。代表使用内存中的缓存,则代表使用的是硬盘中的缓存,浏览器读取缓存的顺序为。 作为一名前端工作人员,前端的缓存知识是必须掌握的,因为一个网站打开网页的速度直接关系到用户体验,用户粘度,而提高网页的打开速度有很多方面需要优化,其中比较重要的一点就是利用好缓存,缓存文件可以重复利用,还可以减少带宽,降低网络负荷。 1 缓存 缓存从宏观上分为私有...
摘要:私有缓存就是用户专享的,各级代理不能缓存的缓存。代表使用内存中的缓存,则代表使用的是硬盘中的缓存,浏览器读取缓存的顺序为。 作为一名前端工作人员,前端的缓存知识是必须掌握的,因为一个网站打开网页的速度直接关系到用户体验,用户粘度,而提高网页的打开速度有很多方面需要优化,其中比较重要的一点就是利用好缓存,缓存文件可以重复利用,还可以减少带宽,降低网络负荷。 1 缓存 缓存从宏观上分为私有...
阅读 975·2021-11-23 09:51
阅读 2290·2021-10-08 10:22
阅读 2467·2021-09-29 09:35
阅读 824·2021-09-22 15:20
阅读 2827·2019-08-30 15:53
阅读 2385·2019-08-30 13:55
阅读 1055·2019-08-29 17:27
阅读 2838·2019-08-29 17:26