FED

今天浏览jQuery的deprecated列表，发现live()和die()在里面了，赶紧看了一下，发现从jQuery1.7开始，jQuery引入了全新的事件绑定机制，on()和off()两个函数统一处理事件绑定。因为在此之前有bind(),live(),delegate()等方法来处理事件绑定，jQuery从性能优化以及方式统一方面考虑决定推出新的函数来统一事件绑定方法并且替换掉以前的方法。on(events,[selector],[data],fn)events:一个或多个用空格分隔的事件类型和可选的命名空间，如"click"或"keydown.myPlugin"。selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择器为null或省略，当它到达选定的元素，事件总是触发。data:当一个事件被触发时要传递event.data给事件处理函数。fn:该事件被触发时执行的函数。false值也可以做一个函数的简写，返回false。...

自动生成sprite的grunt插件https://www.npmjs.com/package/grunt-image-spriteconvertimagestoacssspriteimageThispluginrequiresGrunt....

1.echo输出命令...

那些总是拿webstorm的身材和其他文本编辑器来比较的筒子们，总是说webstorm的体积如何如何大，启动如何如何慢，性能如何如何差。来看看官网如何定义webstorm的：ThesmartestJavaScriptIDE...

在认识npm之前，你必须对nodejs有一定的了解。Node包管理器（NodePackageManager）。它是一个javascript的软件套件管理系统，预设环境为Node.js，从Node.js0.6.3版本开始，npm被自动附带在安装包中。npm运行在命令行下，并用于管理相依性套件，npm也允许使用者安装在npmregistry上的Node.js应用程序。npm由IsaacZ.Schlueter开发[1]，为了符合CommonJS的规范，如PHP之于(PEAR)、Perl之于(CPAN)，进而开发出npm。...

这次好好聊聊如何借助DevTools来进行前端的性能分析，这也是我找了很久，非常想了解的使用技巧！应该算是DevTools的进阶篇吧~记忆中倒是看到过有前辈写过这方面的文章，不过总是看的不够过瘾，一部分原因是因为可能当时对前端的了解并不够充分，还可能是因为那些文章省去了一些我觉得比较重要的知识点，导致读者看完以后并没能很好的顿悟！...

GoogleChrome浏览器提供了非常强大的JS调试工具，HeapProfiling便是其中一个。HeapProfiling可以记录当前的堆内存（heap）快照，并生成对象的描述文件，该描述文件给出了当时JS运行所用到的所有对象，以及这些对象所占用的内存大小、引用的层级关系等等。这些描述文件为内存泄漏的排查提供了非常有用的信息。注意：本文里的所有例子均基于GoogleChrome浏览器。...

在工作中，我们经常需要用到图标素材。你也许能搜到很多的图标资源网站，但要找到免费的高质量图标却很难，这就是为什么我今天要与大家分享这些优秀的免费质量图标搜索引擎，相信在这些网站你能找到你要的东西。如果你知道更多更好的网站，欢迎与我们分享！FindIcons...

chromedevtools中Elementspanel是审查dom元素和css的,可以实时修改dom/css.节点右键,如下图,可以:除了右键,还可以:...

这是一款集成了格式化（美化）html、css、js三种文件类型的插件。插件依赖于nodejs，因此需要事先安装nodejs，然后才可以正常运行。插件安装完成后，快捷键ctrl+shift+H完成当前文件的美化操作。插件对html、css文件的美化不是非常满意，但还可以，后面将说明如何修改css美化脚本，此为后话。...

在写代码的时候，尤其是写脚本，最需要注释了。目前脚本、样式的注释格式都有一个已经成文的约定规范（这些约定规范最初是YUICompressor制定的，详见参考资料）了，如下：其中说到这里说到的压缩工具有YUICompressor、GoogleClosureCompiler、gulp-uglify、grunt-contrib-uglify等，这些压缩工具都支持以上的压缩约定。常常把文件的关键信息放在第2种注释内容里，如文件名称、版本号、作者等。...

作为函数式编程来说，流程控制和函数库是必不可少的（应该吧）。下面我们介绍两个常用的库。lodash：完整的api请参阅，https://lodash.com/docs。这里我们只演示几个简单的例子。安装...

Nginx+Node.js+Java的软件栈部署实践关于前后端分享的思考，我们已经有五篇文章阐述思路与设计。本文介绍淘宝网收藏夹将Node.js引入传统技术栈的具体实践。淘宝网线上应用的传统软件栈结构为Nginx+Velocity+Java，即：...

基于前后端分离的多终端适配近年来各站点基于Web的多终端适配进行得如火如荼，行业间也发展出依赖各种技术的解决方案。有如基于浏览器原生CSS3MediaQuery的响应式设计、基于云端智能重排的「云适配」方案等。本文则主要探讨在前后端分离基础下的多终端适配方案。关于前后端分离...

前后端分离模式下的安全解决方案在前后端分离的开发模式中，从开发的角色和职能上来讲，一个最明显的变化就是：以往传统中，只负责浏览器环境中开发的前端同学，需要涉猎到服务端层面，编写服务端代码。而摆在面前的一个基础性问题就是如何保障Web安全？本文就在前后端分离模式的架构下，针对前端在Web开发中，所遇到的安全问题以及应对措施和注意事项，并提出解决方案。...

使用Node做前后端分离的开发模式带来了一些性能及开发流程上的优势(见《前后端分离的思考与实践一》),但同时也面临不少挑战。在淘宝复杂的业务及技术架构下，后端必须依赖Java搭建基础架构，同时提供相关业务接口供前端使用。Node在整个环境中最重要的工作之一就是代理这些业务接口，以方便前端(Node端和浏览器端)整合数据做页面渲染。如何做好代理工作，使得前后端开发分离之后，仍然可以在流程上无缝衔接，是我们需要考虑的问题。本文将就该问题做相关探讨，并提出解决方案。...

基于前后端分离的模版探索在做前后端分离时，第一个关注到的问题就是渲染，也就是View这个层面的工作。在传统的开发模式中，浏览器端与服务器端是由不同的前后端两个团队开发，但是模版却又在这两者中间的模糊地带。因此模版上面总不可避免的越来越多复杂逻辑，最终难以维护。而我们选择了NodeJS，作为一个前后端的中间层。试图藉由NodeJS，来疏理View层面的工作。...

为了解决传统Web开发模式带来的各种问题，我们进行了许多尝试，但由于前/后端的物理鸿沟，尝试的方案都大同小异。痛定思痛，今天我们重新思考了“前后端”的定义，引入前端同学都熟悉的NodeJS，试图探索一条全新的前后端分离模式。随着不同终端(Pad/Mobile/PC)的兴起，对开发人员的要求越来越高，纯浏览器端的响应式已经不能满足用户体验的高要求，我们往往需要针对不同的终端开发定制的版本。为了提升开发效率，前后端分离的需求越来越被重视，后端负责业务/数据接口，前端负责展现/交互逻辑，同一份数据接口，我们可以定制开发多个版本。...

如果你能把所有代码写进一个文件，并且能很好的管理、协调、多人开发。那么可以跳过这期（请务必带我飞）。我们接着完善上期的代码，给代码分家。node并没有启动入口，更没有固定的项目结构，文件配置。这些全部要靠自己动手，靠约定，正所谓约定由于配置。因为作者书读的少，只会MVC结构，姑且按照MVC结构来分。...

YUICompressor是来自雅虎（Yahoo）前端技术团队研发的一种压缩CSS、JS的技术。这种技术不是简单的去除空格和换行符，尤其是在javascript里尤为明显，它是把同名函数替换为简单的函数名比如“a、b、c、d”等，这种压缩后的代码不具有可读性，但对资源的加载很重要，因为它很可观的减小了资源的体积。比如jquery官方的jquery1.9.1版本，原始体积为271KB，压缩后的体积为104KB。...