手机网站实现图片惰性加载

什么是图片惰性加载呢?
顾名思义,惰性指的是我们只将用户视野范围内(浏览器窗口的可视区域)的图片加载,而用户视野范围外的图片先不加载,当用户看到这些图片时再做加载。
这样做的好处在于哪里呢?

  1. 用户访问速度上升了,浏览器的加载进度条很快就加载完毕。
  2. 节省用户流量。

那么如何实现呢?
我们需要解决两个问题:

  1. 如何知道用户是否能看见这张图片?
  2. 如何让看不到的图片不加载,而在需要的时候再去加载?

继续阅读 »

简单易用前端自动化工具-Gulp

Gulp是最近很火的开源项目,是一个基于任务的设计模式的自动化前端构建工具。同类工具中有比它成名更早更为流行的是Grunt,国内也有百度出品的FIS。
Grunt很强大,有很完善的社区和设计模式,但是学习成本很高。FIS是互联网公司的产物,更多的是匹配适应自己的项目流程。虽然有亮点有创新,但是社区实在有些混乱,人员变动也是其中很大的变数之一。Gulp相比起来就简单可靠的多,对于我这样的喜欢偷懒的人来说简直是绝配!
实际工作中,我用Gulp的功能并不多,主要也只是用于项目文件的压缩、测试、合并!这些都可以很容易用Gulp实现。

继续阅读 »

Sublime text2破解方法

用过很多IDE和轻量编辑器,唯有ST2用的最顺手。丰富的插件和快捷键加上轻量级简直让人爱不释手,而且也是无限试用,除了偶尔保存的时候会弹出购买窗口!70刀无折扣的单授权费用也确实感觉有点小贵。只好尝试去google一下有没有破解方法去掉弹窗!然后就找到了下面的破解工具,实测有效。

继续阅读 »

编码规范

Bootstrap创始人Mark Otto发布了Bootstrap编码规范,针对HTMl、CSS编码都有详细的总结、指导。发布之后迅速收获了2.5k star。这是前端开发者不能不研读的规范!
读完以后感觉很多部分也和之前自己的编码习惯相符,但确实感觉对编码规范的思路又清晰很多,所以保存下来。

原文地址:Code Guide by @mdo
中文翻译:编码规范 by @mdo