网页前端设计

http://www.86y.org

搜索文章

(Firefox 5 )开发者的那些事

用声音读出全文关注我吧
 2012/1/1 12:40:41 阅读次数:7349

Firefox 5已经发布了,这里翻译一篇来自Mozilla Hacks上的一篇文章来跟大家分享一下Firefox 5中开发者获得的新武器,:)

======

CSS3 动画

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

需要注意的变化

其他的Bug Fix和性能提升

HTML

Canvas改进

  • <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 事件之后)。可以监听这个时间来处理不管是错误还是失败之后都需要进行的操作。
  • BlobFile 对象的 slice() 方法被移除,并且替换为新的词法表述,从而跟JavaScript中 Array.slice()String.slice() 方法保持一致的语义。现在,这个方法被命名为  mozSlice()
  • window.navigator.language 的值由 Accept-Language HTTP header 来决定。

JavaScript

SVG

  • class SVG 属性支持动画效果;
  • 下述 SVG 相关的 DOM 接口(表现为对象列表的)支持数列话,可以直接像数组一样被访问,另外,也提供了 length 属性来表示列表中对象的数量: SVGLengthList , SVGNumberList , SVGPathSegListSVGPointList

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

开发者工具


大家有什么问题或技术上的想法可以在此与大家分享,也可以加入前端爱好者QQ群(141999928)一起学习进步:【幸凡前端技术交流群】
0

如果您觉得本文的内容对您的学习有所帮助,捐赠与共勉,支付宝(左)或微信(右)

阅读全文内容关闭