Nginx Rewrite 规则

Nginx Rewrite 是利用 nginx 提供的全局变量或自己设置的变量,结合正则表达式和标志位实现 url 重写以及重定向。rewrite 只能放在 server{}, location{}, if{} 中,并且只能对域名后边的除去传递的参数外的字符串起作用,例如 http://seanlook.com/a/we/index.php?id=1&u=str 只对 /a/we/index.php 重写。语法 rewrite regex replacement [flag];

如果相对域名或参数字符串起作用,可以使用全局变量匹配,也可以使用 proxy_pass 反向代理。

表面看 rewrite 和 location 功能有点像,都能实现跳转,主要区别在于 rewrite 是在同一域名内更改获取资源的路径,而 location 是对一类路径做控制访问或反向代理,可以 proxy_pass 到其他机器。很多情况下 rewrite 也会写在 location 里,它们的执行顺序是:

前端 MVC 变形记

背景

MVC是一种架构设计模式,它通过关注点分离鼓励改进应用程序组织。在过去,MVC被大量用于构建桌面和服务器端应用程序,如今Web应用程序的开发已经越来越向传统应用软件开发靠拢,Web和应用之间的界限也进一步模糊。传统编程语言中的设计模式也在慢慢地融入Web前端开发。由于前端开发的环境特性,在经典MVC模式上也引申出了诸多MV模式,被实现到各个Javascript框架中都有多少的衍变。在研究MV模式和各框架的过程中,却是“剪不断、理还乱”:

  1. 为什么每个地方讲的MVC都不太一样?
  2. MVP、MVVM的出现是要解决什么问题?
  3. 为什么有人义正言辞的说“MVC在Web前端开发中根本无法使用”?

-webkit-text-size-adjust 使用说明

-webkit-text-size-adjust 是为了保持网页字体大小的一个属性,因为有些网页的字体缩小以后,难以识别,并且也严重影响到用户体验,如果在全局定义了 html { -webkit-text-size-adjust: none; } 会导致另一个现象:浏览器一般提供给小群体用户一个功能,就是放大与缩小网页视图。禁用了这一属性,在 chrome 下放大网页,会导致其它元素均放大,而文字却依然为原定义的 12px。

Web 消息推送及 WebSocket 简介

Web 的交互过程

Web 应用典型的信息交互过程通常是:客户端通过浏览器发出一个请求,服务端接收请求后进行处理并返回结果给客户端,然后客户端浏览器将信息呈现出来。

这种机制对于信息交互不是特别频繁的应用尚能相安无事,但是对于那些实时要求比较高的应用来说(比如在线游戏),当客户端浏览器准备呈现获取到的信息的时候,这些信息在服务器端可能已经过时,所以,保持客户端和服务器端的信息同步是实时 Web 应用的关键要素。 在 WebSocket 规范出来之前,开发人员想实现这种应用,不得不采用一些折中的方案,其中最常用的就是轮询(Polling)和 Comet(轮询的改进版本,又可细分为长轮询机制与流技术)技术。这几种方案基本都是在用 Ajax 来模拟实时的效果,服务器与客户端编程都比较复杂,而且效率不高。

前端开发者不得不知的 ES6 十大特性

ES6(ECMAScript2015)的出现,无疑给前端开发人员带来了新的惊喜,它包含了一些很棒的新特性,可以更加方便的实现很多复杂的操作,提高开发人员的效率。

本文主要针对 ES6 做一个简要介绍。 主要译自:http://webapplog.com/ES6/comment-page-1/。也许你还不知道 ES6 是什么, 实际上, 它是一种新的 javascript 规范。在这个大家都很忙碌的时代,如果你想对 ES6 有一个快速的了解,那么请继续往下读,去了解当今最流行的编程语言 JavaScript 最新一代的十大特性。

前端性能优化总结

优化方向 优化手段
请求数量 合并脚本和样式表,CSS Sprites,拆分初始化负载,划分主域
请求带宽 开启GZip,精简JavaScript,移除重复脚本,图像优化
缓存利用 使用CDN,使用外部JavaScript和CSS,添加Expires头,减少DNS查找,配置ETag,使AjaX可缓存
页面结构 将样式表放在顶部,将脚本放在底部,尽早刷新文档的输出
代码校验 避免CSS表达式,避免重定向

SASS优化响应式断点管理

当你需要搞定响应式布局时,一堆堆的媒体查询、大量的属性、属性值往往可以把你搞颠,SASS(或者诸如此类的预处理器)被认为是处理响应式断点的最佳利器。

说到响应式断点处理,很多种方式涌上心头,经常有人问哪种方式最优,正如前端开发领域的大多数问题一样,这个问题同样没有标准答案,我们需要具体问题具体分析。更确切的说,难度不在于提出一个系统,而是提出一个既足够灵活(适用大部分场合)又不非常复杂的系统。

在今天的文章里,我将给大家介绍若干种响应式布局断点的解决方案,每一种都经过实践验证,一些方案可能优于其他方案,我会把决定的权利交给大家。