php加数据库开发案例,js开发数据库的实例分享
前端很多时候还是需要保存一些数据的,这里的保存指的是长久的保存。以前的思想是把数据保存在cookie中,或者将key保存在cookie中,将其他数据保存在服务器上。这几个场景用处很多,也非常的成熟好用。但是我还是想要一种能够长久的保存在本地的数据,类似数据库或者类似web sql。
新一代浏览器基本都支持了本地数据库,需要用的时候直接使用就好了。实在不行还可以使用Storage将就一下。
假如我需要的是一个数据库那种功能并且没有兼容的存储方式呢?加入我还要加密存储这些东西在本地呢?加入我要存的东西非常多呢?
目前我在使用ReactNative的时候确实遇到了这种情况。我需要将非常多的数据存在本地。有人说了,直接使用sqlite不就好了么?
好啊,完全可以啊。我这里仅仅是本着前端的态度去开发而已。假如有的同学不需要sqlite呢,只需要一个简单的,能够存储一些大量数据的方式呢?
使用场景可能有很多,实现的底层也可以随便替换,甚至实现方式都可以随便写写。这里我本着前端创造世界的态度来做一个非正式的、前端好使的数据存储库。
底层存储
这里的使用场景是ReactNative,所以我使用的是RN的AsyncStorage。
将所有要保存的数据转成对象,并转化为字符串。这里的核心思想就是序列化。将所有数据当成字符串来存。import { AsyncStorage } from 'react-native';
exports.setItem = async (key, value) => { let item = JSON.stringify({
v: value
}); return await AsyncStorage.setItem(key, item);
}
当读取的时候也需要做一次转化,将字符串转成当初存入的数据。exports.getItem = async (key) => { let item = await AsyncStorage.getItem(key); if (!item) { return null;
} return JSON.parse(item).v || null;
}
需要特殊处理的是列表的获取。RN有一个根据多个key返回多条数据的api。它返回的是一个数组对象,数组序号0是数据存储的key值,序号1才是数据存储的具体字符串。exports.getlist = async (keys) => { let list = await AsyncStorage.multiGet(keys);
list = list.map(item => JSON.parse(item[1]).v || null); return list;
}
其他用到的几个方法也顺便拿出来吧。这里多嵌套一层,跟上面的保持队形。exports.removeItem = async (key) => await AsyncStorage.removeItem(key);
exports.removeItems = async (keys) => await AsyncStorage.multiRemove(keys);
exports.allKeys = async () => await AsyncStorage.getAllKeys();
底层优化
上面只是简单的实现,如果没有特殊需求也就差不多了。但是,想要更进一步的可以考虑开始优化了。
比如,优化json转化的速度。我们使用JSON对象的方法去转化的时候其实还有一个判断数值类型的过程。如果我们把数据的类型提前定义好。再转化的时候就不需要再判断了。
可以定义一个model对象,将这个表需要的字段预先定义好。可以查看一下Sequelize的定义方式。按照关系行数据库的方式来搞这个事情就很简单了。//用户对象const users = db.define('t_users', {
id: {
type: Sequelize.INTEGER,
primaryKey: true,
}, //用户名
username: {
type: Sequelize.STRING
}, //密码
pwd: {
type: Sequelize.STRING
}, //状态
status: {
type: Sequelize.INTEGER
}, //昵称
nickname: {
type: Sequelize.STRING
}, //token
token: {
type: Sequelize.STRING
},
create_time: {
type: Sequelize.TIME
}
}, {
freezeTableName: true,
timestamps: false,
});
实现存储
我们这里参考一下关系型数据库的实现。
首先需要分表和分库。这样在存入数据的时候可以更少的关注这方面的信息,将主要精力放在数据操作上。constructor(tableName = "table", db = "db") { //检查库,表是否存在
//初始化索引表
this.db = db; this.tableName = tableName; this.tableKey = db + "_" + tableName; this.init();
}
将它们分开存储在当前对象内部,在创建对象的时候就可以根据不同的库、表创建不同的操作方法。这里使用的是class,每个表都对应一个单独的对象。
由于我们使用的是RN提供的存储方法,所以这里的添加和更新其实是一个方法。在添加的时候会根据当前时间戳创建一个唯一id,使用这个id作为key存储在数据库中。所以在使用的时候不需要再单独存入id,不过如果你觉得这个id跟你需要的有差别也可以自己定义一个id来作为key值存储。//添加和更新
async add(data = {}) { if (data.constructor !== Object) return; if (!data._id)data._id = uuid();
await setItem(this.tableKey + "_" + data._id, data); return data;
}
在获取的时候单独提供了一个根据id获取的方式。这里考虑的是通过id获取非常的简单方便,对于某些数据完全可以快速读取,没必要一行一行的去查询。/**
* 通过id查询
* @param {*} id
*/async getById(id) { if (!id) return {}; return await getItem(this.tableKey + "_" + id);
}
相对于根据id查询来说,模糊查询确实很慢,如果不是真实需要,还是不要使用这种模糊查询的好。这里提供了一个自定义查询的方法,可以根据返回的对象判断是否需要这行数据。同时也可以添加top参数来限制返回的数量。使用这个参数也可以在数据很多的时候提高性能。/**
* 通过过滤方法查询
* @param {*} fn
*/async get(fn, top = 0) { let keys = await allKeys(); if (keys.length == 0) return []; if (top > 0 && keys.length > top) keys.length = top; const listkey = keys.filter(item => item.indexOf(this.tableKey + "_") === 0); if (listkey.length == 0) return []; let list = await getlist(listkey);
list = list.filter(item => fn(item)); return list;
}
最后把删除和清空的方法加上,这样一个简单的删除库就完成了。/**
* 删除
* @param {*} id
*/async delete(id) { if (!id) return {};
await removeItem(this.tableKey + "_" + id);
}/**
* 清空表
*/async clear() { let keys = await allKeys(); const listkey = keys.filter(item => item.indexOf(this.tableKey + "_") === 0); if (listkey.length == 0) return;
removeItems(listkey);
}
使用的时候只需要创建对象,然后在需要的地方调用即可。使用起来简单又方便,再加上优化之后的情况甚至可以当成客户端的redis来使用。//初始化数据库let db=new JSDB();//添加一个自定义数据db.add({name:"test",key:"abc"});//根据id获取数据db.getById("1223467890");//根据条件查询数据db.get(d=>d.name==="test");//删除对应的数据db.delete("1223467890");//情况所有数据db.clear()
优化创建
首先要优化的就是对象的创建。每个对象创建其实都是一个很大的消耗,如果能把这个消耗降低岂不是美滋滋!
这里我们借鉴数据库池的概念,实现一个对象池的方法。在对象创建之后并没有直接返回,要在经过池的操作。
将对象放入池内,并在页面销毁的时候重置为一个空对象。下次请求创建的时候就不必再创建新的了。直接赋值表、库的名称就可以使用了。内存毫无变化,并且有点想笑。
优化查询
每次查询都需要去读Stroage还是很麻烦的,尤其这个操作是异步操作,是需要发消息到native端的。
我们可以将上次读取的数据先存在一个变量中,如果下次还需要使用这行数据,就完全不需要再去读取了。这样就可以很简单的提供读取速度。
这个方式还可以继续优化。将变量中保存的数据限制数量,防止数量太多超过了APP的限制。还可以将这个保存的时限做一个逻辑判断,常使用的数据放在里面,不常用的就找机会删除。
使用这种方式也可以优化变量中数据的有效性,减少变量占用内存的大小。不过实现的方式尽量不要使用定时器的形式,可以考虑使用触发式的。在条件满足的时候再触发删除动作。
优化写入
上面提到读取的时候需要放入变量来提高读取速度。我们顺便想到写入的速度是不是也可以提高啊?
我们将要存的数据放在临时的变量里,如果查过我们设置的时间或者数据长度查过我们设置的数量就触发一次保存操作。
这里要注意,保存数据的变量和存入时候使用的变量要交替使用,防止出现丢数据的情况。
比如:存的时候使用变量1,在写到数据库之前,将要存的对象改成变量2,然后读取变量1的数据并存入数据库中。这就是双缓存写入。
当然还是要判断一次APP的退出事件的,如果APP退出了,请一定要把变量中的内容保存一次,不然你的心血就全丢了。
好了,一个简单的数据库就完成了。想要使用的可以先在npm上搜索react-native-jsdb这个库。我已经将第一部分实现放在了npm上,后续的优化也会满满的开源出来的。
npm仓库地址
文章地址
前端很多时候还是需要保存一些数据的,这里的保存指的是长久的保存。以前的思想是把数据保存在cookie中,或者将key保存在cookie中,将其他数据保存在服务器上。
这几个场景用处很多,也非常的成熟好用。但是我还是想要一种能够长久的保存在本地的数据,类似数据库或者类似web sql。
新一代浏览器基本都支持了本地数据库,需要用的时候直接使用就好了。实在不行还可以使用Storage将就一下。
假如我需要的是一个数据库那种功能并且没有兼容的存储方式呢?加入我还要加密存储这些东西在本地呢?加入我要存的东西非常多呢?
目前我在使用ReactNative的时候确实遇到了这种情况。我需要将非常多的数据存在本地。有人说了,直接使用sqlite不就好了么?
好啊,完全可以啊。我这里仅仅是本着前端的态度去开发而已。假如有的同学不需要sqlite呢,只需要一个简单的,能够存储一些大量数据的方式呢?
使用场景可能有很多,实现的底层也可以随便替换,甚至实现方式都可以随便写写。这里我本着前端创造世界的态度来做一个非正式的、前端好使的数据存储库。
底层存储
这里的使用场景是ReactNative,所以我使用的是RN的AsyncStorage。
将所有要保存的数据转成对象,并转化为字符串。这里的核心思想就是序列化。将所有数据当成字符串来存。import { AsyncStorage } from 'react-native';
exports.setItem = async (key, value) => { let item = JSON.stringify({
v: value
}); return await AsyncStorage.setItem(key, item);
}
当读取的时候也需要做一次转化,将字符串转成当初存入的数据。exports.getItem = async (key) => { let item = await AsyncStorage.getItem(key); if (!item) { return null;
} return JSON.parse(item).v || null;
}
需要特殊处理的是列表的获取。RN有一个根据多个key返回多条数据的api。它返回的是一个数组对象,数组序号0是数据存储的key值,序号1才是数据存储的具体字符串。exports.getlist = async (keys) => { let list = await AsyncStorage.multiGet(keys);
list = list.map(item => JSON.parse(item[1]).v || null); return list;
}
其他用到的几个方法也顺便拿出来吧。这里多嵌套一层,跟上面的保持队形。exports.removeItem = async (key) => await AsyncStorage.removeItem(key);
exports.removeItems = async (keys) => await AsyncStorage.multiRemove(keys);
exports.allKeys = async () => await AsyncStorage.getAllKeys();
底层优化
上面只是简单的实现,如果没有特殊需求也就差不多了。但是,想要更进一步的可以考虑开始优化了。
比如,优化json转化的速度。我们使用JSON对象的方法去转化的时候其实还有一个判断数值类型的过程。如果我们把数据的类型提前定义好。再转化的时候就不需要再判断了。
可以定义一个model对象,将这个表需要的字段预先定义好。可以查看一下Sequelize的定义方式。按照关系行数据库的方式来搞这个事情就很简单了。//用户对象const users = db.define('t_users', {
id: {
type: Sequelize.INTEGER,
primaryKey: true,
}, //用户名
username: {
type: Sequelize.STRING
}, //密码
pwd: {
type: Sequelize.STRING
}, //状态
status: {
type: Sequelize.INTEGER
}, //昵称
nickname: {
type: Sequelize.STRING
}, //token
token: {
type: Sequelize.STRING
},
create_time: {
type: Sequelize.TIME
}
}, {
freezeTableName: true,
timestamps: false,
});
实现存储
我们这里参考一下关系型数据库的实现。
首先需要分表和分库。这样在存入数据的时候可以更少的关注这方面的信息,将主要精力放在数据操作上。constructor(tableName = "table", db = "db") { //检查库,表是否存在
//初始化索引表
this.db = db; this.tableName = tableName; this.tableKey = db + "_" + tableName; this.init();
}
将它们分开存储在当前对象内部,在创建对象的时候就可以根据不同的库、表创建不同的操作方法。这里使用的是class,每个表都对应一个单独的对象。
由于我们使用的是RN提供的存储方法,所以这里的添加和更新其实是一个方法。在添加的时候会根据当前时间戳创建一个唯一id,使用这个id作为key存储在数据库中。所以在使用的时候不需要再单独存入id,不过如果你觉得这个id跟你需要的有差别也可以自己定义一个id来作为key值存储。//添加和更新
async add(data = {}) { if (data.constructor !== Object) return; if (!data._id)data._id = uuid();
await setItem(this.tableKey + "_" + data._id, data); return data;
}
在获取的时候单独提供了一个根据id获取的方式。这里考虑的是通过id获取非常的简单方便,对于某些数据完全可以快速读取,没必要一行一行的去查询。/**
* 通过id查询
* @param {*} id
*/async getById(id) { if (!id) return {}; return await getItem(this.tableKey + "_" + id);
}
相对于根据id查询来说,模糊查询确实很慢,如果不是真实需要,还是不要使用这种模糊查询的好。这里提供了一个自定义查询的方法,可以根据返回的对象判断是否需要这行数据。同时也可以添加top参数来限制返回的数量。使用这个参数也可以在数据很多的时候提高性能。/**
* 通过过滤方法查询
* @param {*} fn
*/async get(fn, top = 0) { let keys = await allKeys(); if (keys.length == 0) return []; if (top > 0 && keys.length > top) keys.length = top; const listkey = keys.filter(item => item.indexOf(this.tableKey + "_") === 0); if (listkey.length == 0) return []; let list = await getlist(listkey);
list = list.filter(item => fn(item)); return list;
}
最后把删除和清空的方法加上,这样一个简单的删除库就完成了。/**
* 删除
* @param {*} id
*/async delete(id) { if (!id) return {};
await removeItem(this.tableKey + "_" + id);
}/**
* 清空表
*/async clear() { let keys = await allKeys(); const listkey = keys.filter(item => item.indexOf(this.tableKey + "_") === 0); if (listkey.length == 0) return;
removeItems(listkey);
}
使用的时候只需要创建对象,然后在需要的地方调用即可。使用起来简单又方便,再加上优化之后的情况甚至可以当成客户端的redis来使用。//初始化数据库let db=new JSDB();//添加一个自定义数据db.add({name:"test",key:"abc"});//根据id获取数据db.getById("1223467890");//根据条件查询数据db.get(d=>d.name==="test");//删除对应的数据db.delete("1223467890");//情况所有数据db.clear()
优化创建
首先要优化的就是对象的创建。每个对象创建其实都是一个很大的消耗,如果能把这个消耗降低岂不是美滋滋!
这里我们借鉴数据库池的概念,实现一个对象池的方法。在对象创建之后并没有直接返回,要在经过池的操作。
将对象放入池内,并在页面销毁的时候重置为一个空对象。下次请求创建的时候就不必再创建新的了。直接赋值表、库的名称就可以使用了。内存毫无变化,并且有点想笑。
优化查询
每次查询都需要去读Stroage还是很麻烦的,尤其这个操作是异步操作,是需要发消息到native端的。
我们可以将上次读取的数据先存在一个变量中,如果下次还需要使用这行数据,就完全不需要再去读取了。这样就可以很简单的提供读取速度。
这个方式还可以继续优化。将变量中保存的数据限制数量,防止数量太多超过了APP的限制。还可以将这个保存的时限做一个逻辑判断,常使用的数据放在里面,不常用的就找机会删除。
使用这种方式也可以优化变量中数据的有效性,减少变量占用内存的大小。不过实现的方式尽量不要使用定时器的形式,可以考虑使用触发式的。在条件满足的时候再触发删除动作。
优化写入
上面提到读取的时候需要放入变量来提高读取速度。我们顺便想到写入的速度是不是也可以提高啊?
我们将要存的数据放在临时的变量里,如果查过我们设置的时间或者数据长度查过我们设置的数量就触发一次保存操作。
这里要注意,保存数据的变量和存入时候使用的变量要交替使用,防止出现丢数据的情况。
比如:存的时候使用变量1,在写到数据库之前,将要存的对象改成变量2,然后读取变量1的数据并存入数据库中。这就是双缓存写入。
当然还是要判断一次APP的退出事件的,如果APP退出了,请一定要把变量中的内容保存一次,不然你的心血就全丢了。
好了,一个简单的数据库就完成了。想要使用的可以先在npm上搜索react-native-jsdb这个库。我已经将第一部分实现放在了npm上,后续的优化也会满满的开源出来的。
php加数据库开发案例,js开发数据库的实例分享相关推荐
- Node.js 连接 MySQL 并进行数据库操作 –node.js 开发指南
Node.js是一套用来编写高性能网络服务器的JavaScript工具包 通常在NodeJS开发中我们经常涉及到操作数据库,尤其是 MySQL ,作为应用最为广泛的开源数据库则成为我们的首选,本篇就来 ...
- nodec mysql_Node.js 连接 MySQL 并进行数据库操作 –node.js 开发指南
Node.js是一套用来编写高性能网络服务器的JavaScript工具包 通常在NodeJS开发中我们经常涉及到操作数据库,尤其是 MySQL ,作为应用最为广泛的开源数据库则成为我们的首选,本篇就来 ...
- 三维地图php源码,Three.js实现3D地图实例分享
本文主要给大家介绍了关于利用Three.js开发实现3D地图的实践过程,文中通过示例代码介绍的非常详细,对大家学习或者使用three.js具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习 ...
- php加数据库开发案例,PHP简单数据库操作类实例【支持增删改查及链式操作】
本文实例讲述了PHP简单数据库操作类.分享给大家供大家参考,具体如下: 在进行项目开发时,数据库是必不可少的东西了.但是很多时候却又对数据库SQL语句的繁杂而感到头疼.提供一个我自己使用的数据库操作类 ...
- php循环的应用案例,php for循环的实例分享
本节内容: php编程中for循环的例子 如图: 例1,php for循环的例子 复制代码 代码示例: for循环例子 - www.jbxue.com for($counter = 1; $count ...
- yii 加载php文件,Yii2框架加载css和js文件的方法分析
本文实例讲述了Yii2框架加载css和js文件的方法.分享给大家供大家参考,具体如下: 1.第一步是要把我们的css.js文件放到web目录下 2.第二步修改assets/AppAsset.php文件 ...
- SEEK学习论坛-JavaWeb开发实训课题 (数据库MySQL+js+Ajax+Servlet)
关于这次学校实训,我们做了一个类似于CSDN博客的项目,然后我们小组取名叫SEEK,一个学习论坛,前面ppt有介绍,我主要是负责后端数据库的,与MySQL交互,由我的组长写好js代码,然后将前端所获取 ...
- java计算机毕业设计vue.js开发红酒网站源码+mysql数据库+系统+lw文档+部署
java计算机毕业设计vue.js开发红酒网站源码+mysql数据库+系统+lw文档+部署 java计算机毕业设计vue.js开发红酒网站源码+mysql数据库+系统+lw文档+部署 本源码技术栈: ...
- 陈力:传智播客古代 珍宝币 泡泡龙游戏开发第42讲:PHP数据库开发案例
陈力:传智播客古代 珍宝币 泡泡龙游戏开发第42讲:PHP数据库开发案例 上节学习了Mysql数据的操作,本节结合贵阳网站建设的实践经验,通过MVC思想进行实例开发和程序设计. 一.网站建设流程介绍 ...
最新文章
- 【转】Extending Lync Server routing with MSPL
- 使用tensorflow书写逻辑回归
- 【CyberSecurityLearning 23】mail server(邮件投递原理)
- 我的电脑不联网,很安全,黑客:你还有风扇呢。。。
- 外媒:为何说中国对美国科技行业的影响与日俱增
- jdba怎么连接mysql_一、JAVA通过JDBC连接mysql数据库(连接)
- Kubernetes Metrics-Server
- 文件加密系统,随时保护终端数据安全
- 3D 空间音效+空气衰减+人声模糊
- 华为手机解锁码快速申请方式
- 深度学习名词(中英文对照)
- 魔域单机版mysql数_魔域数据表!
- iOS开发之定位神器-超简单方式解决iOS后台定时定位
- php 微信 语音,微信语音的上传与下载功能实现详解
- 2023年全国最新会计专业技术资格精选真题及答案18
- 2023大连理工大学计算机考研信息汇总
- UR机器人编译错误收集
- dss nginx 403 forbidden
- 抖音快手短视频批量去水印采集软件v1.8使用文档
- Nginx缓存、静态文件缓存配置
热门文章
- vue项目图片插入不清晰,原因分析及解决办法
- Matplotlib-01-matplotlib画图方式|图形结构
- 580解锁bl工具_第三方ROM即将来临!realme X支持解锁BootLoader
- Computer Vision: A Modern Approach - 计算机视觉书籍阅读笔记 -第六章 - 纹理
- oTree学习教程(二)Models
- 电脑族 久坐不动防病攻略
- C#(Csharp)基础教程(中)(菜鸟教程笔记)
- ActiveMQ+Redis+Dubbo+SpringMVC+Mybatis高并发高集群分布式电商项目视频课程(免费不加密)
- 中国区2011年2季度安全威胁报告
- 未越狱的IOS设备添加ibooks字典