以前也做过不少项目,但从来就没有把关注的目光投向过js文件缓存。最近终于在毫无意识的情况下跳进了这个大坑。

近几个月来的工作是一个交易系统持续改进项目,迭代发布周期大约为2~3周。最近一次迭代是V16版,在礼拜三完成发布。不幸的是,第二天上午就被老大逮过去。原来老大从生产中揪出了一个bug,大致的问题如下:

系统中有一个常用的自定义控件,目的是协助选择客户,而V16版的持续改进需求是给控件增加两个筛选选项,支持不同的默认值配置。很简单的一个需求,代码修改也简单,其中一个修改是给一个js文件里边的一个函数增加了一个传入参数,用来传递配置值。经过RC、RTW测试,一切都显得很正常,不过上了生产才被发现bug了。加载出来的客户明显不正常、数目不对,也与预期的查询配置不相符。

检查控件内部跳转链接,发现问题,传递的参数明显与预期不符,而这个链接则是由上面修改过的JS函数生成。因此判定问题是由于客户端缓存了原版JS文件,新函数的调用由旧函数所替换引发的。经过清除缓存,重新加载页面后,这个自定义控件能够正常工作。很不幸的是,我们是不能通过打电话告诉每一位用户,你需要清除缓存,然后才能正常使用这个功能。

到此时,我才意识到需要一种方法来控件JS的缓存问题,否则,后续任何涉及JS文件内容的修改,都会因为缓存无法获取最新JS文件,而导致生产事故。

原则上,我们是需要在有JS更新的时候,才会去重新加载JS文件,而不是每次都重新加载,因此第一种做法给JS应用地址后添加随机参数是不可取的,因为它意味着,几乎每次加载页面都会是重新加载JS,而不会合理的利用缓存JS。但是,我们还有第二种更合理的做法,如果关注过一些国外网站代码,会发现,他们通常是在js链接后添加一个版本号参数,而不是随机数,当js代码发生修改时,只需要将版本号加1,就可以很巧妙的解决通知客户端更新js文件。不知道,谁是第一个想到这种方法的人,不过毫无疑问,他是值得我们钦佩的,真是一个不错的idea的!

附赠些许代码:
    <script src="../JavaScript/SelectOpenWindow.js?v=1" type="text/javascript"></script>

js文件缓存之版本管理的更多相关文章

  1. Chrome浏览器清除页面js文件缓存的方法

    Chrome浏览器清除页面js文件缓存 Chrome浏览器清除js缓存方法虽然简单,但有些人还是不太会,有些人会去设置里面清除有时候没有用,这里写一下简单步骤,使用一次以后就会了,而且速度更快 1.打 ...

  2. 关于css js文件缓存问题

    什么情况下,要禁止静态文件缓存:1.经常可能要改动的 js, css.比如一个js文件引用如下<script src="test.js"></script> ...

  3. jsp中引入js文件缓存问题解决

    加上版本UUID <script charset="utf-8" src="${basePath}js/souke/soukegalist.js?v=<%=U ...

  4. js和HTML结合(补充知识:如何防止文件缓存的js代码)

    来自<javascript高级程序设计 第三版:作者Nicholas C. Zakas>的学习笔记(二) 使用html标签<script>可以把js嵌入到html页面中,让脚本 ...

  5. 关于更新发布CSS和JS文件的缓存问题

    现如今,浏览器大战下,各个浏览器也是拼了命的提高性能,升级JS解析引擎,更好的处理浏览器的页面缓存,让用户的浏览体验更快,占用更小的PC资源.那么,问题就出现在JS和CSS缓存,甚至页面缓存上.至于浏 ...

  6. js文件合并,压缩,缓存,延迟加载

    做web前段也有一段时间了,对于web中js文件的加载有些体会想跟大家一起分享一下. 1.首先说说js文件的合并和压缩吧 为了便于集中式管理js的合并和压缩我们创建一个Js.ashx文件来专门处理合并 ...

  7. js文件被浏览器缓存的思考

        我们的用户量大,修改js文件后,用户反馈登录出现问题.实际上刷新一下就没事了.就是因为用户的浏览器使用的还是本地缓存的js代码.   强制刷新一般就会重新去服务器获取新的js代码.但不能让用户 ...

  8. 静态HTML页面不缓存js文件的方法

    今天做项目时候遇到一个问题,由于采用了生成静态的CMS系统,但是页面头部需要显示用户登录的信息,也就是,没有登录时,显示登录框,用户登录后,则显 示登录信息.于是用到了js调用php文件的方法.但是由 ...

  9. 解决修改css或js文件后,浏览器缓存未更新问题

    问题描述:最近在上线新版本项目的时候,发现有的用户的操作还是调用的老版本JS里面的内容,这样就造成原来新的JS里面加上的限制不能限制用户的操作,从而导致用户可以重复操作. 问题产生原因: 如果在用户之 ...

随机推荐

  1. HDU-2561 第二小整数

    http://acm.hdu.edu.cn/showproblem.php?pid=2561 第二小整数 Time Limit: 3000/1000 MS (Java/Others)    Memor ...

  2. 在Apache上部署Django

    跟php类似,要想使Apache能够处理python脚本(实际上Apache是不能处理脚本的,只是利用别的扩展模块处理相应脚本),就要给Apache安装相应的扩展模块. Apache起初的python ...

  3. 怎样安装Joomla 1.7网站系统

    http://jingyan.baidu.com/article/8065f87fc3de112331249830.html   如果你想使用Joomla(地球上最好的内容管理系统之一)搭建一个网站, ...

  4. Java 性能优化技巧及实战

    关于Java代码的性能优化,是每个javaer都渴望掌握的本领,进而晋升为大牛的必经之路,但是对java的调优需要了解整个java的运行 机制及底层调用细节,需要多看多读多写多试,并非一朝一夕之功.本 ...

  5. 借助 AOP 为 Java Web 应用记录性能数据

    作为开发者,应用的性能始终是我们最感兴趣的话题之一.然而,不是所有的开发者都对自己维护的应用的性能有所了解,更别说快速定位性能瓶颈并实施解决方案了. 今年北京 Velocity 的赞助商大多从事 AP ...

  6. iOS实用技能扩展-集成支付宝

    前奏 现在随着移动开发的快速发展,移动支付变得越来越流行与必不可少.最近做了一个关于支付宝支付功能的应用,在使用支付宝的过程中,遇到一些不必要的弯路,因此,写了这篇文章总结一下关于iOS中如何开发使用 ...

  7. web配置nagios工具

    Nagios是一款开源的免费网络监视工具,能有效监控Windows.Linux和Unix的主机状态,交换机路由器等网络设置,打印机等.在系统或服务状态异常时发出邮件或短信报警第一时间通知网站运维人员, ...

  8. [rxjs] Throttled Buffering in RxJS (debounce)

    Capturing every event can get chatty. Batching events with a throttled buffer in RxJS lets you captu ...

  9. linux内核分析系列--百度

    http://www.baidu.com/p/frsllzh http://www.baidu.com/p/%E9%98%BF%E4%BF%A1sxq

  10. LabVIEW设计模式系列——case结构模拟事件结构

    标准:1.所有按钮的机械动作必须都用释放时触发或者单击时触发,这是为了保证仅仅触发一次动作. 标准:1.使用简单的case结构模拟事件结构.