1.把前端最常用的资源css、js存在本地
1.1  前端缓存技术SessionStorage

优点:临时存储神器,关闭页面标签自动回收,不可以跨页面交互。

取值的时候有两种方法,一种是用sessionStorage.getItem("键名"),一种是直接取对象的方法(sessionStorage.键名)

注意:(1)取值的时候要判断是否是undefined或者是null。

(2)页面刷新时不会清楚。同一个浏览器里,不同的页面标签内容是不共享的(比如一个页面存入本地没有关闭,同一个浏览器打开相同的页面链接数据时读取不到的),这是sessionStorage本身的特点。

1.2 userData   是为ie服务的

优点:第一个吃螃蟹的人,也得感谢第一个被吃的螃蟹

缺点:存储限制大小,单个文件的大小限制是128K,一个域名下总共可以保存1024KB的文件,文件个数应该没有限制。在受限站点里这两个值分别是64K和640KB.

1.3 Cookie    兼容性最好的本地存储

优点:兼容性最好,几乎所有浏览器都支持

缺点:大小有限制,而且每次发送请求,请求头里会带着Cookie一起发过去,现在大多数登录的合法性验证都是用cookie验证的。

1.4 openDatabase    没有他做不了的,但是对数据库知识有要求

优点:就是一个完成的数据库

缺点:可能对于前端来说,成本高

1.5  localstorage

优点:兼容性中等,操作简单,就是key-value形似,几乎现代的浏览器都支持。

缺点:存在大小限制,IE9、IE10不支持

注意:不同浏览器读取不到数据(先是用的火狐浏览器,后来换成谷歌浏览器,是读取不到数据的);不同浏览器的存储大小是不一样的,就是一个界值。

前端性能优化---缓存篇SDK的更多相关文章

  1. 前端性能优化JavaScript篇

    关于前端性能优化的讨论一直都很多,包罗的知识也很多,可以说性能优化只有更好,没有最好.前面我写了一篇关于css优化的总结文章,今天再从javascript方面聊一聊. 1.从资源加载方面来说,浏览器的 ...

  2. 前端性能优化(JavaScript篇)

    正巧看到在送书,于是乎找了找自己博客上记录过的一些东西来及其无耻的蹭书了~~~ 小广告:更多内容可以看我的博客 优化循环 如果现在有个一个data[]数组,需要对其进行遍历,应当怎么做?最简单的代码是 ...

  3. Web前端性能优化进阶——完结篇

    前言 在之前的文章 如何优化网站性能,提高页面加载速度 中,我们简单介绍了网站性能优化的重要性以及几种网站性能优化的方法(没有看过的可以狂戳 链接 移步过去看一下),那么今天我们深入讨论如何进一步优化 ...

  4. CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  5. 【前端构建】WebPack实例与前端性能优化

    计划把微信的文章也搬一份上来. 这篇主要介绍一下我在玩Webpack过程中的心得.通过实例介绍WebPack的安装,插件使用及加载策略.感受构建工具给前端优化工作带来的便利. 壹 | Fisrt 曾几 ...

  6. CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  7. Web前端性能优化教程09:图像和Cookie优化

    本文是Web前端性能优化系列文章中的第九篇,主要讲述内容:图像和Cookie优化.完整教程可查看:  一. 图像优化 图像基础知识 gif: 适用于动画效果,例如提示的滚动条图案 jpg: 是一种使用 ...

  8. Web前端性能优化教程06:减少DNS查找、避免重定向

    本文是Web前端性能优化系列文章中的第六篇,主要讲述内容:减少DNS查找.避免重定向.完整教程可查看:  一.减少DNS查找 基础知识 DNS(Domain Name System): 负责将域名UR ...

  9. Web前端性能优化教程08:配置ETag

    本文是Web前端性能优化系列文章中的第五篇,主要讲述内容:配置ETag.完整教程可查看:Web前端性能优化 什么是ETag? 实体标签(EntityTag)是唯一标识了一个组件的一个特定版本的字符串, ...

随机推荐

  1. Two ways to see predicates added by VPD or FGAC

    http://www.bobbydurrettdba.com/2012/07/17/two-ways-to-see-predicates-added-by-vpd-or-fgac/ Two ways ...

  2. Python学习-27.Python中的列表(list)

    列表已经用了很多次了.使用中括号包含元素. list = ['a','b','c'] 获取元素使用[]. print(list[0]) 输出a 不过值得注意的是,[]只能是0到元素个数-1吗?在Pyt ...

  3. 使用Linq对Hashtable和Dictionary<T,T>查询的效率比较

    近期做版本迭代任务,有一个在店铺头部展示店主所在的城市名称和省份名称的需求,店主信息表中保存了店主所在的城市Id和省份Id,由于原有业务复杂,要尽量减少Sql执行时间,所以不考虑join城市地区详细表 ...

  4. 唯品会osp简介(转)

    转自 https://blog.csdn.net/panyongcsd/article/details/58617810 公司(VIP)从2015年开始在内部推动Venus框架的使用,这是一款基于Ap ...

  5. C# npoi 从excel导入datagridviews 批量联网核查

    DataSet ds = new DataSet(); OpenFileDialog openFileDialog = new OpenFileDialog(); openFileDialog.Fil ...

  6. AJPFX平台有哪些优势?

    AJPFX为全世界的客户提供高端金融投资产品服务.在欧洲,大洋洲.北美洲,亚洲均设有交易专用服务器,以保证交易系统正常和高速运作.给投资者提供可靠.稳定.正确的交易服务系统也是我们一直以来为客户提供的 ...

  7. s11 day105

  8. [USACO06DEC] 牛奶模式Milk Patterns

    题目链接:戳我 我们知道后缀数组的h数组记录的是后缀i和后缀i-1的最长公共前缀长度,后缀的前缀其实就是子串. 因为是可以重复出现的子串,所以我们只要计算哪些h数组的长度大于等于x即可.这一步操作我们 ...

  9. Android的四大组件学习

    一.Linearlayout  :  线性布局 1. android:orientation="vertical"     //控件的方向控制,vertical : 垂直布局 ,  ...

  10. falcon nodata 小坑一枚

    按照官方文档配置完一切正常,唯独 nodata, 明明有正常的数据,但是为什么 nodata 会认为是没收到呢 困扰许久,直到看了数据库中的数据才恍然大悟 falcon_portal库中的 hosts ...