QZFL Core Cheat sheet

QZFL 是团队共同努力开发的一套JS框架。也准备结束开源框架在公司内部无法维护的问题。不过同学们还是反映希望能得到一份接口文档的小抄版。 晚上花了一点时间输出了一份QZFL  2.0 Core 的Cheat Sheet。

Tags: frameworks core qzfl

分类:Javascript | 固定链接 | 评论: 11 | 引用: 0 | 查看次数: 4163

判断Javascript变量类型的函数

toString 本来是用来做字符串转换的,不过现在流行用来做变量类型的检查了。舜子这里也写了一个函数,方便检查变量的类型,可以用来代替 typeof

function getType(o) {
  var _t; return ((_t = typeof(o)) == "object" ?
o==null && "null" || Object.prototype.toString.call(o).slice(8,-1):_t).toLowerCase();
}

 

执行结果:

getType("abc"); //string
getType(true); //boolean
getType(123); //number
getType([]); //array
getType({}); //object
getType(function(){}); //function
getType(new Date); //date
getType(new RegExp); //regexp
getType(Math); //math

getType(null); //null

Tags: typeof

分类:Javascript | 固定链接 | 评论: 8 | 引用: 0 | 查看次数: 2860

Gecko 提供 HTML5 parser 支持了

Html 5的风越挂越猛了。在firefox 3.6a1pre版本中,加入了新的 HTML5 Parser 的支持。可以预见到这将会正式出现在下一个版本的Firefox中。
 

不过HTML 5 Parser能够做什么? 简单描述一下,这可是一个大胃口的Parser. 它将有很好的向后兼容性。 能够在text/html页面上使用xml parser,而不需要使用xhtml(xhtml页面是否会从此消失呢?)。
 

有什么好处?大家都知道SVG是一个xml的数据。使用Html5 Parser我们可以不需要更改html页面的任何内容。和申请命名空间就可以在html页面上直接表现svg图像。
 

感兴趣的朋友,可以到这里找到一些范例,不过在此之前需要下载最新的午夜版firefox.并且在 about:config 中打开 html5.enable HTML5 parser的支持。

Tags: Firefox html5 Gecko

分类:Javascript | 固定链接 | 评论: 8 | 引用: 0 | 查看次数: 2028

firefox 滚动残影的bug

不知道大家有没有遇到过,当我们设置了一个固定的浮动层后。在firefox下滚动会出现一些残影的情况? 总觉得页面的表现很不流畅。而且这个情况,只出现在 firefox for win的版本(mac版的firefox不会出现)

 

先看一下下面的视频(由于截屏软件录不了这个效果,只好拿手机录了)。

查看更多...

Tags: Firefox

分类:Javascript | 固定链接 | 评论: 38 | 引用: 0 | 查看次数: 2886

Google Chrome 支持脚本调试了

Google Chrome 3.0.190.4 版本中,终于把webkit的脚本调试器移植到开发者版本了。

Dev channel: http://www.google.com/chrome/eula.html?extra=devchannel

查看更多...

Tags: Google chrome webkit debug

分类:Javascript | 固定链接 | 评论: 5 | 引用: 0 | 查看次数: 3950

看IE8是如何自我感觉良好的?

200906191402.jpg微软发布了IE8和其他浏览器的功能对比图。当然微软不敢放出性能对比的。

不过这个功能对比图也实在够YY的。

http://www.microsoft.com/windows/internet-explorer/get-the-facts/browser-comparison.aspx

我们简单来分析看看。

查看更多...

Tags: IE8 Compatibility

分类:Javascript | 固定链接 | 评论: 19 | 引用: 0 | 查看次数: 3747

IE8下暂时成为鸡肋的好方法

IE.png       IE8虽然在很多方面还比不上其他浏览器,但是其实也是有进步的。只是由于用户的庞大和兼容性的问题,导致IE的发展非常缓慢。IE8做了很大改动但是这些改动对用户来说可有可无。技术上有价值,但是用户往往不会关注技术价值。下面提到的一些接口也因为渲染的设计上暂时会给开发带来额外的兼容逻辑。

 

JSON

JSON 是一个很好的native json parse接口,但是在IE8下,我们到页面如果是IE7模式,或则兼容模式,将无法使用JSON.parse接口来parse json 字符串。

查看更多...

Tags: IE8 json native

分类:Javascript | 固定链接 | 评论: 3 | 引用: 0 | 查看次数: 1521

跟踪浏览器重绘结果的脚本

之前在firefox 3.5上做了一个监控浏览器repaint跟踪的尝试。现在把之前的实验做成一个工具(GreaseMonkey 脚本),可以让大家跟踪页面的重绘情况。同时也能找到reflow的存在可能。

(监控 Google 搜索框的repaint情况)

 

查看更多...

Tags: Firefox GreaseMonkey repaint

分类:Javascript | 固定链接 | 评论: 4 | 引用: 0 | 查看次数: 1698

Repaint 跟踪浏览器的渲染

 

前端优化,从很久就开始了。随着研究的深入,关注的点就越来越多。最近也有不少的前端开发同学在研究浏览器的Reflow和Repaint . 引用以为Yahoo前端开发工程师的分析

 

repaint(重绘)是在一个元素的外观被改变,但没有改变布局的情况下发生,如改变visibility、outline、前景色。
"According to Opera , repaint is expensive because the browser must verify the visibility of all other nodes in the DOM tree."
当repaint发生时,浏览器会验证DOM树上的所有其它结点的visibility属性。
 
reflow(回流)是导致DOM脚本执行低效的关键因素之一。页面上任何一个结点触发reflow,都会导致它的子结点及祖先结点重新渲染。
 

查看更多...

Tags: Firefox repaint reflow

分类:Javascript | 固定链接 | 评论: 2 | 引用: 0 | 查看次数: 2311

作为未来的前端高手的你不能不知的 Web Workers

Firefox 3.5 其中一个最大的特性就是对 worker 的支持(当然safari也支持)。workers不仅仅能够让我们未来的web APP更加MVC。同时,他的异步后端运算给web程序带来更多可能性。

到底有什么好处?来看实例更加直接一些. mozbox的Paul Rouget用模拟退火算法(Simulated annealing)给我们演示了workers的优越性。

 

1. 不了解 Simulated annealing 的可以先看看这个图形化的演示过程,了解的同学直接看第二步

查看更多...

Tags: Firefox workers

分类:Javascript | 固定链接 | 评论: 13 | 引用: 0 | 查看次数: 4327