Maison interface Web js tutoriel 网站导致浏览器崩溃的原因总结(多款浏览器) 推荐_javascript技巧

网站导致浏览器崩溃的原因总结(多款浏览器) 推荐_javascript技巧

May 16, 2016 pm 06:29 PM
网站

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

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

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的崩溃,在

前或后添加任何字符均会导致IE6 Crash。
复制代码 代码如下:

BR>"http://www.w3.org/TR/html4/loose.dtd">



 











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

令IE6崩溃的CSS代码

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

复制代码 代码如下:




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

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


崩溃IE6 ,crash ie6

  解决方案:为 添加 zoom:1; 令其触发haslayout。
复制代码 代码如下:



令IE7崩溃的CSS代码

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

复制代码 代码如下:




  • 崩溃崩溃崩溃崩溃崩溃crash ie7

  • 崩溃崩溃崩溃崩溃崩溃crash ie7




  解决方案:为
  • 添加 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:本文由维奇总结,如有转载请注明出处

  • Déclaration de ce site Web
    Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

    Outils d'IA chauds

    Undresser.AI Undress

    Undresser.AI Undress

    Application basée sur l'IA pour créer des photos de nu réalistes

    AI Clothes Remover

    AI Clothes Remover

    Outil d'IA en ligne pour supprimer les vêtements des photos.

    Undress AI Tool

    Undress AI Tool

    Images de déshabillage gratuites

    Clothoff.io

    Clothoff.io

    Dissolvant de vêtements AI

    AI Hentai Generator

    AI Hentai Generator

    Générez AI Hentai gratuitement.

    Article chaud

    R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
    1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O. Meilleurs paramètres graphiques
    1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
    Will R.E.P.O. Vous avez un jeu croisé?
    1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌

    Outils chauds

    Bloc-notes++7.3.1

    Bloc-notes++7.3.1

    Éditeur de code facile à utiliser et gratuit

    SublimeText3 version chinoise

    SublimeText3 version chinoise

    Version chinoise, très simple à utiliser

    Envoyer Studio 13.0.1

    Envoyer Studio 13.0.1

    Puissant environnement de développement intégré PHP

    Dreamweaver CS6

    Dreamweaver CS6

    Outils de développement Web visuel

    SublimeText3 version Mac

    SublimeText3 version Mac

    Logiciel d'édition de code au niveau de Dieu (SublimeText3)

    Existe-t-il un site Web pour apprendre le langage C ? Existe-t-il un site Web pour apprendre le langage C ? Jan 30, 2024 pm 02:38 PM

    Sites Web pour apprendre le langage C : 1. Site Web du langage C ; 2. Tutoriel pour les débutants ; 3. Forum du langage C ; 5. Script House 6. Tianji.com ; 51 Réseau d'auto-apprentissage ; 9. Likou ; 10. Programmation C. Introduction détaillée : 1. Site Web chinois en langue C, qui est un site Web dédié à la fourniture de matériel d'apprentissage du langage C pour les débutants. Il a un contenu riche, comprenant une grammaire de base, des pointeurs, des tableaux, des fonctions, des structures et d'autres modules. est un site Web complet d'apprentissage de la programmation et bien plus encore.

    Comment ouvrir un site Web à l'aide du Planificateur de tâches Comment ouvrir un site Web à l'aide du Planificateur de tâches Oct 02, 2023 pm 11:13 PM

    Visitez-vous fréquemment le même site Web à peu près à la même heure chaque jour ? Cela peut conduire à passer beaucoup de temps avec plusieurs onglets de navigateur ouverts et à encombrer le navigateur lors de l'exécution des tâches quotidiennes. Eh bien, que diriez-vous de l’ouvrir sans avoir à lancer le navigateur manuellement ? C'est très simple et ne nécessite pas de télécharger d'applications tierces, comme indiqué ci-dessous. Comment configurer le Planificateur de tâches pour ouvrir un site Web ? Appuyez sur la touche , tapez Planificateur de tâches dans la zone de recherche, puis cliquez sur Ouvrir. Windows Dans la barre latérale droite, cliquez sur l'option Créer une tâche de base. Dans le champ Nom, saisissez le nom du site Web que vous souhaitez ouvrir et cliquez sur Suivant. Ensuite, sous Déclencheurs, cliquez sur Fréquence temporelle, puis sur Suivant. Sélectionnez la durée pendant laquelle vous souhaitez que l'événement se répète et cliquez sur Suivant. Sélectionnez activer

    Comment convertir votre site Web en une application Mac autonome Comment convertir votre site Web en une application Mac autonome Oct 12, 2023 pm 11:17 PM

    Dans macOS Sonoma et Safari 17, vous pouvez transformer des sites Web en « applications Web », qui peuvent être placées dans le dock de votre Mac et accessibles comme n'importe quelle autre application sans ouvrir de navigateur. Lisez la suite pour savoir comment cela fonctionne. Grâce à une nouvelle option du navigateur Safari d'Apple, il est désormais possible de transformer n'importe quel site Web sur Internet que vous visitez fréquemment en une « application Web » autonome qui se trouve dans le dock de votre Mac et est accessible à tout moment. L'application Web fonctionne avec Mission Control et Stage Manager comme n'importe quelle application et peut également être ouverte via Launchpad ou SpotlightSearch. Comment transformer n'importe quel site Web en

    Comment bloquer l'accès aux sites Web dans Edge Comment bloquer l'accès aux sites Web dans Edge Jul 12, 2023 am 08:17 AM

    Parfois, nous souhaitons bloquer certains sites Web sur Microsoft Edge pour de nombreuses raisons, que ce soit pour le contrôle parental, la gestion du temps, le filtrage de contenu ou encore des problèmes de sécurité. Une motivation courante est d’être plus productif et de rester concentré. En bloquant les sites Web distrayants, les utilisateurs peuvent créer un environnement propice au travail ou aux études, minimisant ainsi les distractions potentielles. Enfin, le filtrage du contenu est important pour maintenir un environnement en ligne sûr et respectueux. Le blocage des sites Web contenant du contenu explicite, offensant ou répréhensible est particulièrement important dans les milieux éducatifs ou professionnels où le respect de normes et de valeurs appropriées est crucial. Si vous pouvez comprendre cette situation, cet article est fait pour vous. Voici comment bloquer l'accès à Internet dans Edge

    Comment supprimer les sites Web fréquemment visités de Safari sur iPhone Comment supprimer les sites Web fréquemment visités de Safari sur iPhone Jul 10, 2023 pm 04:41 PM

    Par défaut, la plupart des utilisateurs d'iPhone utilisent le navigateur Safari sur leur iPhone. Ils parcourent et visitent différents types de sites Web sur le navigateur Safari. Certains utilisateurs d'iPhone ont signalé qu'ils en avaient assez de voir les sites Web fréquemment visités sur l'écran de démarrage après avoir lancé Safari sur leur iPhone. Afin de modifier l'apparence de l'écran de démarrage, vous devez le modifier. Si vous souhaitez supprimer de Safari les sites Web fréquemment visités, nous vous présentons ici quelques étapes simples expliquant comment le faire facilement. Comment supprimer les sites Web fréquemment visités de Safari sur iPhone Étape 1 : Vous devez d'abord lancer le navigateur Safari sur votre iPhone. 2ème

    Pour résoudre le problème de la vitesse d'accès aux sites Web Python, utilisez des méthodes d'optimisation de base de données telles que l'indexation et la mise en cache. Pour résoudre le problème de la vitesse d'accès aux sites Web Python, utilisez des méthodes d'optimisation de base de données telles que l'indexation et la mise en cache. Aug 05, 2023 am 11:24 AM

    Pour résoudre le problème de la vitesse d'accès aux sites Web Python, utilisez des méthodes d'optimisation des bases de données telles que l'indexation et la mise en cache. Dans le processus de développement et de maintenance des sites Web Python, nous rencontrons souvent le problème de la vitesse d'accès lente des sites Web. Afin d'améliorer la vitesse de réponse du site Web, nous pouvons utiliser certaines méthodes d'optimisation de la base de données, telles que l'indexation et la mise en cache. Cet article expliquera comment utiliser ces méthodes pour résoudre les problèmes de vitesse d'accès aux sites Web Python et fournira des exemples de code correspondants à titre de référence. 1. Utilisez des index pour optimiser les requêtes de base de données. Les index constituent une structure de recherche rapide de données dans la base de données, ce qui peut grandement

    Quels sont les sites php ? Quels sont les sites php ? Jul 27, 2023 am 10:54 AM

    Site Web PHP : 1. Facebook, l'une des plus grandes plateformes de médias sociaux au monde ; 2. WordPress, un système de gestion de contenu open source permettant de créer et de gérer rapidement divers types de sites Web ; 3. Magento, une puissante plateforme de commerce électronique, utilisée pour créer et gérer des boutiques en ligne ; 4. Joomla, un système de gestion de contenu open source populaire utilisé pour créer différents types de sites Web ; 5. Wikipedia, une encyclopédie en ligne gratuite qui fournit des connaissances et des informations sur divers sujets ; et plus encore.

    7 moyens efficaces pour résoudre rapidement les problèmes de vitesse d'accès aux sites Web en langue Go 7 moyens efficaces pour résoudre rapidement les problèmes de vitesse d'accès aux sites Web en langue Go Aug 05, 2023 pm 04:43 PM

    7 moyens efficaces pour résoudre rapidement les problèmes de vitesse d'accès aux sites Web en langue Go Avec le développement rapide d'Internet, la vitesse d'accès aux sites Web est cruciale pour l'expérience utilisateur. En tant que langage de programmation hautes performances, le langage Go est largement utilisé dans la création d'applications réseau à haute concurrence. Cependant, dans le développement réel, nous pouvons rencontrer le problème de la lenteur de l'accès aux sites Web en langage Go. Cet article présentera 7 façons efficaces de résoudre ce problème et fournira des exemples de code correspondants. La mise en cache est l’un des moyens les plus courants et les plus efficaces pour améliorer la vitesse d’accès aux sites Web.

    See all articles