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. Python学习-38.Python中的正则表达式(二)

    在Python中,正则表达式还有较其他编程语言有特色的地方.那就是支持松散正则表达式了. 在某些情况,正则表达式会写得十分的长,这时候,维护就成问题了.而松散正则表达式就是解决这一问题的办法. 用上一 ...

  2. .NET 调试入门(二) dump 出程序数据

    前言          有时候我们需要看程序中运行情况怎么,如:某对象字段的具体值是多少等问题,我们就可以用调试工具找到答案.我们还是沿用前面的程序.原代码在文章低部. dump栈上的值 在线程4中输 ...

  3. Swiper使用方法(向前和向后按钮在swiper-container外面)

    Swiper插件的使用 1.HTML <!-- Swiper --> <section class="swipper"> <div class=&qu ...

  4. Linux系统发布ASP.NET项目

    一.安装配置Jexus服务 注:root权限下执行,Linux版本:CentOS-7 1.安装Jexus 5.8.1 "独立版"软件 该"独立版"支持64位的C ...

  5. JEECG(二) JEECG框架下调用webservice java springmvc maven 调用 webservice

    JEECG系列教程二 如何在JEECG框架下使用webservice 本文所使用的webservice是c#开发的 其实无论是什么语言开发的webservice用法都一样 java springmvc ...

  6. VUE.js 中取得后台原生HTML字符串 原样显示问题

    今天使用vue调试页面,发现了页面上的一个问题,后台数据传过来的HTML字符串并没有被转换为正常的HTML代码,一拍脑门,发现忘记转换了,于是满心欢喜加上了{{{}}}.但是之后构建发现报错: 为此去 ...

  7. MYSQL社区版安装手册

    https://www.jb51.net/article/140412.htm 在本教程中使用MySQL最新的MySQL服务8.0.11的社区绿色版本进行安装,绿色版为zip格式的包,安装分为以下四步 ...

  8. Django templates html中进行模板渲染时使用python语法的基本方式

    导包(可以在模板中导入python包进行使用): <%!import urllib%> <%! from ** import **%> 使用if for等python语句: % ...

  9. Union Find-547. Friend Circles

    There are N students in a class. Some of them are friends, while some are not. Their friendship is t ...

  10. java实现简单扫雷游戏

    /** * 一个简单的扫雷游戏 MainFram.java */ package www.waston; import java.awt.BorderLayout; import java.awt.C ...