Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

CSS3事件的消息回调BUG

  JavaScript自己对线程的处理当然没问题,但是引入了CSS3事件这样异类的东西后事情就变得复杂起来。前面的文章提到了Worker这样的异线程消息在火狐中造成的BUG,而CSS3事件的影响不仅是火狐,连IE10也无法幸免,只有Chrome保住了自己的节操。
  在CSS3的animation相关事件中,迭代器事件是会因为动画不断重复执行而一直触发的。并且CSS3的动画渲染是不受JavaScript消息限制的,或者说CSS3的消息对浏览器来说是系统消息,这意味着它会在JavaScript处于alert的状态时触发并执行JavaScript的事件回调,和Worker带来一样的问题。
  我不知IE内部是如何实现的,唯一能确定的是IE的节操也在此刻沦陷,只有Chrome顽强的活了下来。
<style>
html {
  -webkit-animation:test 1s linear infinite;
  animation:test 1s linear infinite;
}
@-webkit-keyframes test {
  0% {background:red;}
  25% {background:green;}
  50% {background:blue;}
  100% {background:red;}
}
@keyframes test {
  0% {background:red;}
  25% {background:green;}
  50% {background:blue;}
  100% {background:red;}
}
</style>
<script>
onload=function(){
  var html=document.documentElement;
  //定义事件回调函数
  var iteration=function(e){
    alert(e.elapsedTime);
  };
  //绑定事件
  html.addEventListener("webkitAnimationIteration",iteration);
  html.addEventListener("animationiteration",iteration);
};
</script>


  我的测试代码中是每秒弹出一个,要是把这数值设置成毫秒级的完全可以成为一次小小的页面攻击,直接把浏览器进程卡死掉。所以,请有关部门注意了!@Mozilla @Microsoft

  最后是本次测试的浏览器版本号
    IE:10.0.9200.16660
    Chrome:29.0.1547.62 m
    Firefox:23.0.1
网名:
54.144.24.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^