摘要：浏览器工作原理：https://www.cnblogs.com/thonrt/p/10008220.html 浏览器渲染原理： https://www.cnblogs.com/thonrt/p/10008742.html 基于上面这两篇文章，我们可以把web性能优化分为两大方面： 本文主要介绍网络传 阅读全文

摘要：在web性能优化-浏览器工作原理中讲到，浏览器渲染是在renderer process中完成的。 那我们来看下renderer process究竟干了什么？ Renderer Process包含的线程有： 1.主线程 main thread 2. 工作线程 workder thread 3. 合成器 阅读全文

摘要：要彻底了解web性能优化的问题，得搞清楚浏览器的工作原理。 我们需要了解，你在浏览器地址栏中输入url到页面展示的短短几秒中，浏览器究竟做了什么，才能了解到为什么我们口中所说的优化方案能够起到优化作用。 浏览器的多进程架构（以下的例子都是以chrome为例） chrome由多个进程组成，每个进程都有 阅读全文

摘要：避免for-in 把数组长度保存在局部变量中 较少迭代次数（Duffs Device） 基于函数的循环比基于循环的迭代消耗性能更多 优化if-else,一般switch比if-else速度快(hash tabel) 1）避免用for-in 常见的循环有:for、do-while、while、for- 阅读全文

摘要：减少DOM数量 减少DOM操作 批量处理DOM操作 批量处理样式修改 尽量不要使用tabel布局 尽量不要使用css表达式 string用数组join css选择符优化 1.减少DOM数量 在HTML生成DOM树的时候，DOM数量越少，HTML渲染速度越快 2.减少DOM操作 每次操作DOM，都会带 阅读全文

摘要：静态资源用CDN部署 添加Expires或者cache-control报文头 Gzip压缩传输文件 配置Etags 使用Get ajax请求 避免空图片src 尽早flush response 减少cookies大小 1.使用CDN CDN通过部署在不同地区的服务器来提高客户的下载速度。 2.添加E 阅读全文

摘要：多图标合并，用css分隔 设置较长时间的过期时间 合并多个css文件 合并多个js文件 根据域名划分内容 首先介绍一款速度测试工具：webpagetest(填上url，username，password就开始测试了) 这就是测试结果了 也可以通过时间帧去测试网页速度，推荐工具：ScreenerToG 阅读全文