一般来说,对于html页面,一个站点,每个页面都会有相同的公共文件,比如页面的头部、尾部、侧边栏目、公共JS等。访问站点下的每一个页面,相同的公共文件,都需要重复从服务器下载。从性能和带宽角度看,重复下载相同内容对性能不利,同时也会占用带宽。因此include进来的公共文件,是否有办法缓存这些文件呢?这就是这里需要重点讨论的内容。 假设有这样一个站点,包含有页面头部、侧边栏、页面尾部、公共JS。布局如下图:

实现原理:

来看一个简单的demo。以前面页面框架为例,假设header里面有内容是通过JS来输出,侧边栏是全部的HTML,现在要缓存header中的JS和侧边栏的HTML。先来看核心的HTML代码(SSI部分):

HTML之实现页面缓存的更多相关文章

  1. 探索ASP.NET MVC5系列之~~~5.缓存篇(页面缓存+二级缓存)

    其实任何资料里面的任何知识点都无所谓,都是不重要的,重要的是学习方法,自行摸索的过程(不妥之处欢迎指正) 汇总:http://www.cnblogs.com/dunitian/p/4822808.ht ...

  2. Nginx 反向代理、负载均衡、页面缓存、URL重写及读写分离详解

    转载:http://freeloda.blog.51cto.com/2033581/1288553 大纲 一.前言 二.环境准备 三.安装与配置Nginx 四.Nginx之反向代理 五.Nginx之负 ...

  3. cache-contro页面缓存处理设置

    <meta http-equiv="pragma" content="no-cache">,pragma与no-cache用于定义页面缓存,不缓存页 ...

  4. webform的页面缓存

    给页面添加<%@ OutputCache Duration="10" VaryByParam="*"%>标签就可以启用页面缓存. Duration表 ...

  5. 【WP开发】正确理解页面缓存

    注:本文内容面向Runtime App. 在新建项目后,细心观察,你会发现在App类中有以下代码: // TODO: 将此值更改为适合您的应用程序的缓存大小 rootFrame.CacheSize = ...

  6. [转]MVC3缓存之一:使用页面缓存

    本文转自:http://www.cnblogs.com/parry/archive/2011/03/19/OutputCache_In_MVC3.html 在以前的WebForm的开发中,在页面的头部 ...

  7. [转]Asp.net mvc 网站之速度优化 -- 页面缓存

    网站速度优化的一般方法 由于网站最重要的用户体验就是速度,特别是对于电子商务网站而言. 一般网站速度优化会涉及到几个方面: 1. 数据库优化 — 查询字段简历索引,使用数据库连接池和持久化,现在还有种 ...

  8. Nginx反向代理、负载均衡、页面缓存、URL重写及读写分离详解

    大纲 一.前言 二.环境准备 三.安装与配置Nginx 四.Nginx之反向代理 五.Nginx之负载均衡 六.Nginx之页面缓存 七.Nginx之URL重写 八.Nginx之读写分离 注,操作系统 ...

  9. ASP.NET 页面缓存

    ASP.NET 实现页面缓存页面缓存的使用方法非常的简单,只需要在aspx页的顶部加一句声明<%@ OutputCache Duration="60" VaryByParam ...

  10. MVC3缓存之一:使用页面缓存

    MVC3缓存之一:使用页面缓存 在MVC3中要如果要启用页面缓存,在页面对应的Action前面加上一个OutputCache属性即可. 我们建一个Demo来测试一下,在此Demo中,在View的Hom ...

随机推荐

  1. Redis vs Mongo vs mysql

    Redis 和 Mongo 都属于 No-SQL类型的数据库,他们的区别,联系是什么呢?看了一些文章,特总结如下. Redis 最大的特点是,快!为什么快,因为他将大量的东西存储在了memory中.但 ...

  2. DOM扩展学习笔记

    对DOM的两个主要扩展是Selectors API(选择符API)和HTML5,还有一个不太瞩目的Element Traversal元素遍历规范为DOM添加了一些属性,另外还有一些专有扩展. 选择符A ...

  3. 1、初识JavaScript

    前端之 JavaScript 1.存在方式. <!-- 导入javascript脚本方法 --><script type="text/javascript" sr ...

  4. 取得选中Grid的数据

    var MergeAction = new Ext.Action({ text: '合并(选中两行)', handler: function () { if (grid.getSelectionMod ...

  5. MyBatis For .NET学习-问题总结

    1. MyBatis在进行sqlserver与c# 类型转换时需要注意,sqlserver中dbtype为float时,c#需要使用double与之对应,而不能使用float或decimal 2. M ...

  6. android 如何获取当前的Activity类名

    比如友盟统计页面停留时间,咱们需要知道当前页面停留了多久. 一般我们都有一个父类Activity,用下面的方法可以获得完整的包名.类名结构 this.getLocalClassName() 输出如下: ...

  7. Swoole学习(一)了解一下Swoole的强大并在Centos安装Swoole及PHP扩展开启

    Swoole是面向生产环境的 PHP 异步网络通信引擎,官网:https://www.swoole.com/ 使 PHP 开发人员可以编写高性能的异步并发 TCP.UDP.Unix Socket.HT ...

  8. jquery获取select选中项的文本

    使用jquery获取选中的值很简单 $("#select").val(); 但是获取选中的文本就没有这么直接了 $("#select").find(" ...

  9. jquery的prev选择器无效

    今天使用jquery操作dom 需要把当前元素的同级元素中前面带有属性a=1的元素筛选出来. 查看api, .prev()  获得匹配元素集合中每个元素紧邻的前一个同辈元素,由选择器筛选(可选). 看 ...

  10. CSS Tooltip(提示工具)

    CSS Tooltip(提示工具) 提示工具在鼠标移动到指定元素后触发,可以在四个方位显示:头部显示.右边显示.左边显示.底部显示 一.基础提示框(Tooltip) 提示框在鼠标移动到指定元素上显示: ...