首页
学习
活动
专区
圈层
工具
发布

大型Electron应用本地数据库技术选型

: [56,99,47,49,53,52] } ] 检索 在10000行数据中按主键检索8000行数据 ?...] } ] 删除 SQLite 已存在10000行数据的前提下,删除200行数据(毫秒):18、16、18 已存在10000行数据的前提下,删除8000行数据(毫秒):18 已存在10000行数据的前提下...,删除10000行数据(毫秒):18 IndexedDB 已存在10000行数据的前提下,删除200行数据(毫秒):21、10、10 已存在10000行数据的前提下,删除8000行数据(毫秒):58 已存在...10000行数据的前提下,删除10000行数据(毫秒):30 更新 SQLite 已存在10000行数据的前提下,更新1行数据(毫秒):8、8、8、9、8、8 已存在10000行数据的前提下,更新100...的C代码,这个过程可能是性能损耗的一大主要原因 最后: 综合对比下来,大型Electron应用更推荐使用IndexedDB来存储业务数据 (由于有Dexie的加持,IndexedDB操作也足够简单,所有中小型应用也是不错的选择

7.5K40

HTML5学习-day02【悟空教程】

现在可以在不刷新的状况下操作浏览器地址栏和历史记录了,那同一站点的普通链接跳转是否都可以转变为Ajax来提升使用体验?是的,而且已经有了pjax[]这些专门完成这个功能的作品。...} 另外,用户想要更新缓存,可以通过删除缓存文件的方式来清除缓存。...,它肯定是一个数据库,而说到数据库,有两种不同类型的数据库,就是关系型数据库和非关系型数据库,关系型数据库如Mysql、Oracle等将数据存储在表中,而非关系型数据库如Redis、MongoDB等将数据集作为个体对象存储...indexedDB的特性 1.对象仓库 有了数据库后我们自然希望创建一个表用来存储数据,但indexedDB中没有表的概念,而是objectStore,一个数据库中可以包含多个objectStore,objectStore...也就是说一个objectStore相当于一张表,里面存储的每条数据和一个键相关联。

2.2K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JWT( JSON Web Token )的 实践,以及与 Session 对比

    如何判断 token 过期? 应用 由上可知,jwt 并不对数据进行加密,而是对数据进行签名,保证不被篡改。除了在登录中可以用到,在进行邮箱校验和图形验证码也可以用到。...图形验证码的原理是给客户端一个图形,并且在服务器端保存与这个图片配对的字符串,以前也大都通过 session 来实现。 可以把验证码配对的字符串作为 secret,进行无状态校验。...如何允许用户只能在最近五个设备登录,如诸多播放器 session: 使用 sql 类数据库,创建 token 数据库表,有 id, token, user_id 三个字段,user 与 token 表为...每次登录添加一行记录。根据 token 获取 user_id,再根据 user_id 获取该用户有多少设备登录,超过 5 个,则删除最小 id 一行。...jwt: 使用计数器,使用 sql 类数据库,在用户表中添加字段 count,默认值为 0,每次登录 count 字段自增1,每次登录创建的 jwt 的 Payload 中携带数据 current_count

    3.5K20

    HTML5 学习总结(三)——本地存储(localStorage、sessionStorage、WebSqlDataBase、IndexedDB)

    :在Indexed Database中,objectstore代替了传统的表的概念,每个objectstore相当于一个key和value的集合,IndexedDB并不像传统的如SQL Server那样需要额外安装...IndexedDB使用NoSQL的形式来操作数据库,保存和读取是JavaScript对象,同时还支持查询及搜索。...的一个重要作用 有了数据库后我们自然希望创建一个表用来存储数据,但indexedDB中没有表的概念,而是objectStore,一个数据库中可以包含多个objectStore,objectStore是一个灵活的数据结构...5.3、事务 所有读取或修改数据的操作,都要通过事务来完成。...如果需要修改或删除数据,就需要打开成读写模式。 2. cursor的非空校验是必要的。 3. 修改或删除的操作也是有onsuccess和onerror的,只是在示例中没有写出来。 4.

    8.3K100

    jwt 实践应用以及特殊案例思考

    带个问题,如何判断 token 过期? 应用 由上可知,jwt 并不对数据进行加密,而是对数据进行签名,保证不被篡改。除了在登录中可以用到,在进行邮箱校验,图形验证码和短信验证码时也可以用到。...图形验证码的原理是给客户端一个图形,并且在服务器端保存与这个图片配对的字符串,以前也大都通过 session 来实现。 可以把验证码配对的字符串作为 secret,进行无状态校验。...如何允许用户只能在最近五个设备登录,如诸多播放器 session: 使用 sql 类数据库,创建 token 数据库表,有 id, token, user_id 三个字段,user 与 token 表为...每次登录添加一行记录。根据 token 获取 user_id,再根据 user_id 获取该用户有多少设备登录,超过 5 个,则删除最小 id 一行。...jwt: 使用计数器,使用 sql 类数据库,在用户表中添加字段 count,默认值为 0,每次登录 count 字段自增 1,每次登录创建的 jwt 的 Payload 中携带数据 current_count

    2.8K10

    ES6(四)用Promise封装一下IndexedDB 配置文件内部成员建立对象库以及打开数据库初始化对象添加对象修改对象删除对象清空仓库里的对象删除对象仓库删除数据库按主键获取对象,

    indexedDB IndexedDB 是一种底层 API,用于在客户端存储大量的结构化数据,它可以被网页脚本创建和操作。...需求 我想更好的实现文档驱动的想法,发现需要实现前端存储的功能,于是打算采用 IndexedDB 来实现前端存储的功能。但是看了一下其操作方式比较繁琐,所以打算封装一下。...于是只好先把对象拿出来,然后和新对象合并一下,然后再put回去,于是代码就又变得这么长了。 删除对象 /** * 依据id删除对象。...这个就非常简单了,不用判断是否打开数据库,直接删除就好。 不过前端数据库应该具备这样的功能:整个库删掉后,可以自动恢复状态才行。 按主键获取对象,或者获取全部 /** * 获取对象。...对象 第二个参数是要添加的对象,其属性必须有主键和索引,其他随意。 返回值 成功后会返回对象ID 点右键可以刷新数据,如图: ? 更新后的数据,如图: ?

    2.5K20

    认识浏览器缓存

    2 选择正确的浏览器缓存 在一个具体的工程项目中,我们该如何使用缓存来帮助我们解决问题,或者优化我们的工程是一个值得讨论的事情。...和传统数据库操作中的事务概念类似,表示一系列操作的整体性,如果某一步出错,则整体操作回滚 操作请求 window.indexedDB.open方法将创建一个操作请求:IDBRequest对象。...2 数据库相关特性 虽然indexedDB不是传统意义上的数据库,但是其设计初衷是希望能够在浏览器上提供一个类似于NoSQL数据库形式的接口给到开发者使用,所以一些数据库中的特性也被引入过来,比如:事务操作...下面简要对WebSQL的概念和相关用法做一些描述: 1)概念 WebSQL同IndexedDB类似,都属于前端数据库存储的一种,和IndexedDB不同的是,WebSQL是关系型数据库,所有的关于库,表的操作都通过...2)关键API 和indexedDB不同的是,WebSQL大部分调用都通过传SQL语句进行的,所以WebSQL的关键API非常少,只有3个: API 说明 openDatabase window的全局方法

    1.8K61

    最全Excel 快捷键总结,告别鼠标!

    (特别重要) Ctrl+5:应用或取消删除线。 Ctrl+6:在隐藏对象和显示对象之间切换。 Ctrl+8:显示或隐藏分级显示符号。 Ctrl+9:隐藏选定的行。(重要) Ctrl+0:隐藏选定的列。...在已拆分(通过依次单击“视图”菜单、“管理此窗口”、“冻结窗格”、“拆分窗口”命令来进行拆分)的工作表中,在窗格和功能区区域之间切换时,按 F6 可包括已拆分的窗格。...Ctrl+4:应用或取消下划线 Ctrl+5:应用或取消删除线 Ctrl+6:在隐藏对象和显示对象之间切换。 Ctrl+8:显示或隐藏分级显示符号。 Ctrl+9:隐藏选定的行。...Ctrl+H:显示“查找和替换”对话框,其中的“替换”选项卡处于选中状态。 Ctrl+K:为新的超链接显示“插入超链接”对话框,或为选定的现有超链接显示“编辑超链接”对话框。...Delete 从选定单元格中删除单元格内容(数据和公式),而不会影响单元格格式或批注。 在单元格编辑模式下,按该键将会删除插入点右边的字符。 Backspace 在编辑栏中删除左边的一个字符。

    10.3K60

    Kettle安装详细步骤和使用示例

    Kettle这个ETL工具集,它允许你管理来自不同数据库的数据,通过提供一个图形化的用户环境来描述你想做什么,而不是你想怎么做。...Kettle中有两种脚本文件,transformation和job,transformation完成针对数据的基础转换,job则完成整个工作流的控制。...kettle中自动创建了使用kettle所需要的表结构 ---- 如何添加新用户 点击工具>>资源库>>探索资源 选择【安全】>>点击加号添加用户>>填写账号密码保存 功能栏简介 ---- 3....,包括“使节点连接时效”,“删除节点连接”等 5.双击“表输入”步骤进行配置, 在弹出的配置对话框中,点击 “新建”按钮配置数据库的连 接信息。...在弹出的配置 对话框中,点击选定“文件& 工作表”进行配置 ➢在“Microsoft Excel 输出”步骤 的配置对话框中,点击选定“内容” 进行配置。

    4.3K10

    【javascript】谈谈HTML5—Web Worker+canvas+indexedDB+拖拽事件

    但就在不久的将来,你可能就会用到,甚至依赖于它(毕竟这就是HTML的未来) H5中的知识点分布 在下面, 我将学习H5中的知识点分成两类:主要知识点和针对特定功能的知识点,其中对主要知识点的部分,从学习成本的角度对其进行了难度分级...通过db.createObjectStore创建对象存储空间,并取得ObjectStore对象(类似于SQL数据库中的建表操作) 2. ...现在让我们对indexedDB做一个小小的总结: 1. indexedDB是面向对象的, 与传统的以二维表为基础的数据库不同 2....appendChild之类的API实现添加被拖拽的元素,从而模拟整个拖拽的过程 也就是说, 拖拽其实可分为三个过程: 拖动—传递被拖动元素的数据(如id)—在容器元素中添加该元素 关键在于如何在被拖动元素和被放置元素中传递数据...,这可以通过event.dataTransfer对象来实现 dataTransfer可以通过setData方法添加拖动数据,并通过getDate方法取得拖动数据,我们可以在 ondragstart事件和

    4.2K100

    【javascript】谈谈HTML5: Web-Worker、canvas、indexedDB、拖拽事件

    但就在不久的将来,你可能就会用到,甚至依赖于它(毕竟这就是HTML的未来) H5中的知识点分布 在下面, 我将学习H5中的知识点分成两类:主要知识点和针对特定功能的知识点,其中对主要知识点的部分,从学习成本的角度对其进行了难度分级...通过db.createObjectStore创建对象存储空间,并取得ObjectStore对象(类似于SQL数据库中的建表操作) 2. ...现在让我们对indexedDB做一个小小的总结: 1. indexedDB是面向对象的, 与传统的以二维表为基础的数据库不同 2....appendChild之类的API实现添加被拖拽的元素,从而模拟整个拖拽的过程 也就是说, 拖拽其实可分为三个过程: 拖动—传递被拖动元素的数据(如id)—在容器元素中添加该元素 关键在于如何在被拖动元素和被放置元素中传递数据...,这可以通过event.dataTransfer对象来实现 dataTransfer可以通过setData方法添加拖动数据,并通过getDate方法取得拖动数据,我们可以在 ondragstart事件和

    3.5K30

    RPA与Excel(DataTable)

    二、Excel操作的注意点 1. 同一个表格中不要存在相同列名的数据; 2. Excel中不能存在外链接; 3....在工作表内移动和滚动 向上、下、左或右移动一个单元格:箭头键 移动到当前数据区域的边缘:Ctrl+箭头键 移动到行首:Home 移动到工作表的开头:Ctrl+Home 移动到工作表的最后一个单元格,位于数据中的最右列的最下行...以“结束”模式移动或滚动 打开或关闭“结束”模式:End 在一行或一列内以数据块为单位移动:End+箭头键 移动到工作表的最后一个单元格,在数据中所占用的最右列的最下一行中:End+Home 移动到当前行中最右边的非空单元格...创建图表和选定图表元素 创建当前区域中数据的图表:F11 或 Alt+F1 选定图表工作表:选定工作簿中的下一张工作表,直到选中所需的图表工作表:Ctrl+Page Down 选定图表工作表:选定工作簿中的上一张工作表...显示、隐藏和分级显示数据 对行或列分组:Alt+Shift+向右键 取消行或列分组:Alt+Shift+向左键 显示或隐藏分级显示符号:Ctrl+8 隐藏选定的行:Ctrl+9 取消选定区域内的所有隐藏行的隐藏状态

    8.6K20

    【缓存】HTML5缓存的那些事

    HTML的存储-UserData 只有IE支持,有微软提供API,但不符合W3C标准; 存储在XML文件中; HTML5的存储 针对以上问题,HTML5的出现,需要解决以下问题: 解决4K的大小问题;...数组(需要将其序列化为字符串才能存储); json数据——将其转化为字符串存储; 图片 脚本、样式文件:通过ajax 只要能被转化为字符串的数据,都能被localstorage存储; 本地存储如何存储图片...,减少网络传输 在弱网络的环境下,会发生高延迟,低带宽,应该尽量把数据(如脚本、样式)本地化; 我们来看一张图,显示的是本地存储和网络拉取耗时的对比: IndexedDB 概念 IndexedDB,是一种能做浏览器中持久地存储结构化数据的数据库...,每个数据库可以创建对个对象存储空间(表/table),一个对象存储空间可以存储多个对象数据; 如图: 使用IndexedDB实现离线数据库 这里我们主要从IndexedDB 的四大功能入手: 增删改...(tableName)){ //存在这个表 console.log("包含表:"+tableName); //通过事物机制操作一个表的读写,从而保证数据的一致性和可靠性

    1.2K50

    indexedDB_INDEX函数

    【因为indexedDB 是异步的,所以它所有的操作都必须建立一个请求(request),请求的结果将被封装在request实例中返回】 如果不存在指定的数据库,则创建数据库,然后连接数据库,返回...库版本 一个数据库同一时间只能存在一个最新的版本(该版本记录了当前使用的数据库和表结构) 只有在修改数据库结构和表结构时,版本才需要升级 修改数据库结构和表结构或升级数据库版本对数据库内的数据一般没有影响...事务 所有记录的增删改查都要在事务中进行 之所以引入事务,是为了保证操作顺序和可靠性 顺序:事物中所有的操作必须排队进行 可靠性: 在【同一个事务】中,对于【同一张表】的一组操作有一个失败,之前的都回滚...传入的表名称必须在transaction()方法的第一个参数中指定,否则将会报错,比如最后一行读取的就是一个没有指定的表,将会报以下错误: 添加记录 objectStore.add(object..., 第一个查询由于没有name为张三的用户,所以返回为undefined 第二个和第三个查询,分别以age与sex来查询,都查到了相应的结果 但是,查询到的结果都只有一条,但是我们前面看到,age为16

    1.3K50

    【8】数据浏览表格的快速输出

    在实际的应用中,配合JQuery、CSS样式表和Ajax,可以发挥强大的威力,达到“无所不能”的境界。 表格还是列表? 输出数据库中数据列表,实际上就是以格式化的方法,把一个多行多列的数据展示出来。...行高度、各列的宽度、对齐等都需要控制管理,特定条件下,还可能遇到错行的情况。 下面,我们不妨按照上述的构造思路构造一个数据列表,使用的范例数据库中book表数据如下: ?...2、列的隐藏。某些列,可能会用到,但是不需要显示。比如,ID列。 3、控制链接。对每行数据的具体的控制操作,常用的有删除和编辑。 4、跳转链接。单击行,跳转到某个展示链接。...id=KeyField' target='_blank" 2、修改链接的名称 编辑和删除链接的名字是函数自动生成的,如果要修改,可以通过对生成的HTML进行提花完成。...4、前端代码需要ID列,但不要显示 可以通过JS代码或者JQuery代码隐藏第一列。 5、新增控制列 可以通过前端代码,对行或者表格的单击事件进行处理,提取该行的ID,并转换为相应的控制链接。

    3.3K50

    浏览器数据库 IndexedDB 入门教程

    如果要修改数据库结构(新增或删除表、索引或者主键),只能通过升级数据库版本完成。 (2)对象仓库 每个数据库包含若干个对象仓库(object store)。它类似于关系型数据库的表格。...(3)数据记录 对象仓库保存的是数据记录。每条记录类似于关系型数据库的行,但是只有主键和数据体两部分。主键用来建立默认的索引,必须是不同的,否则会报错。...(4)索引 为了加速数据的检索,可以在对象仓库里面,为不同的属性建立索引。 (5)事务 数据记录的读写和删改,都要通过事务完成。...写入操作是一个异步操作,通过监听连接对象的success事件和error事件,了解是否写入成功。 3.4 读取数据 读取数据也是通过事务完成。...; } }; } readAll(); 上面代码中,新建指针对象的openCursor()方法是一个异步操作,所以要监听success事件。

    96810

    浏览器数据库 IndexedDB入门

    如果要修改数据库结构(新增或删除表、索引或者主键),只能通过升级数据库版本完成。 (2)对象仓库 每个数据库包含若干个对象仓库(object store)。它类似于关系型数据库的表格。...(3)数据记录 对象仓库保存的是数据记录。每条记录类似于关系型数据库的行,但是只有主键和数据体两部分。主键用来建立默认的索引,必须是不同的,否则会报错。...(4)索引 为了加速数据的检索,可以在对象仓库里面,为不同的属性建立索引。 (5)事务 数据记录的读写和删改,都要通过事务完成。...写入操作是一个异步操作,通过监听连接对象的success事件和error事件,了解是否写入成功。 3.4 读取数据 读取数据也是通过事务完成。...; } }; } readAll(); 上面代码中,新建指针对象的openCursor()方法是一个异步操作,所以要监听success事件。

    76740

    深入浅出前端本地储存

    CSRF 攻击的安全风险 Cookie 只允许储存 4kb 的数据 Cookie 的操作较为繁琐复杂(这一点倒是可以通过使用类库来解决) 有人说由于浏览器每次请求都会带上 Cookie,因此 Cookie...这里用 Excel 类比,简单介绍数据库的基本概念,不做太深入的讨论 需要了解四个基本概念,以关系型数据库为例 数据库 Database 数据表 Table(IndexedDB 中叫 ObjectStore...,或者删除 id 这种每条数据唯一的值,就可以被用来做主键(primary key),主键在表内独一无二,无法添加相同主键的数据 而主键一般会被建立索引,所谓对字段建立索引,就是可以根据这个字段的值,在表里非常快速的找到对应的数据...(通常不高于 O(logN)),如果没有索引,那可能就需要遍历整个表(O(N)) 增、删、改、查这些操作,都需要通过事务 Transaction 来完成 如果事务中任何一个操作没有成功,整个事务都会回滚...(不断完善中): https://godb-js.github.io/ 总之,GoDB 可以 帮你在背后处理好 IndexedDB 各种繁琐操作 帮你在背后维护好数据库、数据表和字段 以及字段的索引,各种属性

    1K10

    JavaScript是如何工作的:存储引擎+如何选择合适的存储API

    所以,来看看可选择的数据模型: 结构化: 存储在具有预定义字段的表中的数据(这是典型的基于 SQL 的数据库管理系统)适行灵活的动态查询。...你可以通过 caches 属性访问 CacheStorage . IndexedDB ? IndexedDB 是一种在用户浏览器中持久存储数据的方法。...IndexedDB的内部结构 IndexedDB 通过“键”来存储和检索对象。对数据库所做的所有更改都发生在事务中,像大多数 Web 存储解决方案一样,IndexedDB 遵循同源策略。...IndexedDB是面向对象的 — indexedDB 不是用二维表来表示集合的关系型数据库,这一点非常重要,将影响你设计和建立你的应用程序。...indexedDB 不使用结构化查询语言(SQL) — 它通过索引(index)所产生的指针(cursor)来完成查询操作,从而使你可以迭代遍历到结果集合。

    2.3K10
    领券