细看正则时匹配慕课网链接时发现的,一个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文件的更多相关文章

  1. SpringMVC里静态网页不能加载到.js .css文件的问题

    在写SpringMVC项目时候,写的js css文件打不开,网上查了一下,解决办法: 在web.xml里面: <servlet> <servlet-name>dispatche ...

  2. 样式的操作-不同浏览器加载不同的css文件

    ———————————————————— <script type="text/javascript">            //body加载事件监听函数       ...

  3. 判断客户端使用的是安卓还是苹果,然后加载对应的css文件

    <script type="text/javascript" charset="utf-8"> var browser = { versions: ...

  4. Maven工程webinfo下面的JSP页面无法加载.js、.css文件的解决方案

    --下面是我的工程路径 --我jsp的写法 -----启动工程,访问js文件的路径是这样的, href="http://localhost:8080/activiti/css/public. ...

  5. ios 加载本地html css文件 ps:css和html必须在同一文件夹下面

    NSString *path = [[NSBundle mainBundle] bundlePath]; NSURL *baseURL = [NSURL fileURLWithPath:path]; ...

  6. 动态加载js、css 代码

    一.原生js: /** * 加载js和css文件 * @param jsonData.path 前缀路径 * @param jsonData.url 需要加载的js路径或css路径 * @param ...

  7. PHP:如果正确加载js、css、images等静态文件

    日常中,我们想要把一些静态页面放在框架上或者是进行转移时,那么静态页面上的原url加载js.css.images都会失效,那么我们应该怎么进行修改捏? 现在仓鼠做个笔记哈 这里有几个注意项: 1.路径 ...

  8. js插件动态加载js、css解决方案

    最近因为工作需要做了一个js自动导入的插件,一开始很天真的以为动态创建个script添加到head中就ok了,试了之后才发现了问题,就是如果同时引入了多个js文件,而且后一个文件中用到了前一个文件中的 ...

  9. 用javascript预加载图片、css、js的方法研究

    预加载的好处可以让网页更快的呈现给用户,缺点就是可能会增加无用的请求(但图片.css.js这些静态文件可以被缓存),如果用户访问的页面里面的css.js.图片被预加载了,用户打开页面的速度会快很多,提 ...

随机推荐

  1. Mybatis3.0_动态SQL元素:foreach-遍历集合_

    foreach-遍历集合 -笔记要点 <!--foreach 遍历标签 collection : 指定要遍历的集合; list类型的参数会特殊处理封装在Map中,map的key就叫做list; ...

  2. MyBatis3_[tp-26-27]_映射文件_select_返回List_记录封装Map:返回单个元素的Map或者整体Map集合

    笔记要点出错分析与总结工程组织 1.定义接口 public interface EmployeeMapper { //多条记录封装到一个map中: Map<Integer,Employee> ...

  3. centos7安装docker-compose

    安装docker # 安装依赖 sudo yum install -y yum-utils device-mapper-persistent-data lvm2 # 添加docker下载仓库 sudo ...

  4. 安装部署mongodb

    准备 groupadd mongodb useradd -g mongodb mongodb echo password |passwd --stdin mongodb mkdir -pv /data ...

  5. PHP基础语法之 位运算

    写了几年PHP的人都好奇说,没有用过位运算符.所以,此处你看二进制看的头晕,就去T¥M¥D吧. 位运算符基本不用,我们也将这个知识设置为了解级别.位运算符的知识点,你不想学习也可以.等以后用到位运算的 ...

  6. SQL动态标签

    MyBatis的动态SQL详解MyBatis 的强大特性之一便是它的动态 SQL.如果你有使用 JDBC 或其他类似框架的经验,你就能体会到根据不同条件拼接 SQL 语句有多么痛苦.拼接的时候要确保不 ...

  7. Mxnet框架搭建

    Mxnet框架搭建 小书匠 kindle  Mxnet是亚马逊开发的深度学习框架,和谷歌Tensorflow是同类型的框架. 1.安装Mxnet 这里只展示在线安装,源码编译安装等不演示:GPU安装与 ...

  8. 【LGR-059】洛谷7月月赛题解

    传送门 比赛的时候正在大巴上,笔记本没网又没电(不过就算有我估计也不会打就是了) \(A\) 咕咕 const int N=(1<<10)+5; int a[N][N],n; void s ...

  9. Tree-shaking

    Tree-shaking 字面意思就是 摇晃树, 其实就是去除那些引用的但却没有使用的代码. Tree-shaking 概念最早由 Rollup.js 提出,后来在 webpack2 中被引入进来,但 ...

  10. luogu_P3674 小清新人渣的本愿

    传送门 Solution 莫队,用bitset来存储出现的数 如果是和或者差,直接通过左移右移就可以实现判断 对于积的询问,暴力判就行了,因数只要枚举\(\sqrt n\)个 总复杂度是\(O(n^2 ...