2014年四月月 发布的文章

图片文件本地缓存

随着html5不断的被得到支持,从性能优化的角度讲,减少http请求是非常重要的优化手段。

html5的新的接口localstorage,提供了更大的存储空间,大部分浏览器支持5M的容量,足够存储JS等脚本文件。这样依赖就能减少一些HTTP请求,提升速度。

但也可以存储一些改动频率较低的静态图片,方案是将图标进行编码,存储该文件的编码。下面直接看代码:


var setImageSrc = function(img, src){
var local = localStorage.getItem("src"); //用src作key,也可以换其他标记
if(local){
img.src= local;
}else{
img.src = src;
img.onload = function(){
var canvas = document.createElement('canvas')
ctx = canvas.getContext('2d');
ctx.drawImage(img,0,0);
var data = canvas.toDataURL('jpg'); //注意,浏览器不一定支持jpg格式的转换,这时会自动降级到png格式
localStorage.setItem("src", data);
}
// 跨域
img.setAttribute("crossorigin","anonymous"); //关键属性
}
}
setImageSrc($('feedImg'),'http://test.com/img/header-logo.png');

这样就可以存储一些静态图片,但大小是图片本身的两倍,主要应用canvas的toDataURL函数

可以配合图片的懒加载使用

稍加改变,加上版本号,可以控制图片的改版发布了。

webview的CORS跨域

在项目中遇到个问题,页面嵌入在webview中。正常浏览器的如UC浏览器、QQ浏览器中使用CORS跨域请求是没问题,但在webview中却拉取失败,照理都是同样的请求,应该不是后台的问题。catch到的错误是

INVALID_STATE_ERR: DOM Exception 11
然后google之,发现是zepto的一个bug,git上已经说明,应该下个版本会合并上。

阅读剩余部分 ->

SVN hooks(钩子)- 简单入门

在做版本的时候,需要SVN做一些自动化的事情,比如提交前自动更新;提交一些文件后关联着提交另一些。所以需要写一点自动化脚本。

什么是SVN钩子

官方说法:

钩子是通过版本库事件触发,例如新版本的创建或一个未版本化属性的修改。一些钩子(叫做“pre hooks”)在事件发生前运行,可以用来报告发生了什么以及防止它发生。还有一些钩子(“post hooks”)在版本库事件之后发生,只是用来报告。每个钩子能够获得事件的足够信息,例如提出的(或完成的)版本库修改细节,还有触发事件的用户名。 阅读剩余部分 ->

怪诞的你

谈论怪诞之前,先抛出几个问题,供大家思考思考。

为什么同类电视机中,价格居中的卖的最好?

为什么人们不愿意点最贵的菜,而选择稍微低一点的?

如果希望在交友party上吸引跟多的约会对象,你该怎么办?

你对商品的估价会受到什么数字的影响?

为什么人们疯抢免费而实际不需要的东西?

迟到罚款有效吗?

平日理性的你在情绪激动时能自控吗?

你是否有过拖沓的行为,想过怎么解决吗?

怎么解决人们不愿意体检的问题?

阅读剩余部分 ->