一个link加载多个css文件
细看正则时匹配慕课网链接时发现的,一个link加载多个css文件
http://static.mukewang.com/static/css/??base.css,common/common-less.css?t=2.5,u/u_common-less.css,u/plans-less.css,u/dynamic/home-less.css?v=201708111926
淘宝也有这样的链接
http://a.tbcdn.cn/p/fp/2011a/??html5-reset-min.css,global-min.css,header/header-min.css,product-list/product-list-min.css,attraction/attraction-min.css,expressway/expressway-min.css,category/category-min.css,category/sub-promotion-min.css,guide/guide-min.css,hotsale/hotsale-min.css,bottom-gg/bottom-gg-min.css,subfooter/subfooter-min.css,local-life/local-life-min.css,footer/footer-min.css?t=20111213.css
原先我们使用link时每一个加载一个css文件,这种方式有一些缺点:
1、浏览器可以并行的http请求数量有限,不能满足大型站点的要求;
2、如果不支持keep-alive,tcp连接的重建也需要花费一些时间,导致延迟增加;
3、即使支持keep-alive,过多的请求头和响应头会增加大量的数据开销;
上面链接的方式是在服务器接收到请求之后,把页面需要的资源进行合并,一起返回给浏览器,这样只需要一次http请求,就能够获得所需要的资源文件,节省网络开销。
只是这是网站的CDN具备的独有功能,这种写法并不是html的规范,因此并不是所有人都可以这么用的,只有支持这种写法的服务器,才可以这样写。
但是采用这种合并js、css的方式会有一些缺陷:
1、静态资源服务器需要动态合并静态资源到一个输出流中,也就是说,静态资源服务器要有一个网关应用程序去支持这种处理。当然这种处理是要消耗额外的硬件性能。
2、文件整合会使http缓存能力降低,一定程度上增加了服务器的压力。试想一下,如果我们有四个js文件。A.js,B.js,C.js,D.js。我们如果只改变了D.js。正常情况下。浏览器还是可以继续使用A、B、C的缓存,只更新D.js就可以了。但是由于我们采用了合并的方式。现在我们需要重新返回四个文件的合并结果。
一个link加载多个css文件的更多相关文章
- SpringMVC里静态网页不能加载到.js .css文件的问题
在写SpringMVC项目时候,写的js css文件打不开,网上查了一下,解决办法: 在web.xml里面: <servlet> <servlet-name>dispatche ...
- 样式的操作-不同浏览器加载不同的css文件
———————————————————— <script type="text/javascript"> //body加载事件监听函数 ...
- 判断客户端使用的是安卓还是苹果,然后加载对应的css文件
<script type="text/javascript" charset="utf-8"> var browser = { versions: ...
- Maven工程webinfo下面的JSP页面无法加载.js、.css文件的解决方案
--下面是我的工程路径 --我jsp的写法 -----启动工程,访问js文件的路径是这样的, href="http://localhost:8080/activiti/css/public. ...
- ios 加载本地html css文件 ps:css和html必须在同一文件夹下面
NSString *path = [[NSBundle mainBundle] bundlePath]; NSURL *baseURL = [NSURL fileURLWithPath:path]; ...
- 动态加载js、css 代码
一.原生js: /** * 加载js和css文件 * @param jsonData.path 前缀路径 * @param jsonData.url 需要加载的js路径或css路径 * @param ...
- PHP:如果正确加载js、css、images等静态文件
日常中,我们想要把一些静态页面放在框架上或者是进行转移时,那么静态页面上的原url加载js.css.images都会失效,那么我们应该怎么进行修改捏? 现在仓鼠做个笔记哈 这里有几个注意项: 1.路径 ...
- js插件动态加载js、css解决方案
最近因为工作需要做了一个js自动导入的插件,一开始很天真的以为动态创建个script添加到head中就ok了,试了之后才发现了问题,就是如果同时引入了多个js文件,而且后一个文件中用到了前一个文件中的 ...
- 用javascript预加载图片、css、js的方法研究
预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...
随机推荐
- Goodbye Microservices: From 100s of problem children to 1 superstar
https://segment.com/blog/goodbye-microservices/ Unless you’ve been living under a rock, you probably ...
- python easygui用法
一个简单的例子 在 EasyGui 中,所有的 GUI 互动均是通过简单的函数调用,下边一个简单的例子告诉你 EasyGui 确实很 Easy! import easygui as g import ...
- DEVC++如何调试代码
DEVC++小技巧 学习C语言的同学大多都会使用DEVC++这个软件,但是在使用的时候会发现是不可以调试的,因为我们的软件默认是将调试关闭了的.下面是调试的具体方法. 点击窗口的工具按钮 点击编辑按钮 ...
- web-----chrome DevTools工具的常用使用记录
注:1.Chrome浏览器,2.在浏览器页面 右键--->检查,即可看到此页面 跟开发沟通过.他们查看一个页面的性能一般都会使用”检查“来观测.查找对应的数据记录. 设置网络的网速和通过设置某 ...
- eslint 对下一行不要校验报错
eslint 对下一行不要校验报错: <--eslint-disable-next-line--> <div>todo</div> 扩展知识: stylelint ...
- sql server in和exists 的区别
如图,现在有两个数据集,左边表示#tempTable1,右边表示#tempTable2.现在有以下问题: 1.求两个集的交集? 2.求tempTable1中不属于集#tempTable2的集? 先 ...
- PowerDesigner创建表 拷贝创建表语句 SQLSERVER创建数据库 使用查询 创建表 并且添加数据
PowerDesigner创建表 : 1.双击打开PowerDesigner 2.双击打开Create model 3左键点击Model types,再点击Physical Data m ...
- Greenplum 执行计划之广播与重分布
关联数据在不同节点上,对于普通关系型数据库来说,是无法进行连接的.关联的数据需要通过网络流入到一个节点中进行计算,这样就需要发生数据迁移.数据迁移有广播和重分布两种.在GP中,每一个广播或重分布会产生 ...
- am335x system upgrade kernel emmc(十八)
1 Scope of Document This document describes EMMC hardware design 2 Requiremen 2.1 Func ...
- BP神经网络原理及在Matlab中的应用
一.人工神经网络 关于对神经网络的介绍和应用,请看如下文章 神经网络潜讲 如何简单形象又有趣地讲解神经网络是什么 二.人工神经网络分类 按照连接方式--前向神经网络.反馈(递归)神经网络 按照 ...