js-关于性能优化的一些学习总结

关键词：

性能优化的方法有：

1、减少HTTP请求：合并CSS/JS，使用CSS sprite等

2、压缩CSS/JS/图片

3、样式表放头部，JS放body底部：JS放在head中，将会等到js全部下载解析和执行后才会显示页面内容。

4、减少DOM操作，DOM操作很消耗性能，另外注意HTMLCollection和NodeList。这两个对象是动态的，每次访问都会进行一次查询。在迭代中避免重复访问。

历史上的DOM集合接口。主要不同在于HTMLCollection是元素集合而NodeList是节点集合（即可以包含元素，也可以包含文本节点）。所以 node.childNodes 返回 NodeList，而 node.children 和 node.getElementsByXXX 返回 HTMLCollection 。（来自知乎贺师俊）

function convertToArray(nodes){
    var array=null;
    try{
        array=Array.prototype.slice.call(nodes,0);//针对非IE
    }catch(ex){
        array=new Array();
        for(var i=0,len=nodes.length;i<len;i++){
            array.push(nodes[i];
        }
    }

    return array;
}

querySelectorAll()方法返回的是一个NodeList实例，类似于一组元素的快照，非动态。

5、关于重绘（repaint）和重排（reflow）。

重绘并不一定导致重排，比如修改某个元素的颜色，只会导致重绘；而重排之后，浏览器需要重新绘制受重排影响的部分。导致重排的原因有：

• 添加或删除DOM元素
• 元素位置、大小、内容改变
• 浏览器窗口大小改变
• 滚动条出现

6、事件委托

利用事件冒泡，指定一个事件处理程序，管理某一个类型的所有事件。在DOM树中尽量搞的层次上添加一个事件处理程序，这样可以只取得一个DOM元素，添加一个事件处理程序

关于前端的一些性能优化，你知道多少

一、减少请求资源大小或者次数　1、尽量和并和压缩css和js文件。（将css文件和并为一个。将js合并为一个）　　原因：主要是为了减少http请求次数以及减少请求资源的大小　　打包工具：　　webpack　　gulp　　grunt.　　....2、... 查看详情

javascript性能优化总结

js加载顺序优化原理：在使用src属性加载JavaScript的过程中浏览器必须首先下载外部文件的代码，这要占用一些时间，然后，解析并运行此代码。此过程中，页面解析和用户交互是被完全阻塞的。解决方案:——将所有<script>标... 查看详情

在家办公算划水？你错了。更一篇关于性能优化的总结(代码片段)

...这段时间刚好在家可以抽空多充实下自己，今天就更一篇关于性能优化的总结相关内容之后会在GitHub上更新，希望多多关注（顺手留下GitHub链接，需要获取相关面试等内容的可以自己去找）https://github.com/xiangjiana/Android-MS(VX：mm145... 查看详情

android性能优化之谈谈java内存区域(代码片段)

...所有人都知道内存使用对性能的影响，网上也有很多关于内存优化技术的文章，但大多都不够系统，没有贯通全局。在《Android性能优化之String篇》文中我们理解了一个对象占用空间的大小以及String字符串对我们性能... 查看详情

android性能优化总结篇~(代码片段)

...份学习手册做参考。其实几个月之前，就整理收集过关于Android性能优化的知识脑图总结和学习手册文档！既能够夯实底层原理、性能调优等核心技术点，又能够掌握普通开发者，难以触及的架构设计方法论。那你... 查看详情

linux性能优化（学习总结）

linux性能问题我们都可以从top着手top反应了服务器的负载，任务，cpu，内存及各进程的情况。   系统负载（load），反应服务器1，5，15分钟各个时间段的负载情况。当load的值超出cpu总数的60%，系统负载过高。 这列... 查看详情

性能测试：聊聊性能优化模式

...看收藏的技术贴，难得今天有空，看了篇美团技术团队的关于性能优化的内容，感觉不错，将其中的一些观点和方法做了总结归纳，其中还掺杂一些个人的思考，写下这篇博客，以备日后查阅。。。原文链接：性能优化模式 ... 查看详情

一些关于sql优化的总结

慢SQL核查NO.1：com.cmos.dao.basesr.TSrProblemProcesExceptionMapper.queryExceptionCountSELECT   count(1)FROM   t_sr_problem_procest1,   (     查看详情

android性能优化之谈谈java内存区域(代码片段)

Android性能优化之谈谈Java内存区域>基础的扎实程度直接决定高度。最近一年副业主要在学习投资和技能学习，把以前学习内存分析的一些笔记总结发出来，写了很多笔记总结都没有写完就又忙着了，最近再次总结复... 查看详情

android性能优化之谈谈java内存区域(代码片段)

Android性能优化之谈谈Java内存区域>基础的扎实程度直接决定高度。最近一年副业主要在学习投资和技能学习，把以前学习内存分析的一些笔记总结发出来，写了很多笔记总结都没有写完就又忙着了，最近再次总结复... 查看详情

关于模型优化的思考

1、提高深度学习模型识别率的准确率的思考（1）数据增强技术（图像翻转、白化），对训练数据做一些处理增加数据的抗造性能（2）模型改进，尝试多种模型（3）调整学习率首先使用较大的学习率进行训练，观察目标函数值... 查看详情

前端知识总结--性能优化

前端性能优化方案大体分为网络传输优化和页面内容优化，网络方面1、减少http请求合并js文件合并css文件雪碧图的使用(csssprite)使用base64表示简单的图片2、减小资源体积gzip压缩js混淆css压缩图片压缩3、使用缓存DNS缓存CDN部署与... 查看详情

前端性能优化(代码片段)

gitbook完整版集合文章目录gitbook完整版集合性能优化初始阶段（加载优化）首页加载优化1、首页加载图片过多1、总结：2、首页请求过多2、总结（首页请求量过多，可以通过一些手段来减少资源的请求量）... 查看详情

善用性能工具进行sql整体优化

...工程，首先要讲究从整体到局部。今天我们首先学习关于数据库整体优化都有哪些性能工具，接着分析这些工具的特点，并结合案例进行探索，最后再进行总结和思考。总体学习思路如下图所示：都有哪些性... 查看详情

mysql多层面优化总结

关于数据库优化是一个老生常谈的问题,这块也有很多既有的经验.下面就这个问题谈一下我在平时工作中的一些总结.着重从多个层面来总结这块的优化技巧.硬件层面使用高速的存储设备,ssd或者Fusionio卡考虑使用磁盘阵列操作系... 查看详情

android性能优化之string篇

Android性能优化之String篇关于String相关知识都是老掉牙的东西了，但我们经常可能在不经意的String字符串拼接的情况下浪费内存，影响性能，也常常会成为触发内存OOM的最后一步。所以本文对String字符串进行深度解析&#... 查看详情

js性能优化个人总结

---恢复内容开始---1.避免全局变量查找，局部变量比全局变量快很多2.用定时器的时候尽量使用setInterval  因为setTimeout每一次都会初始化一个定时器，而setInterval只会在开始的时候初始化一个定时器。3.如果要连接多个字符... 查看详情

打个总结:web性能优化(代码片段)

前段时间优化一个公司历史老项目的Web性能，却引出了一系列的问题，让我反思良多。我通过Chrome的Lighthouse工具可以看出一些性能参数和问题反馈，我逐一对其进行优化。根据资源请求的不同，大致可以分为前端资源性能和后... 查看详情