Vanessa

大前端的点滴生活
PerformanceOptimization 0 篇文章

用十条命令在一分钟内检查 Linux 服务器性能

如果你的 Linux 服务器突然负载暴增,告警短信快发爆你的手机,如何在最短时间内找出 Linux 性能问题所在?来看 Netflix 性能工程团队的这篇博文,看它们通过十条命令在一分钟内对机器性能问题进行诊断。概述通过执行以下命令,可以在 1 分钟内对系统资源使用情况有个大致的了解。uptimedmesg|tailvmstat1mpstat-PALL1pidstat1iostat-xz1free-msar-nDE

Web 性能 API——帮你分析 Web 前端性能

开发一个现代化的互联网网站是一项复杂的任务,需要各种职能的密切合作以应对用户日新月异的需求。其中,网页的性能直接决定了用户的体验,而随着新型客户端浏览设备的出现与网站功能的日益复杂化,对于性能的专注也达到了前所未有的高度。传统的网站性能监测通常有以下几种方式:借助传统的开发者工具查看网络请求,例如浏览器的 F12 工具、Fiddler、Charles 等等。基本方式是通过追踪 HTTP 请求与响应的时间,以图

SPDY 协议简介及如何编译含有 SPDY 的 nginx

SPDY 是 Google 开发的基于传输控制协议 (TCP) 的应用层协议(发音同“speedy”),以最小化网络延迟,提升网络速度,优化用户的网络使用体验。SPDY 并不是一种用于替代 HTTP 的协议,而是对 HTTP 协议的增强。新协议的功能包括数据流的多路复用、请求优先级,以及 HTTP 包头压缩。谷歌表示,引入 SPDY 协议后,在实验室测试中页面加载速度比原先快 64%。目前主流浏览器 GoogleChromeMoz

使用 ETags 减少 Web 应用带宽和负载

介绍最近,大众对于 REST 风格应用架构表现出强烈兴趣,这表明 Web 的优雅设计开始受到人们的注意。现在,我们逐渐理解了 “3W 架构(ArchitectureoftheWorldWideWeb)” 内在所蕴含的可伸缩性和弹性,并进一步探索运用其范式的方法。本文中,我们将探究一个可被 Web 开发者利用的、鲜为人知的工具,不引人注意的“ETag 响应头(ETagResponseHeader)”,以及如何将它集成进基

B3log 静态资源分离

静态资源分离好处很多,比如:可以用不同域来增加并发;加快页面渲染;减少服务器压力;当静态资源修改时,不用重启应用服务器等等。对 GAE 上的 B3log 来说好处当然更多了:由于 GAE 配额的限制,把静态资源放到另外的服务器上,出口配额可以减少不少哦由于 GAE 需要翻墙、代理,无形中的各种解析跳转必然会花费更多的时间,把静态资源放到国内的 BAE,SAE 上那将会快很多当你修改了静态资源,就不用麻烦的再去部署了。现

window resize 优化:after resize completed, fire event

场景:每当 window 发生变化时,需要对其内部的某些元素大小重新设定。原因:如果页面本身就非常复杂,在对内部元素大小设定后,可能导致整个页面重新渲染。调用 resize 方法,只要用户不停的改变窗口大小就会对页面进行不停的渲染,最终导致大量消耗 CPU,页面就卡卡卡。尤其是 IE6,如果 resize 影响到了 window 大小,将会继续 resize,最终导致不停的 resize,然后就崩溃了。思路:在用户 resi

Node.js 小工具—— CSS 基本语法检查

继 Node.js 小工具之后,基于 csslint 写了个超简单的 CSS 语法校验工具。思路:递归查找目录下的 css 文件,首先去除文件路径以 svn 开头的,然后选择以 css 结尾的文件。将查找到的文件路径保存到变量中。对保存的文件路径依次使用 exec 执行 csslint 命令,由于 exec 只有在异步执行中才可获取执行结果,因此每次执行的结果都进行了读写文件的操作。读取文件中的内容,把原有内容加上执行的结果再写入到文

Node.js 小工具

继 grunt 初识后,发现 B3log 上面用他太过于强大了,在 CSS 方面也没研究出怎么用他来进行压缩。B3log 主要是需要一些压缩,批量替换的版本号的功能。既然自己学习了 Node.js,何不学以致用呢?1. 代码压缩 https://github.com/b3log/b3log-solo-skins/blob/0.5.0/helper/tools/compress.js2. 批量替换 https://githu

grunt 初识

继前天学习了 Node.js 之后,昨天研究了下 grunt。今天用 Node.js 写了两个小工具。太久没有研究新东西了,grunt 学习起来,颇为坎坷。需要在此记录下,以提醒后人不要重蹈我的覆辙 ^^grunt: 用于辅助中型以上的 JavaScript 项目:定义项目描述属性;合并文件;搭建项目模版;校验 JS; 压缩代码;测试;静态服务器;部署等扩展功能。1. 安装 gruntnpminstall-ggrunt2. 新建