浅谈localStorage的使用场景和优劣势,以及sessionStorage和cookie
一、localStorage,sessionStorage,cookie的简单介绍
localStorage:仅在客户端存储不参与服务器通信,存储大小一般为5M,如果不是人为清除,那么即使是关闭浏览器也会一直存在。
sessionStorage:仅在客户端存储不参与服务器通信,存储大小一般为5M,会话级存储,也就是说如果关闭当前页面或者浏览器那么就会清除
cookie:客户端存储,参与服务器通信,存储大小为4k,可设置生命周期,在设置的生命周期内有效
二、localStorage的优势及其注意点
在存储方面localstorage和sessionStorage具有巨大优势,大小为5M,比cookie大多了,所以可以用localStorage来做一些相对不太会改变的数据缓存或者说可以缓存用户的足迹,换个说法,localStorage是一个小型的数据库。
localStorage的值为string类型,这就说明我们在使用的时候要进行类型转换。
三、localStorage的缺点和痛点
一:在浏览器隐私模式下不可读取。
二:不同浏览器无法共享localStorage。
不同浏览器无法共享localStorage,相同浏览器的不同页面间可以共享相同的 localStorage(页面属于相同域名和端口),但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是,页面及标 签页仅指顶级窗口,如果一个标签页包含多个iframe标签且他们属于同源页面,那么他们之间是可以共享sessionStorage的。
三:localStorage不能被爬虫获取。
四:因为localStorage的本质是对字符串的读取,如果存储内容多的话会消耗内存空间,会导致页面变卡;并且localStorage 是同步的 (会阻塞渲染)。
五:浏览器会在第一个请求的时候就将数据加载到内存中 (浪费用户内存RAM)。
四、localStorage的三种存储方法
1.Windows.localStorage.name = 'value'
2.Windows.localStorage[name] = 'value'
3.Windows.localStorage.setItem('name','value')
五:兼容性

OK,对于localStorage和sessionStorage及cookie介绍就到这里了,有什么问题可以在下面留言,欢迎提问!
浅谈localStorage的使用场景和优劣势,以及sessionStorage和cookie的更多相关文章
- 浅谈localStorage本地存储
在年会的抽奖程序中用到了localStorage现在拿出来总结下,localStorage的相关用法. 在年会抽奖的程序中,需要把获奖名单存储下来,年会现场没有网络,能最简单实现数据存储的方式就是,将 ...
- 浅谈localStorage的用法
今天接到一个任务,说是让自动调节textarea标记的输入高度,而且还要记录下来,下次登录的时候还是调节后的高度,我第一时间就想到了localStorage的用法,直接代码献上: <html l ...
- 浅谈localStorage、sessionStorage 与cookie
由于工作的需要,今天使用了下localStorage.sessionStorage和cookie,感觉这玩意儿还挺好用的. 关于localStorage与sessionStorage的知识点以及用法之 ...
- [nRF51822] 14、浅谈蓝牙低功耗(BLE)的几种常见的应用场景及架构(科普类干货)
蓝牙在短距离无线通信领域占据举足轻重的地位—— 从手机.平板.PC到车载设备, 到耳机.游戏手柄.音响.电视, 再到手环.电子秤.智能医疗器械(血糖仪.数字血压计.血气计.数字脉搏/心率监视器.数字体 ...
- 浅谈Vue不同场景下组件间的数据交流
浅谈Vue不同场景下组件间的数据“交流” Vue的官方文档可以说是很详细了.在我看来,它和react等其他框架文档一样,讲述的方式的更多的是“方法论”,而不是“场景论”,这也就导致了:我们在阅读完 ...
- 【Vue】浅谈Vue不同场景下组件间的数据交流
浅谈Vue不同场景下组件间的数据“交流” Vue的官方文档可以说是很详细了.在我看来,它和react等其他框架文档一样,讲述的方式的更多的是“方法论”,而不是“场景论”,这也就导致了:我们在阅读完 ...
- 浅谈Spark应用程序的性能调优
浅谈Spark应用程序的性能调优 :http://geek.csdn.net/news/detail/51819 下面列出的这些API会导致Shuffle操作,是数据倾斜可能发生的关键点所在 1. g ...
- 浅谈蓝牙低功耗(BLE)的几种常见的应用场景及架构(转载)
转载来至beautifulzzzz,网址http://www.cnblogs.com/zjutlitao/,推荐学习 蓝牙在短距离无线通信领域占据举足轻重的地位—— 从手机.平板.PC到车载设备, 到 ...
- 浅谈Mysql共享锁、排他锁、悲观锁、乐观锁及其使用场景
浅谈Mysql共享锁.排他锁.悲观锁.乐观锁及其使用场景 Mysql共享锁.排他锁.悲观锁.乐观锁及其使用场景 一.相关名词 |--表级锁(锁定整个表) |--页级锁(锁定一页) |--行级锁(锁 ...
随机推荐
- OpenWrt下基于OLSR的Ad-Hoc组网实现网络摄像头多节点访问
文章目录 Ad-Hoc组网配置 摄像头端口映射 PC连接设置 结果 Ad-Hoc组网配置 参照博客 链接: link. 摄像头端口映射 这里使用到了海康网络摄像头,先将网络摄像头的网口连接到任意一个节 ...
- linux的Umask 为022 和027 都是什么意思?
用全部权限777去减这个数值 一.022表示默认创建新文件权限为755 也就是 rxwr-xr-x(所有者全部权限,属组读写,其它人读写) 二.027表示默认创建新文件权限为750 也就是rxwr- ...
- 宝塔linux面板防护CC设置
使用宝塔linux面板很多用户受到CC攻击不知如何防范. 下面讲下如何利用宝塔自带的功能来进行基本的CC防护. 首先是在nginx上有个waf安全模块,里面有CC防护设置.(要求nginx为1.12版 ...
- mysql多实例启动、关闭
启动(指定参数文件): [root@mysql01 ~]# mysqld_safe --defaults-file=/data/3306/my.cnf & [root@mysql01 ~]# ...
- Unity 黑暗之光 笔记 第三章
第三章 角色控制 1.创建游戏运行场景并导入素材资源 2.创建和管理标签 1 //const 表明这个是一个共有的不可变的变量 2 public const string ground = &qu ...
- C#中的深度学习(一):使用OpenCV识别硬币
在本系列文章中,我们将使用深度神经网络(DNN)来执行硬币识别.具体来说,我们将训练一个DNN识别图像中的硬币. 在本文中,我们将描述一个OpenCV应用程序,它将检测图像中的硬币.硬币检测是硬币完整 ...
- 基于Layuimini的自己封装后台模板
基于Layui的后台模板,正在开发中 交流qq群:1062635741 邮箱:zhangqueque.foxmail.com GitHub:https://github.com/ZhangQueque ...
- Python爬取热搜存入数据库并且还能定时发送邮件!!!
一.前言 微博热搜榜每天都会更新一些新鲜事,但是自己处于各种原因,肯定不能时刻关注着微博,为了与时代接轨,接受最新资讯,就寻思着用Python写个定时爬取微博热搜的并且发送QQ邮件的程序,这样每天可以 ...
- javascript之原型、原型链
一.原型: 1. 任何函数都有prototype属性(对象才有属性,函数也是对象): 2. 函数的prototype属性的值是个对象,这个对象就是原型(对象): 3. 作用:通过构造函数创建出来的对象 ...
- webform中ajax.ajaxMethod使用方法
前言 dll文件 如果还没有ajax.dll文件,就先下载一个来 引用 将ajax.dll添加到项目引用中:在VS的解决方案资源管理器中右键点击项目名称--"添加项目引用"--浏览 ...