内存与性能—事件处理程序

事件处理程序为为web应用程序提供交互能力，但是大量使用事件处理程序，直接影响页面的整体运行性能。原因如下：

1 每个函数都是对象，都会占用内存，内存中对象越多，性能越差。

2 事先指定事件处理程序导致DOM当问次数过多，延迟整个压面的交互就绪时间。

如何提升？

1 事件委托

2 移除事件处理程序

在不需要的时候移除

（a:纯粹的操作DOM移除了绑定有事件处理程序的元素

b:卸载页面时没有清理干净事件处理程序

　　最好在页面卸载前移除所有时间处理程序

）

时间： 2024-10-12 12:53:15

内存与性能—事件处理程序的相关文章

事件相关的-内存和性能

由于事件处理程序带来的交互能力,在JavaScript中,添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能. 导致这一问题原因有哪些: 事件相关的处理函数越多,所占用的内存越多,函数是对象,而对象就会占据内存,从而占据内存空间.而内存越多性能就越差. 其次必须事先指定事件处理程序,则需要访问的dom次数增多,会延迟整个页面的交互就绪时间. 事实上从事件处理程序的角度出发,还有那些方法可以提升性能的? 事件委托由于在一些常用事件是支持冒泡的,所以可以在其父节点或者其祖先节点上获取到对

JavaScript 中的内存和性能、模拟事件（读书笔记思维导图）

由于事件处理程序可以为现代 Web 应用程序提供交互能力,因此许多开发人员会不分青红皂白地向页面中添加大量的处理程序.在 JavaScript 中,添加到页面上的事件处理程序数量将直接关系到页面的整体运行性能.导致这一问题的原因是多方面的.首先,每个函数都是对象,都会占用内存:内存中的对象越多,性能就越差.其次,必须事先指定所有事件处理程序而导致的 DOM 访问次数,会延迟整个页面的交互就绪时间.从如何利用好事件处理程序的角度出发,还是有一些方法能够提升性能的. 事件经常由用户操作或通过其他浏览

提升性能-事件委托技术

--- title: 提升性能——事件委托技术 date: 2016-05-11 22:13:43 tags: [javascript,improving performance, font-end] --- 提升页面性能之事件委托技术 (整理摘选自<Javascript高级程序设计>)概述利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件. 实际例子 HTML部分 <ul id = "mylinks"> <li id = "g

javascript动手写日历组件(3)——内存和性能优化（by vczero）

一.列表 javascript动手写日历组件的文章列表,主要是通过原生的JavaScript写的一个简约的日历组件: (1)javascript动手写日历组件(1)——构建日历逻辑:http://www.cnblogs.com/vczero/p/js_ui_1.html (2)javascript动手写日历组件(2)——优化UI和添加交互:http://www.cnblogs.com/vczero/p/js_ui_2.html (3)javascript动手写日历组件(2)——内存和性能优化:h

unity内部：内存和性能（以及Unity5的升级优化）

我们的脚本代码里经常会需要访问gameObject引用或者某个组件的引用,最好的方式当然是在脚本Awake的时候就把这些可能访问的东西都缓存下来:如果需要访问临时gameObject实例的某属性或者临时某组件的gameObject实例,在能够确保组件一定存在(可以使用[RequireComponent( typeof(AudioSource ))] 如果没有自动添加移除不了!)的情况下,可以用属性访问,毕竟属性访问比GetComponent要快上一倍,但是如果不能确定组件是否存在,甚

《JAVASCRIPT高级程序设计》事件处理程序和事件类型

一.事件流谈到事件,首要要理解事件流的概念:事件流是指从页面接受事件的顺序:“DOM2级事件”规定事件流包括三个阶段:事件捕获阶段.处于目标阶段和事件冒泡阶段.目前大部分的浏览器的事件流是事件冒泡,即最开始由具体的元素接收事件,然后逐级传播到不具体的节点,直到传播到windows对象:另一种事件流是事件捕获,目前使用得比较少,是指文档对象先接收到事件,然后逐级向下,一直传播到事件的实际目标. 二.事件处理程序 1.两种表示方式 <input type="button" valu

JavaScript之事件处理程序

一.原生JavaScript事件处理程序 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="EvenUtil.js" charset="UTF-8"></script> <script src="demo1.js" charset

如何写一个跨浏览器的事件处理程序 js

如何写一个合格的事件处理程序,看如下代码: EventUtil可以直接拿去用不谢 <!DOCTYPE html> <html> <head> <title> </title> </head> <body> <input type="button" name="ids" id="ids" value="value"> <sc

IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素

IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素. attachEvent(type,listener); listener函数中的this不是指向执行当前事件的dom而是window切记,感觉这一点IE做的太奇怪了!