Firefox 5 —— 开发者的那些事

30顶
1踩

2011-06-24 10:12 by 见习编辑 hotwind 评论(4) 有7236人浏览

Firefox 前端开发

Firefox 5已经发布了，这里来跟大家分享一下从Firefox 5中开发者能获得的新武器。

CSS3 动画

CSS动画（参阅文档）提供了使用CSS来制作动画效果的能力。跟CSS移位效果一样，使用CSS动画可以非常高效平滑的展现效果（看大牛David Baron的文章），开发者拥有对keyframes有更好的控制力，从而制作出更加复杂的动画效果。

需要注意的变化

开发者可以把Image作为参数传递给 createImageData 来获取图片的大小数据；
在后台标签中，setTimeout 和 setInterval 每秒钟只能执行一次回调函数，这符合 requestAnimationFrame 要求的描述，用来减少CPU和电源的消耗。
其他的Bug Fix和性能提升

HTML

所有的HTML元素现在都拥有 accessKey 属性，同时还有 blur() 、 click() 和 focus() 方法。这些属性和方法都在 HTMLElement 接口中定义；
为了更好的支持 HTML5 规范，对 UTF-7 和 UTF-32 字符集的支持已经被移除；
在quirk模式下，匹配的空 <map> 元素不再被跳过，详情可以查看 Gecko 笔记中的 <map> 元素；
Android上的Firefox移动版现在支持 @font-face 描述的WOFF字体；
作为安全措施，WebGL 不会从非来源域名之外的地方读取纹理信息。

Canvas改进

<canvas> 2D绘图上下文现在支持定义 ImageData 为 createImageData() 方法的输入；生成新的 ImageData 对象会初始化为跟指定对象具有相同的大小，不过所有画布上所有像素都预设为透明黑色；
调用 CanvasGradient 的 addColorStop() 方法时，如果指定非规定值作为停止颜色的参数时会抛出 INDEX_SIZE_ERR 异常而不是 SYNTAX_ERR；
HTMLCanvasElement 的方法 toDataURL() 在匹配前会正确的将指定的MIME类型变为小写字母；
getImageData() 能够接受超过画布大小的矩形为参数，在画布之外区域的像素被预设为透明的黑色；
drawImage() 和 createImageData() 支持规范定义的，可以接受负数的参数，可以让指定的矩形区域围绕某个坐标轴进行旋转；
调用 createImageData() 时传递非规定参数时抛出 NOT_SUPPORTED_ERR 异常；
如果 createImageData() 和 getImageData() 参数描述的矩形小于一个像素的话，也会返回至少一个像素大小的数据；
调用 createRadialGradient() 时传递负数的半径会抛出 INDEX_SIZE_ERR 异常；
调用 createPattern() 或者 drawImage() 时参数如果为 null 或者 undefined image对象的话，会抛出 TYPE_MISMATCH_ERR 异常；
globalAlpha 如果指定为非法参数的话，不再抛出 SYNTAX_ERR 异常，现在都是悄悄的忽略掉；
Specifying invalid values when calling调用 translate(), transform(), rect(), clearRect(), fillRect(), strokeRect(), lineTo(), moveTo(), quadraticCurveTo() 和 arc() 如果传入非法参数的话，不再抛出异常，还是悄悄的忽略掉；
shadowOffsetX, shadowOffsetY 和 shadowBlur 的属性值设定不正确的话也是悄悄的忽略掉；
rotate 和 scale 的属性设定同上。

CSS

添加对 CSS 动画的支持，不过现在还需要使用 -moz-前缀。

DOM

修改了 selection 对象的 modify() 方法，这样“文字”选取对象不再包括结尾出多余的空格，从而各个平台上的操作保持一致，并且跟WebKit的实现也保持一致；
在后台标签页中，window.setTimeout() 每秒钟只会调用一次超时回调函数。另外，嵌套的超时会根据HTML5规范中定义的最小的数值：4ms（以前是10ms）。
window.setInterval() 方法同上；
XMLHttpRequest 现在支持 loadend 事件给进度监听器（Progress Listener）。任何传输在结束之后都会引起这个事件（也就是在 abort, error 和 load 事件之后）。可以监听这个时间来处理不管是错误还是失败之后都需要进行的操作。
Blob 和 File 对象的 slice() 方法被移除，并且替换为新的词法表述，从而跟JavaScript中 Array.slice() 和 String.slice() 方法保持一致的语义。现在，这个方法被命名为 mozSlice() ；
window.navigator.language 的值由 Accept-Language HTTP header 来决定。

JavaScript

正则表达式不再像函数一样可以被调用，这么做是为了同WebKit保持一致和兼容（参看 WebKit bug 28285 ）；
支持 Function.prototype.isGenerator() 方法，允许开发者查看函数是否为 generator。

SVG

class SVG 属性支持动画效果；
下述 SVG 相关的 DOM 接口（表现为对象列表的）支持数列话，可以直接像数组一样被访问，另外，也提供了 length 属性来表示列表中对象的数量： SVGLengthList , SVGNumberList , SVGPathSegList 和 SVGPointList 。

HTTP

Firefox 不再发送 “Keep-Alive” HTTP 头；我们对他格式化的不对，而且当我们同时发送 Connection: 和 Proxy-Connection: 头部信息时，Keep-Alive有点多余；
更新了 HTTP 的传输模型，更智能的重用连接池中的已有连接；不再把连接池当作 FIFO 队列，Necko 现在尝试按照最大的拥挤窗口 (CWND) 来排序连接。这可以在很多情况下降低 HTTP 传输的RTT时间；
如果 filename 和 filename* 参数提供了的话，Firefox 更高效的处理 Content-Disposition HTTP 回应头数据；在提供 filename* 参数的情况下，Firefox会查看所有提供的名字，即使同时也提供了 filename 参数。

MathML

支持修饰操作符

开发者工具

Web 控制台的 Console 对象支持 debug() 方法，他就是 log() 方法的别名，提供更好的兼容性。

via hacks.mozilla.org

来自: mijia.org

分享到：

30
顶

1
踩

评论共 4 条请登录后发表评论

4 楼 jxjnice 2011-07-31 18:21

[color=brown][/color][b][/b][i][/i][u][/u]

引用

[flash=200,200]
字体颜色: 标准深红红色橙色棕色黄色绿色橄榄青色蓝色深蓝靛蓝紫色灰色白色黑色字体大小: 标准1 (xx-small)2 (x-small)3 (small)4 (medium)5 (large)6 (x-large)7 (xx-large) 对齐: 标准居左居中居右[/flash]

[flash=200,200][/flash][/url][url][img][/img][size=xx-small][/size]

3 楼 zht110227 2011-07-28 09:16

现在都赶上myeclipse了，哎。我的内存

2 楼 ddkk 2011-07-14 16:26

等待包含了传说中修复内存占用过多鸡血补丁的版本

1 楼 308655406 2011-06-27 08:35

正在开发SVG
之前确实不支持SVG动画效果

发表评论

您还没有登录,请您登录后再发表评论

30顶1踩