简单谈下网站导致CPU飙升的相关原因

摘要： 前些天好多网友反馈，打开博客时候会导致电脑CPU狂飙，自己测试了一下，瞬间真的可以冲到90%甚至有时候更高，抛去我正在运行的其他程序，这个博客的确会导致CPU狂飙，既然有问题就开始...

前些天好多网友反馈，打开博客时候会导致电脑CPU狂飙，自己测试了一下，瞬间真的可以冲到90%甚至有时候更高，抛去我正在运行的其他程序，这个博客的确会导致CPU狂飙，既然有问题就开始折腾吧。

首先，我记得别人之前发布一篇“博客网页导致电脑CPU飙升的问题解决记录”所以首先找找那篇文章合起来就来看看是什么原因，原因有三，以此是：

造成 CPU 爆卡的原因之一是：网站的Logo 扫光特效！

拓展：这功能本来也没什么 L 用，华而不实，一直忙就忘记关掉了，现在发现居然会导致 CPU 爆卡，试了几个使用了这个特效的网站，也存在同样的问题，大家可以试下。

简单看了下扫光特效的 CSS 代码，主要使用 keyframes 来实现的动画，因此也看了些资料。验证这个特效是否会导致 CPU 上升，可以点击如下网址测试效果：

http://www.runoob.com/try/try.php?filename=trycss3_keyframes

反正我点击运行之后，CPU 至少升到 60%+，如果再加快速度，CPU 负载会更高，有兴趣的朋友可以自己测试玩玩。

造成 CPU 负载较高的原因之二是：底部滚动推荐条！

关掉扫光之后，顺便测试了下我博客底部的滚动条，发现也会带来较高的 CPU 负载，如果发现风扇依然呼呼的朋友，可以再关掉滚动条试下。。。但是，这个功能我就不去掉了，总要有所取舍。

造成 CPU 负载较高的原因之三是：防镜像代码中存在死循环。

三个问题全部规避试了下，使用 QQ 浏览器时，CPU 负载依然在 50%左右，使用谷歌基本只有 20%以下，估计和浏览器内核版本也有所关系，暂时找不出问题了，以后再看看吧！

当然，以上问题并未解决我博客飙升的原因，有些童鞋会问，既然没有解决为什么还要贴出来呢？因为我要留着记录啊，以后要是在遇到类似问题可以先排查啊，废话不多说了，emmm。陷入僵局，真的不知道在怎么入手，索性把js单独分离出来，一步步验证，结果还真的找到了“元凶”

罪魁祸首就是“输入特效”我也不知道这是为什么？可能是特效本身的问题，在别人博客也测试了，他的博客一直开启特效，但是只在文章页面有，其他页面没有，看了一下CPU占用一半左右，还能接受，所以我就把这个js完全分离出来，后台重新优化了开关，这个问题就解决了，现在依然是全页面的输入特效，但是已经降到50%左右，接受不了的话就关闭后台的“输入特效”就行了。

至于别人提到的图片扫光特效我这个博客是没有问题的，因为采用的代码不一致，所以网友们可以放心的使用。