一:DOM与浏览器：

重排：改变页面的内容。

重绘：浏览器显示的内容。

添加顺序：尽量在appendchild之前。

合并DOM操作-利用csstext,

缓存布局信息

文档碎片。

二 DOM 与事件：

事件委托。

三 DOM 与前端模板

能更好的对逻辑和视图进行分离，mvc架构基础（angular.js）

这里附上一篇很棒的文章，DOM优化四种方法http://www.blueidea.com/tech/web/2010/7427.asp

DOM优化的更多相关文章

  1. js DOM优化相关探索

    我在这尝试两个方面:-->DOM与js -->DOM与浏览器 (最近在秒味视频上学到不少,哈哈哈) 一.DOM与js 1.js与dom的交互问题 频繁的与dom交互,是一件浪费时间与金钱的 ...

  2. 【DOM】1.DOM优化

    1.JS include :DOM BOM ECMA 2.Browser 分别独立实现dom & JS as if two isolated islands 3.JS操作DOM from th ...

  3. 一些JavaScript中的DOM的优化小技巧

    在进行DOM优化时需要关注的问题有:修改DOM的时候,会引起页面的重排,重绘.因为JS是单线程执行的,那么在重排重绘的过程中可能会阻塞用户的操作.为了更好的用户体验,必须要严格控制这些操作. 一.对象 ...

  4. DOM的相关优化

    为什么要进行DOM优化? DOM对象本身也是一个js对象,所以严格来说,并不是操作这个对象慢,而是说操作了这个对象后,会触发一些浏览器行为,比如布局(layout)和绘制(paint). 首先先说一些 ...

  5. DOM解析和优化

    DOM解析 1. css不会阻塞DOM解析(DOM Tree),但会阻塞DOM渲染(css Tree + DOM Tree -> render Tree )2. JS阻塞DOM解析,但浏览器会预 ...

  6. React虚拟DOM浅析

    在Web开发中,需要将数据的变化实时反映到UI上,这时就需要对DOM进行操作,但是复杂或频繁的DOM操作通常是性能瓶颈产生的原因,为此,React引入了虚拟DOM(Virtual DOM)的机制. 什 ...

  7. 个人对于Virtual DOM的一些理解

    之前一直认为react的Virtual DOM操作会比传统的操作DOM要快,这其实是错误的,React 从来没有说过 "React 比原生操作 DOM 快".如果没有 Virtua ...

  8. 框架操作DOM和原生js操作DOM比较

    问题引出 对于Angular和React操作DOM的速度,和原生js操作DOM的速度进行了一个比较: 一个同学做的demo 代码如下: <!DOCTYPE html> <html n ...

  9. JS学习笔记12_优化

    一.可维护性优化 1.添加注释 注释能够增强代码的可读性以及可维护性,当然,理想情况是满满的注释,但这不太现实.所以我们只需要在一些关键的地方添上注释: 函数和方法:尤其是返回值,因为直接看不出来 大 ...

随机推荐

  1. Account Team使用说明

    Account  Team Account Team 以下简称客户小组. 背景介绍 帐户是与您的业务相关的公司和组织,每个帐户都存储了商家名称.地址和电话号码等信息.可以针对每个帐户存储相关的联系人. ...

  2. POJ 2195：Going Home（最小费用最大流）

    http://poj.org/problem?id=2195 题意:有一个地图里面有N个人和N个家,每走一格的花费是1,问让这N个人分别到这N个家的最小花费是多少. 思路:通过这个题目学了最小费用最大 ...

  3. [已解决] 点击 【Show in system explorer】Eclipse卡死，未响应

    新版的Eclipse自带了 [Show in system explorer] 功能很方便,有一天突然不好用了,点它Eclipse就卡死, 可能由以下原因导致的: (可能性最大)windows本身有问 ...

  4. Flowplayer-JavaScript API

    source url: https://flowplayer.org/docs/api.html Global API access Use the flowplayer function to ge ...

  5. 在网上看到的一篇文章关于js和php编码的

    解决办法: 采用js对URL中的汉字进行escape编码. <a href="" onclick="window.open('product_list.php?p_ ...

  6. iscroll 使用及遇到的问题

    介绍: iscroll.js 是滑动事件.在手机上可以快速的滑动,用户体验很好.在线例子: 选择套餐 iScroll必须在调用之前实例化---用法 <script src="iscro ...

  7. viewport和media query

    viewport: 你可以定义viewport的宽度.如果你不使用width=device-width,在移动端上你的页面延伸会超过视窗布局的宽度(width=980px),如果你使用了width=d ...

  8. hdu4352 XHXJ's LIS

    链接 这个题最不好想到的是状态的保存,也没有几亿的数组让你开,怎么保存前面出现了哪些数字. 题意让你求最长上升子序列的长度为k的数字的数目,可以是不连续的,可以保留一个状态栈,栈顶部依次更新,再保证长 ...

  9. Oracle数据库字段类型说明

    目前Oracle 数据库大概有26个字段类型,大体分为六类,分别是字符串类型.数字数据类型.日期时间数据类型.大型对象(LOB)数据类型.RAW和LONG RAW数据类型.ROWID和UROWID数据 ...

  10. 爬虫：获取多次跳转后的页面url

    <?php $url = "xxxx"; $xx = get_headers($url,true); var_dump($xx); ?> Nbimer主页 剖面加阴影应 ...