网站JS和CSS的版本管理,原理是什么,咋实现的?

就是我啊 发布于 2012/12/17 12:43
阅读 3K+
收藏 5

    嗯,主要就是想了解一下,大部分网站的JS和CSS是怎么来控制已经上线的版本的。怎么说呢,我发现大部分网站的js和css文件都是以这种形式存在的。 “ http://www.xxx.com/css/index.css?v1.2 ”,链接中带有版本信息。


    OSC的JS和CSS

<link rel="stylesheet" href="/css/oschina2012.css?date=20121205" type="text/css" media="screen" />
<script type="text/javascript" src="/js/2011/oschina.js?version=20110613"></script>


    还有更复杂的会以这种形式存在, 猪八戒JS和CSS。这里的连接里面包含了很多个JS和CSS文件的参数,打开文件一看都是上千行的,应该不会存在以这种形式来管理JS或者CSS文件的,所有的内容都放在同一个里面,那下面这种形式是怎么实现的呢?

<link rel="stylesheet" type="text/css" href="http://t4.zbjimg.com/min/?b=v&f=g.css,base.css,head.css,nav.css,ui-form.css,zbj-index.css,footer.css&v=1.13" />
<script type="text/javascript" src="http://t4.zbjimg.com/min/?b=c&f=frame.js,g.js,base/util.js,product/union.js&v=1.11"></script>

 

   这还有另外一种形式的,百度首页的JS和CSS(这是在登录百度账号之后)。刷新了一下,并没有每次的链接都不同,那这应该是和用户绑定再一起的。那么,百度那么多的用户,难道每一个用户都有对于的JS和CSS文件?怎么管理呀?

<script src="http://su.bdimg.com/static/superpage/js/sbase_f5677951.js"></script>
<script src="http://su.bdimg.com/static/superpage/js/min_index_64a3638a.js"></script>

 

  还有就是,我看了一下很多大一点的门户网站,他们更习惯于把CSS或者JS直接放在了页面里面,而没有使用外部链接的方式,这种有什么好处吗,不会首页加载起来更慢?


    不是很了解这些东西,所以想请教一下大家,大虾勿喷。

加载中
1
子木007
子木007

别人项目中到底是怎么管理的我不知道, 就你举例的那几个问题可以瞎扯一下。

1. osc 的 js, css 加了版本参数是因为这些文件都被缓存在了客户端,当服务器有修改的时候把参数改一下,客户端会取最新的

2. 猪八戒JS和CSS, http://t4.zbjimg.com/min/ 是个后台服务,把参数传递给他的所有js 或者css 合并压缩成一个文件,为的是减少客户端的请求数(我想后台也应该有个合并后的缓存文件,最后的参数 v 和上面说的作用一样)

3. 百度的我没有帐号,也就没有去看, 如果真如你所说的那样js/css和每个用户相关,那可能是模版生成的吧。 

4. css / js 放到单独的文件还是直接写在页面这是需要自己权衡。 共用的代码建议放到单独的文件,方便管理。 如果是某个页面才会用到那放到页面更合适。 

就是我啊
就是我啊
哦哦,了解,3ks~~
子木007
子木007
回复 @就是我啊 : 一切皆有可能。请求静态资源的时候加参数通常是为了处理缓存的问题。 当然也可以是访问后台服务做其他处理,最后再输出流(content-type设置正确)
就是我啊
就是我啊
哈哈,很详细的解答~~ 还想了解一下,就是像http://www.xxx.com/css.css?v=20121221这种形式的,主要目的是为了更新客户端的缓存吗?会不会有其他的功能,比如服务器上有很多的css文件然后通过这一个参数来请求不版本的样式表呢?这样做是不是没啥意义-.-
0
大喵哥
大喵哥
楼上说的很有道理~!学习
返回顶部
顶部