网站导致浏览器崩溃的原因总结(多款浏览器)

面试某公司的时候,面试官问到,导致浏览器崩溃的原因有哪些?愚辈不才,仅回答出了内存泄漏。其实在网页在装载的过程中,常常由于种种原因使浏览器的反映变的很慢,或造成浏览器失去响应,甚至会导致机器无法进行其他的操作。

  对于访客,如果登录您网站,浏览器就立刻崩溃,我想这对谁都是无法容忍的,对此总结了网站导致浏览器崩溃的原因:

1. 内存泄漏

  还是先谈下内存泄漏,网站由于内存泄漏的而照成崩溃有两种情况,服务器的崩溃和浏览器的崩溃。内存泄漏所造成的问题是显而易见的,它使得已分配的内存的引用就会丢失,只要系统还在运行中,则进程就会一直使用该内存。这样的结果是,曾占用更多的内存的程序会降低系统性能,直到机器完全停止工作,才会完全清空内存。

  Apache的Web服务器是用C/C++编写的,C/C++的内存泄漏问题不必多说,系统中存在无法回收的内存,有时候会造成内存不足或系统崩溃。在Java中,内存泄漏就是存在一些被分配的可达而无用的对象,这些对象不会被GC所回收,然而它却占用内存。

  而在客户端,JavaScript所造成的内存泄漏,也将可能使得浏览器崩溃。关于JavaScript的内存泄漏的文章,较权威的有《Memory leak patterns in JavaScript》和《Understanding and Solving Internet Explorer Leak Patterns》。

  JavaScript 是一种垃圾收集式(garbage collector,GC)语言,这就是说,内存是根据对象的创建分配给该对象的,并会在没有对该对象的引用时由浏览器收回。再根据《Fabulous Adventures In Coding》一文的说法:“JScript uses a nongenerational mark-and-sweep garbage collector.”,对” nongenerational mark-and-sweep”的可以这样理解,浏览器处理JavaScript并非采用纯粹的垃圾收集,还使用引用计数来为Native对象(例如Dom、ActiveX Object)处理内存。

  在引用计数系统,每个所引用的对象都会保留一个计数,以获悉有多少对象正在引用它。如果计数为零,该对象就会被销毁,其占用的内存也会返回给堆。 当对象相互引用时,就构成循环引用,浏览器(IE6,Firefox2.0)对于纯粹的JavaScript对象间的循环引用是可以正确处理的,但由于在引用计数系统,相互引用的对象都不能被销毁,因为是引用计数永远不能为零,因此浏览器无法处理JavaScript与Native对象(例如Dom、ActiveX Object)之间循环引用。所以,当我们出现Native对象与JavaScript对象间的循环引用时,就会出现内存泄漏的问题。

  简单来说就是,浏览器使用引用计数来为Native对象处理内存,而引用计数的对象无法被销毁,涉及Native对象的循环引用将会出现内存泄漏。配合下面的例子,理解这句话,基本上就可以理解JavaScript造成的内存泄漏了。

代码如下:

var obj;
window.onload = function(){
// JavaScript对象obj到DOM对象的引用,根据id获得
obj=document.getElementById("DivElement");
  // DOM 对象则有到此 JavaScript 对象的引用,由expandoProperty实现
  document.getElementById("DivElement").expandoProperty=obj;
}; 

可见,JavaScript 对象和 DOM 对象间就产生了一个循环引用。由于 DOM 对象是通过引用计数管理的,所以两个对象将都不能销毁。

  另一种情况是闭包中,当碰到闭包,我们在Native对象上绑定事件响应代码时,很容易制造出Closure Memory Leak。其关键原因和前者是一样的,也是一个跨JavaScript对象和Native对象的循环引用。只是代码更为隐蔽。

代码如下:

window.onload = function AttachEvents(element){
  //element有个引用指向函数ClickEventHandler()
  element.attachEvent( " onclick " , ClickEventHandler);
function ClickEventHandler(){
//该函数有个引用指向AttachEvents(element)调用Scope,
   //也就是执行了参数element。
  }
} 

这里简单理解了JavaScript造成内存泄漏的原因,内存泄漏加大浏览器的负担,很有可能导致浏览器崩溃,我们要做的就是尽量去避免这种情况,做法可参考刚刚所说《Memory leak patterns in JavaScript》和《Understanding and Solving Internet Explorer Leak Patterns》两篇文章加以理解。处理JavaScript内存泄漏最终目的还是要打破JavaScript对象和Native对象间的循环引用或者清零引用计数,释放对象。

  一些内存泄漏如闭包内存泄漏,我们可能比较难以发现,内存泄漏的检测我们可能参考《javascript 内存泄露工具使用》。

2. 网页代码复杂和浏览器bug

  大量个人网站和低质量网站代码的涌现造成对浏览标准的普遍不支持,如果正好碰上浏览器存在的一些bug,浏览器渲染引擎在处理这些网页代码的时候会出错,比如陷入死循环或直接崩溃等。

HTML代码导致网站崩溃

  这是HTML结构错误而导致IE6的崩溃,在<col width="100"/>前或后添加任何字符均会导致IE6 Crash。

代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head></head>
<body>
 <table>
<tr>
<td>
<table >
<colgroup><col width="100px"><col></colgroup>
</table>
</td>
</tr>
<table>
</body>
</html> 

该代码来个韩国的一个网站,无论是使用XHTML或者HTML的什么版本,只要带了DOCTYPE声明,IE6就会立即崩溃,当不带DOCTYPE声明的时候就没有错误,原因可能跟文档类型声明有关。

令IE6崩溃的CSS代码

  该代码参考自网站Cats who Code。该Bug发现与2007年,据说是一名日本人发现的:

代码如下:

<style>*{position:relative}</style>
<table><input></table>

原因在于table中直接放置内容,在IE6会引起mshtml.dll模块损坏而关闭浏览器,非IE6则安全无恙。

  除此之外,存在于IE6的Bug还有下面这种情况,当伪类为 a:active 时同样会遇到此问题:

代码如下:

<style type="text/css">
a{position:relative;}
a:hover{float:left;}
</style>
<a href="">崩溃IE6 ,crash ie6</a> 

  解决方案:为 <a> 添加 zoom:1; 令其触发haslayout。

代码如下:

<style type="text/css">
a{position:relative;zoom:1;}
a:hover{float:left;}
</style> 

令IE7崩溃的CSS代码

  此Bug来自偷米饭,它只存在IE7中据估计是处理省略字的时候导致IE7崩溃。

代码如下:

<style type="text/css">
div{float:left;width:175px;}
ul{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
li{position:relative;}
</style> 
<div>
<ul>
<li>崩溃崩溃崩溃崩溃崩溃crash ie7</li>
<li>崩溃崩溃崩溃崩溃崩溃crash ie7</li>
</ul>
</div> 

  解决方案:为 <li> 添加 zoom:1; 令其触发haslayout

令IE6崩溃的JavaScript代码

  来自Internet Explorer Sucks,这个网站就是使用了一下代码,当你使用IE6访问的时候,浏览器将立刻崩溃。代码如下:

代码如下:

<script>for (x in document.write) { document.write(x);}</script> 

具体引起的原因暂时无法解析,但在兼容性和执行效率来看一般不会采取这样的写法。

3. 网页数据过多

  网页含有大量需要处理的数据,造成系统繁忙,如多图页面,超长页面等,或者网页内嵌的各种控件会导致浏览器处理大量数据,造成系统繁忙。如Flash游戏,ActiveX控件等。当浏览器访问网站的时候,如果网站的数据量大,会使得浏览器一般在处理过程中会占用很大的CPU使用率和内存、造成浏览器失去响应,甚至会使电脑系统死机。在网站开发的时候,如果充分考虑Web性能,很大程度上能避免这个问题。

4. Ajax的Web服务漏洞

  Ajax的是基于XML的异步传输,文本格式的XML消息可能是二进制数据带宽量的两倍之多。传输XML消息所需的带宽越多,系统或应用程序用来执行其他任务的可用资源就越少。例如执行复杂算法来获取期望结果。

  过高的带宽可能导致由系统超载引起的性能减退。过高的带宽将导致Ajax应用程序输出破损的数据,因为没有足够的资源生成干净的数据。这意味着Web服务门户(Ajax应用程序属于其中的一部分)将把破损数据暴露给门户的其他部分,从而导致畸形消息和过度解析。如果威胁者利用了这个漏洞,则会引起浏览器崩溃。

  另外一方面,频繁的、较小的 HTTP 请求会加重后端服务器、负载均衡程序和防火墙的负担,结果是造成过高的带宽,最终导致性能降低。如果客户端长期停留在该页面或没有关闭浏览器,会使得浏览器的内存持续上涨,得不到释放,导致客户端浏览器崩溃。

  为此,在较多的时候Ajax的时候,我们要考虑通过专门的硬件加速器、优化软件、消除代码冗余、XML加速功能和解决互操作性问题等方式加速Ajax应用程序。另外,积极地监视通信流可以持续地度量Ajax应用程序的网络流量性能。通过将数据放入实时日志中,您可以查看在哪些位置何时出现大量的包丢失和抖动事件,响应变慢的原因以及如何通过修改应用程序的优先级来改善通信流性能。

5. 其他原因

  除以上提到的原因之外,还有其他许多原因,虽然有些不会导致浏览器直接崩溃,但也会造成网站无法访问,如日志文件导致磁盘已满、Web服务器C指针错误、进程缺乏文件描述符、线程死锁、数据库中的临时表不够用和服务器超载等,可参考《导致Web站点崩溃最常见的七大原因》。

总结

  对于访客,如果登录您网站,浏览器就立刻崩溃,我想这对谁都是无法容忍的,通过总结《网站令浏览器崩溃的原因》,在我们从事网站开发维护的时候,我们应该尽量去避免内存泄漏、代码错误和冗余及数据量过大等问题,构建更佳性能的站点。

PS:本文来自http://www.169it.com/blog_article/3682342070.html 由维奇总结,如有转载请注明出处

时间: 2024-10-11 16:19:52

网站导致浏览器崩溃的原因总结(多款浏览器)的相关文章

Qt学习之系列[9] – QCoreApplication:processEvents()可能会引起递归,导致栈溢出崩溃

api含义:QCoreApplication::processEvents() 将处理所有事件队列中的事件并返回给调用者. 问题描述: 当主线程在某个槽函数里正在执行processEvents时, 刚好有一个能响应此槽函数的信号发送过来了(肯定是其他线程发的信号),  这时就可能会发生可怕的递归, 导致栈溢出崩溃. 原因是processEvents,进入到无尽的递归中. 示例代码: bugThread.h #include <QThread> class BugThread : public

jquery uploadify上传文件插件导致浏览器崩溃问题解决方法

自谷歌浏览器更新到(版本39.0.2171.99 )后,访问上传文件界面浏览器就崩溃了,而其他的浏览器不会出现问题. 出现这种问题的原因就是谷歌浏览器缓存问题,但将访问该jsp页面路径添加上时间戳后无法解决问题,将界面引入uploadify.js中也添加了个随机变量还是不行.最后将引入js换成下面形式就解决了: 代码如下: [javascript] view plaincopyprint? document.write("<script type='text/javascript' &qu

这几行 javascript 代码能让你的浏览器崩溃?

先上Demo,有兴趣的可以先试一下: http://www.zeakhold.com/crash/ (温馨提示:访问前请保存好浏览器其他窗口的任务,整人被打概不负责嘿嘿~) 事情还是得从 IT Security Tweets ™   的一篇推文说起: 也就是说,这段 javascript 代码,能让浏览器崩溃并且能让iPhone重启?! 于是打开电脑跃跃欲试,当满怀好奇地在浏览器上执行了这段代码后发现: Chrome 立马陷入了卡死的状态,更要命的是点击关闭窗口没响应!! 打开任务管理器,发现C

在Ubuntu上,使用SWT嵌入AWT/SWING代码导致Eclipse崩溃问题

配置:Ubuntu 13.04 + Eclipse4.3 + JRE 7 现象:打开一个内嵌AWT/SWING代码的Eclipse 视图,Eclipse直接挂掉 原因:AWT/SWING和SWT都在访问GTK时都使用了锁去保护自己的线程.AWT使用的GTK的锁,但是SWT使用的自己的锁.在使用SWT访问AWT时,就会出错. 解决办法:在使用SWT访问AWT的代码中将以下代码:      UIManager.setLookAndFeel(UIManager.getSystemLookAndFeel

奇怪的iphone6 plus,H5调用拍照浏览器崩溃

自从开发H5,就不断被各种手机的怪现象打败. 一个非常简单的页面,需要上传照片,H5实现这个功能超easy,直接在页面写入 <input type='file'> 点击这个input,便可呼叫出拍照功能.拍照.压缩.显示.上传.... 狗血的事情发生在6plus上,使用拍照功能,时不时就会导致浏览器崩溃.测试了4台手机,出现的频率相当大.这就是高富帅的6p?

[CareerCup] 12.2 Find the Reason of Crash 找到程序崩溃的原因

12.2 You are given the source to an application which crashes when it is run. After running it ten times in a debugger, you find it never crashes in the same place. The application is single threaded, and uses only the C standard library. What progra

网站打开速度慢的原因,排查方法及优化方法

如果你的网站打开速度过慢,而你又不知道该如何解决,那么这篇文章是非看不可了.手把手的教你如何排查网站打开慢的原因,以及优化方法. 排查网站打开速度慢的原因: 1 网站服务器速度或租用空间所在服务器速度服务器空间速度是网站打开速度快的硬件基础,也是先决条件.否则即使你网站页面设计的非常"苗条",网站打开速度也会打折扣.解决办法:要找你的空间商解决或换空间商. 如何检测服务器速度快慢呢? 方法一: ping命令看连接到服务器的时间和丢包情况. 1>单击"开始"键并

Win7下使用PB9可能导致的崩溃问题解决方案

在Win7环境下使用PB9进行程序开发,在打开Window或者DataWindow的时候,包括运行程序之后的退出,有可能导致程序崩溃而且开发环境直接退出,出现这样情况的原因是因为PB9所自带的核心软件包尚不足以支持Win7下的开发,为了弥补这个问题,Sybase在后来推出了PB9针对Win7系统下的操作补丁,使用此补丁可以解决以上的问题. 补丁下载地址: http://pan.baidu.com/s/1mg0wwPy

JVM崩溃的原因及解决!

JVM崩溃的原因及解决! 前些天,搞JNI的时候,报了个JVM崩溃的错.错误信息如下: # # An unexpected error has been detected by HotSpot Virtual Machine: # #  EXCEPTION_ACCESS_VIOLATION (0xc0000005) at pc=0x009fcf52, pid=4752, tid=4440 # # Java VM: Java HotSpot(TM) Client VM (1.5.0_14-b03