前端页面性能调优较常用的工具有Yslow和PageSpeed（google），小编以Yslow工具做下前端性能调优小结：安装Yslow要先安装Firebug（以火狐为例），打开Firebug窗口，选择Yslow选项。点击RunTest运行Yslow。调优方法如下：MakefewerHTTPrequests：尽量使用少的http请求，比如把多个js，css进行合并UseaCDN：尽量使用cdn，减少
分类：
其他好文 时间：
2020-08-26 18:55:35
阅读次数：
59
Web优化的对象包括页面性能、用户体验、开发效率、代码优化、网络延迟等，本系列会列举出众多常用的优化技巧，每个技巧都可深入分析，在此只做抛砖引玉。 本系列优化内容提炼于《前端面试宝典》、《高效前端》、《高性能JavaScript》、《CSS重构》等书籍，以及《2020前端性能优化清单》等网络资源。 ...
分类：
Web程序 时间：
2020-07-20 10:48:52
阅读次数：
87
为了帮助开发者更好地衡量和改进前端页面性能，W3C 性能小组引入了 Navigation Timing API，实现了自动、精准的页面性能打点； 开发者可以通过 window.performance 属性获取。 performance.timing 接口（定义了从 navigationStart 至 ...
分类：
其他好文 时间：
2020-07-19 00:59:12
阅读次数：
117
前言，最近利用碎片时间拜读了一下尼古拉斯的另一巨作《高性能JavaScript》，今天写的文章从“老生常谈”的页面重绘和重排入手，去探究这两个概念在页面性能提升上的作用。 一.重排 & 重绘 有经验的大佬对这个概念一定不会陌生，“浏览器输入URL发生了什么”。估计大家已经烂熟于心了，从计算机网络到j ...
分类：
其他好文 时间：
2020-07-19 00:48:55
阅读次数：
101
标签（空格分隔）： 前端性能 前端性能：WebPagetest 功能简介 WebPagetest，是前端性能测试的利器： 可以为我们提供全方位的量化指标，包括页面的加载时间、首字节时间、渲染开始时间、最早页面可交互时间、页面中各种资源的字节数、后端请求数量等一系列数据； 还可以自动给出被测页面性能优 ...
分类：
其他好文 时间：
2020-06-25 23:17:43
阅读次数：
47
我们在做项目中有可能会遇到这样一种情况 比如A状态传递过来的是数字 我们需要使用switch来判断这个所属状态分别代表什么意思 （当然啦 这个过滤器也可以实现） 不过今天我要跟大家分享的是使用计算属性来实现 快跟着我来学习一下吧 :title="typelist(items.paymentType) ...
分类：
其他好文 时间：
2020-06-17 19:57:04
阅读次数：
112
话说前头： 上次写了一篇webpack的学习心得，webpack能做到提升前端的性能，其模块打包最终生成一个或少量的文件能够减少对服务端的请求。除此之外，本次的图片懒加载（当然不仅限于图片，还可以有视频，flash等）也是一种优化前端性能的方式。使用懒加载可以想要看图片时才加载图片，而不是一次性加载 ...
分类：
其他好文 时间：
2020-06-16 14:59:22
阅读次数：
55
话说前头： 上次写了一篇webpack的学习心得，webpack能做到提升前端的性能，其模块打包最终生成一个或少量的文件能够减少对服务端的请求。除此之外，本次的图片懒加载（当然不仅限于图片，还可以有视频，flash等）也是一种优化前端性能的方式。使用懒加载可以想要看图片时才加载图片，而不是一次性加载 ...
分类：
其他好文 时间：
2020-06-15 12:18:12
阅读次数：
53
最近发现浏览器内置对象里有个好东西，window.performance。这里面包含着浏览器性能相关的各种数据，然后其中的timing属性，就是所有阶段的用时统计，从这一点我们就可以简单的从浏览器运行时间上进行分析。 function getsec(time) { return time / 100 ...
背景 如果你是个前端开发人员，你肯定知道线上环境要把js，css，图片等压缩，尽量减少文件的大小，提升响应速度，特别是对移动端，这个非常重要。 压缩 压缩方式 前端压缩的方式很多，依赖java的有ant工具，前端自己打包压缩的有grunt，gulp，webpack，这些压缩也很重要，基本上能压缩50 ...
分类：
其他好文 时间：
2020-06-10 12:46:08
阅读次数：
57
