前端利器 Gulp 介绍

Gulp是一个优秀的开源项目构建工具,它的核心在于流式操作和足够简单的API,这使得它使用非常广泛。本文介绍Gulp的基本使用及其API,并介绍几个我觉得很有用的插件。之后,我会介绍Gulp的内部原理及如何编写一个简单的Gulp插件。先来看一个简单的Gulp配置文件,领略一下基于流式操作的简洁。

阅读更多

谈谈 ES7 中的装饰器

前端发展的速度真的是太快了,ES2015(ES6)刚出来一大波特性,下一代的 ES7 又推出更多方便的特性。但是仔细看一下,会发现,JS的语法越来越在向 Python 靠拢了,ES7 中将出现的 decorator 就是其中的一个特性。

阅读更多

Chrome 性能调优简介

前端产品直接影响用户的体验,而用户体验上,操作的流畅性对其有着至关重要的影响。也许在PC上我们还感觉不出来强烈的卡顿,但是随着前端移动端的发展,Web 性能问题在移动端得到了急剧放大。什么才是真正的流畅呢?目前来说,与设备刷新频率保持一致,即 60fps 才可以说是真正的操作很流畅。这也是为什么大部分移动端 App 产品会选择使用原生的开发语言而非 H5 开发的一个重要原因。要知道,相对于 H5 开发,原生开发的代价高、开发效率低,而且很难做到App出了问题立马就能更新到用户端。所以,我们需要对我们的前端产品进行优化,尽量达到 60fps 的帧率,也就是说每一帧的运行时间最好不要超过 16ms。

阅读更多

618 活动开发总结

本周一直在忙公司的活动项目,没有太多时间看一些额外的东西。总结一下近期公司 618 大促项目开发过程的一些笔记吧。

阅读更多

拥抱 ES6

ES6有很多新的特性,让我们的代码更加简洁方便,下面是一些我觉得会很常用的特性:

阅读更多

基于 generator 的回调解决方案

前端一般都不会对JavaScript中的异步回调这个概念感到陌生,对Callback Hell这个名词更是再熟悉不过。为了实现异步的效果,我们只能通过传入回调函数进行后续的操作,而一旦出现各操作依次依赖,就会出现Callback Hell,具体而言,如下:

阅读更多

jQuery 源码分析

注:以下内容为之前积累的 jQuery 源码分析笔记,同步到博客上以作备份。

阅读更多

HTML5 Canvas

画布是H5中一个重要的概念,它面向开发人员提供了非常底层的绘图接口,使得绘制速度可以大幅提高,这对游戏等领域极为重要。

阅读更多

异步处理async包介绍

之前提到过Promise这个概念,本质上是为了避免JS层层异步回调造成的代码难以理解的问题,将异步本身包装在Promise的实现中,从而写出近乎同步版本的异步式代码。不过,Promise只能看作是一个编程的范式,具体怎么做还是需要我们自己操刀。本文介绍一个非常实用的异步处理的库async,它封装的方法极度地简化了常见的一些异步操作(例如:串行有依赖关系的异步操作,或者限制用Node模拟客户端发异步请求的数量等操作)。

阅读更多

JavaScript 模块化

在早期的前端开发中,JS所做的事情很少,只是辅助服务器进行验证等,并不涉及到太多太复杂的逻辑,所以把所有逻辑写到一个单文件是很直观的想法。但随着前端开发的不断发展,前端已经告别了当初刀耕火种的年代,单文件的前端开发逐渐凸显出其弊端。类似于C语言的include等把各模块组装起来的方法在JS开发中也渐渐流行起来。

阅读更多