hacke2 / hacke2.github.io Goto Github PK

View Code? Open in Web Editor NEW

520.0 71.0 178.0 42.17 MB

我的前端博客

Home Page: www.hacke2.cn

License: MIT License

Ruby 0.08% JavaScript 71.39% HTML 12.66% CSS 14.26% PHP 0.01% Less 1.60%

hacke2.github.io's Introduction

个人前端博客

点此访问 www.hacke2.cn

本博客是基于hpstr jekyll而搭建的个人博客，在原有强大的功能上，做了如下修改：

将google cdn换成 baidu cdn 原因你懂的
去掉分享到twitter、facebook等国外社区，加入百度分享
加入百度站长助手，方便您的统计
disqus评论
Read More功能，不想像以前一样文章全显示出来

如果您想快速搭建和我一样属于自己的博客系统，请参阅：

30秒创建Github Page

目前待优化事项：

合并资源（JS,CSS）

hacke2.github.io's People

Contributors

Stargazers

Watchers

Forkers

guojianlan xinjian0728 lcat zhouhui2014 ocsen softwareengineerss zhaofeng555 edagarli mzw11112008 bluetomlee niezhic henryzp xiaoxie110 bupttl codenote wanglingxiao23 shiyingxyl fe-ninja lixuejiang sqqihao lmbang-sam crazyk- maoshuyu andforce gallatnt lhuaiy 18810939946 yanwanpeng1990 jarvisxiong ytyeie happytrio zhouguoqing917 intter jincdream inqiu double2014 cos2004 cvexva maxwelldu loopwang hellojcy xiaoxiaojiok knowno kangning1206 shenfusheng aidenzou ql91 zhm8932 yeliping wukuili lycuit lingtal-fork songyibiao ning1022 miaowhui wangshengfei murongzi garfielder007 jacezq leebivip bensonwu97 zejia timmgit hudaoyou alenwon kurokoz qunintus geekyouyou ilovegeek woshidaxiong renshuai fanshipkwan marszhujin salansun novocane yanjing19 x3hong wangwu50 lvxiaomu hh1017 dawncc linqiaqia0622 zengxiangliang wangxiaoli-st 1146937621 imaemo citrusjunoss fuyingying0127 tinghuanwang ryanwangg 407390911 tomikes wuwenzhou arsenal1447 5265liu windysay monork yangnuowei88 zhugehanxin coderqiang233

hacke2.github.io's Issues

技术类

http://blog.jobbole.com/51586/
自动化任务运行器 Grunt 迅速上手

http://www.cnblogs.com/jsoo/archive/2011/08/03/2126035.html
动态加载javascript和css

http://blogread.cn/it/article/6487?f=wb
IoC/DIP其实是一种管理**

https://github.com/hacke2/technode-tutorial
socket.io and angular.js教学文章

http://cssha.com/open-window-in-chrome/
如何绕过chrome的弹窗拦截机制

http://blogread.cn/it/article/6478?f=wb
Js事件监听封装（支持匿名函数）

http://www.cnblogs.com/hustskyking/p/principle-of-javascript-template.html
JavaScript模板引擎原理，几行代码的事儿

http://www.cnblogs.com/zaohe/archive/2013/04/02/2996441.html
JS模板实现

http://www.html5cn.org/article-6043-1.html
20行Javascript代码写出页面模板引擎

http://www.cnblogs.com/hustskyking/p/javascript-semantization.html
如何让你的JavaScript代码更加语义化

http://www.cnblogs.com/hustskyking/p/javascript-asynchronous-programming.html
JavaScript异步编程原理

http://blog.jobbole.com/77748/
大型网站系统架构的演化

http://www.cnblogs.com/QLeelulu/archive/2011/08/28/2156402.html
作为Web开发人员，我为什么喜欢Google Chrome浏览器

http://blog.jobbole.com/73031/
用 Express 和 AbsurdJS 做 Node.js 应用

http://www.docin.com/p-640431287.html
认识process.nextTick()函数

http://blog.csdn.net/sagomilk/article/details/20800543
1分钟写完爬虫拿亚马逊商品数据

http://cnodejs.org/topic/512d8172df9e9fcc58333c73
Express+Nodejs 下的登录拦截实现

http://www.cnblogs.com/fullhouse/archive/2011/07/18/2109938.html
NodeJS框架Express的模板视图机制

http://www.cnblogs.com/sysu-blackbear/p/3463475.html
Git常用命令

xufei/blog#3
从HTML Components的衰落看Web Components的危机

http://msdn.microsoft.com/en-us/library/ms531079(v=vs.85).aspx
Introduction to DHTML Behaviors

http://www.cnblogs.com/sky000/archive/2010/10/14/1851262.html
onmouseetner和onmuseleave

http://www.w3cfuns.com/article-1306-1.html
想学习超流行的响应式设计？来看看这篇教程

http://www.cnblogs.com/samwu/archive/2013/06/06/3121649.html
Zepto 使用中的一些注意点(转)

http://www.cnblogs.com/vagerent/archive/2010/02/05/1664450.html
利用Jquery实现http长连接(LongPoll)

http://www.ibm.com/developerworks/cn/web/wa-lo-comet/
Comet：基于 HTTP 长连接的“服务器推”技术

http://www.html5cn.org/article-6043-1.html
20行Javascript代码写出页面模板引擎

http://www.codeceo.com/article/tcp-transform.html
TCP连接——爱的传声筒

http://www.cnblogs.com/jsoo/archive/2011/08/03/2126035.html
动态加载javascript和css

http://weixiaolu.iteye.com/blog/1479656
Java NIO原理图文分析及代码实现

http://bbs.html5cn.org/thread-80950-1-1.html
解决setInterval计时器不准的问题

http://www.codeceo.com/article/tcp-diffcult.html
TCP协议要点和难点全解

http://blog.jobbole.com/52857/
AngularJS 中的一些坑

http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html
jQuery的deferred对象详解

http://www.cnblogs.com/snandy/archive/2012/12/19/2812935.html
读jQuery之二十（Deferred对象）

http://blogread.cn/it/article/6506?f=wb
javascript函数的throttle和debounce

http://www.cnblogs.com/gaochundong/p/string_matching.html
字符串匹配算法

http://www.cnblogs.com/zhuifeng/p/4008058.html
URL详解

http://isux.tencent.com/ps-photoshop-cc-fd.html
Photoshop CC 与前端那些事

http://blog.jobbole.com/53487/
JavaScript 跨域总结与解决办法

http://blog.jobbole.com/53736/
为什么我要用 Node.js? 案例逐一介绍

https://developer.mozilla.org/en/docs/Rich-Text_Editing_in_Mozilla#userconsent#
Rich-Text Editing in Mozilla

http://blog.jobbole.com/55067/
编写更好的CSS代码

http://www.cnblogs.com/fengzekun/p/3940918.html
javascript parseJSON

http://www.ymk8.com/Item/Show.asp?m=1&d=1381
各浏览器Iframe对contentWindow、contentDocument、document及frames属性测试

http://www.jackyrao.com/archives/383
非CMD模块的javascript文件兼容封装方案

http://www.ruanyifeng.com/blog/2014/10/event-loop.html
JavaScript 运行机制详解：再谈Event Loop

http://www.codeceo.com/article/javascript-no-block.html
JavaScript无阻塞加载性能优化方案

http://bbs.html5cn.org/thread-80718-1-1.html
JavaScript与有限状态机

http://www.w3cplus.com/css3/introduction-into-css3-grid-layout.html
CSS3网格布局介绍——网格的运行

http://www.iefans.net/ie-css-bug-table/
打败ie的葵花宝典

http://www.cnblogs.com/jsoo/archive/2011/08/03/2126035.html
动态加载javascript和css

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_Precedence
js运算符规则

https://app.yinxiang.com/shard/s8/sh/b72fe246-a89d-434b-85f0-a36420849b84/59bad790bdcf6b0a66b8b93d5eacbead
【朴灵评注】JavaScript 运行机制详解：再谈Event Loop

http://fe.meituan.com/webp.html
美团在webp方面的实践

http://blog.jobbole.com/77956/
函数式JavaScript（4）：函数柯里化

http://developer.51cto.com/art/201008/218335.htm
常见浏览器兼容性问题与解决方案

http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html
深入理解JavaScript系列

http://www.codeceo.com/article/javascript-bibao.html
Javascript闭包深入解析及实现方法

http://stackoverflow.com/questions/6274339/how-can-i-shuffle-an-array-in-javascript#userconsent#
数组乱序

http://www.cnblogs.com/zhuifeng/p/4008058.html
URL详解
小知识点解析

http://segmentfault.com/blog/laopopo/1190000000708417
使用Slip.js快速创建整屏滑动的手机网页

http://www.ruanyifeng.com/blog/2011/05/how_to_judge_the_existence_of_a_global_object_in_javascript.html
如何判断Javascript对象是否存在

http://www.cnblogs.com/editor/p/4007862.html
Javascript 俄罗斯方块游戏代码解释!

http://www.cnblogs.com/bigbrother1984/p/4010492.html
Sizzle选择器引擎介绍

http://www.zhihu.com/question/25842198
JS中的this 在不同的地方指向不一样，在哪些地方需要注意？

http://segmentfault.com/blog/scriptjava/1190000000692744
JavaScript拆分字符串时产生空字符的原因

http://www.cnblogs.com/Hcjer/p/4016041.html
创建你的第一个JavaScript库

http://bbs.html5cn.org/thread-80950-1-1.html
解决setInterval计时器不准的问题

https://github.com/evilcos/papers
历届 Papers

作品类

http://runjs.cn/detail/gbbzutwk#userconsent#
纯CSS3实现图片切换

http://www.phpthinking.com/thanks/love.htm
有人向给女朋友惊喜或者给女神表白吗？改改JS就可以了

http://www.cnblogs.com/sky000/archive/2012/02/23/2364536.html
又一个滑动效果

http://www.zhinengshe.com/works/3546/index.html
利用after和before制作提示框

资源类

http://blog.jobbole.com/77232/
一些帮助Web前端开发的Sublime Text包

https://github.com/hacke2/ResumeSample
程序员简历模板系列

http://www.gbtags.com/gb/share/3577.htm
超棒的HTML5/CSS3单页面响应式模板（支持Bootstrap

http://bbs.html5cn.org/thread-79794-1-1.html
15款最好的 jQuery Modal（模态窗口）插件

http://damoqiongqiu.iteye.com/blog/2010720
node-webkit：开发桌面+WEB混合型应用的神器

http://www.css88.com/doc/underscore/#compact
underscore API

http://www.admin10000.com/document/3811.html#userconsent#
那些用JavaScript写的操作系统

http://www.spritecow.com/#userconsent#
spritecow

http://www.ituring.com.cn/article/775
Markdown语法

http://www.html5cn.org/article-6078-1.html
一个轻量级CSS3动画库：JX.Animate

http://tool.chinaz.com/js.aspx
JS混淆加密压缩

http://ecd.tencent.com/css3/tools.html
http://jeremyckahn.github.io/stylie/
css3动画在线制作器

http://webdesign.tutsplus.com/tutorials/how-to-create-css-animations-visually-with-stylie--cms-22161
相关介绍

http://www.colorzilla.com/gradient-editor/
css3渐变在线制作器

http://tool.css-js.com/#userconsent#
CSS, JavaScript 压缩, 美化, 加密, 解密

http://synergy-project.org/?hl=zh
Synergy 鼠标和键盘共享软件

http://gmu.baidu.com/demo/
百度移动框架

http://alloyteam.github.io/Spirit/
腾讯移动框架

http://www.html5cn.org/article-6278-1.html
为 Node.js 开发者准备的8本免费在线电子书

http://www.w3cplus.com/solution/css3content/css3content.html
http://www.zhangxinxu.com/wordpress/2010/04/css-content%E5%86%85%E5%AE%B9%E7%94%9F%E6%88%90%E6%8A%80%E6%9C%AF%E4%BB%A5%E5%8F%8A%E5%BA%94%E7%94%A8/
css3 content 生成内容

http://www.zhihu.com/question/22022905
css content 如何自定义生成图标？

http://blog.jobbole.com/49320/
十步图解CSS的position

知乎类

http://news.cnblogs.com/n/505390/
移动互联网创业者的三大误区

http://www.zhihu.com/question/22290503
如何评价煎蛋这样的网站？
创业中如何寻找一个创意亮点，或用户需求点。
http://pcottle.github.io/learnGitBranching
游戏学git

http://www.zhihu.com/question/25335819
如何找到跟对的老板，跟对企业？

http://www.zhihu.com/question/19867883
怎样正确做 Web 应用的压力测试？

http://www.zhihu.com/question/20003204
大型公司开发软件的流程是怎样的？

http://www.zhihu.com/question/25026687/answer/30486027
什么样的老师是好老师？应该怎么样做一个好老师？

http://www.zhihu.com/question/22426434/answer/21433867
还要多少年, 前端开发才能像客户端开发那样轻松？

http://www.zhihu.com/question/20398616
人为什么要很努力地工作？

http://www.zhihu.com/question/22614212
为什么现在很多年轻人愿意到北上广深打拼，即使过得异常艰苦，远离亲人，仍然义无反顾

http://www.zhihu.com/question/25112568
冒泡排序为什么会被看做经典，写入所有C语言的教科书？

http://www.zhihu.com/question/25433595
如何跟外国人解释为何**人不用 Facebook？

http://www.zhihu.com/question/25500292
女生适合IT行业吗or跨专业考研？

http://www.zhihu.com/question/22951927
本科生如何系统地学习前端开发

http://www.zhihu.com/question/25836091
拿到口头的offer，一般公司会变卦吗？

http://www.zhihu.com/question/25842198
JS中的this 在不同的地方指向不一样，在哪些地方需要注意？

http://www.zhihu.com/question/20260762
有哪些 JS 调试技巧？

http://www.zhihu.com/question/25749900
都说学习 Photoshop 要学习其中的原理，那么 Photoshop 工具的原理在哪学习？

http://www.zhihu.com/question/25583089
设计师这样的工作，可以做一辈子吗？

http://www.zhihu.com/question/19813278
**变成一个拼爹拼关系的社会了吗？

http://www.zhihu.com/question/19588629
一名合格的前端工程师的知识结构是怎样的？

http://segmentfault.com/blog/colin4124/1190000000373243
[译] 如何恰当地学习 JavaScript

http://www.zhihu.com/question/25583350
百度腾讯offer比较(腾讯游戏VS百度基础架构)？

http://segmentfault.com/q/1010000000628530
请问这些javascript表达式的结果是？为什么？

http://segmentfault.com/a/1190000000338382
前端开发知识结构

http://segmentfault.com/q/1010000000382769
github上有什么好的项目能够帮助新人理解javascript吗?

http://www.cnblogs.com/vamei/archive/2012/11/17/2774208.html
为什么要写技术博

http://blogread.cn/it/article/6493?f=wb
如何设计一个优秀的API

http://get.jobdeer.com/1612.get
程序员如何正确的评估自己的薪资

http://www.zhihu.com/question/23659600
如何看待神马搜索?

http://www.zhihu.com/question/19563138
最好的产品经理社区或者讨论圈有哪几个？

文章类

http://www.watchmen.cn/portal.php?mod=view&aid=273
普通开发者如何拿到国内IT巨头的Offer

http://blogread.cn/it/article/6461?f=wb
腾讯敏捷开发及快速迭代

http://blog.dandyweng.com/2013/07/how-my-website-was-created/#userconsent#
我的个人网站是怎么做出来的

http://www.itmian4.com/
IT面试网

http://barretlee.github.io/learning-in-front-end/#userconsent#
前端学习的那些往事

http://blogread.cn/it/article/6485?f=wb
一些做产品的项目经验：立项、流程、文档

http://blogread.cn/it/article/6496?f=wb
中间件和稳定性平台

http://www.cnblogs.com/leefreeman/p/3998757.html
大型网站的灵魂——性能

http://www.cnblogs.com/levenyes/p/4003681.html
人生苦短，我用python——当我在玩python的时候我玩些什么

http://segmentfault.com/blog/devlevelup/1190000000702013
国庆荐书：技术人必读的人文书

http://www.itbbu.com/762.html
腾讯走上王者之位，你以为靠的只是抄袭？

http://blog.jobbole.com/45296/
老码农教你学英语

http://www.codeceo.com/article/10-common-mistakes-programmer-interview.html
程序员准备面试时常犯的10个错误

http://www.imooc.com/wenda/detail/209520
前端开发人员必备的5款开发工具

http://www.jacopretorius.net/2013/07/angularjs-pain-points.html
AngularJS Pain Points

http://segmentfault.com/blog/justjavac/1190000000329966
[福利] 免费的编程中文书籍索引 (不定期更新)

https://github.com/search?utf8=%E2%9C%93&q=awesome
git好资源

http://news.html5tricks.com/10-years-for-technology.html
一名程序员十年技术之路的思考与感悟

AngularJS
http://blog.jobbole.com/77833/
Web 开发在 2015 年及未来的发展趋势

http://www.cnblogs.com/Darren_code/archive/2011/06/29/javascript-learn.html
说说我的web前端之路,分享些前端的好书

http://www.codeceo.com/article/node-js-web-framework.html
如何选择Node.js Web开发框架？

http://www.codeceo.com/article/10-common-mistakes-programmer-interview.html
程序员准备面试时常犯的10个错误

https://ruby-china.org/topics/21831
《Linux 命令行》中文版 PDF 上线了

http://codepen.io/patterns/
Design Patterns

http://www.cnblogs.com/shenyisyn/
沈大侠的失业的程序员，马上就要第二版了，有兴趣的关注一下。

http://www.cnblogs.com/wangfupeng1988/p/4001284.html
【深入理解javascript原型和闭包系列】历时半月完稿，求推荐

http://www.kuqin.com/shuoit/20140503/339604.html
「阿里校友」—从阿里巴巴走出的创业牛人们

http://www.zhihu.com/question/20289254
http://www.cnblogs.com/hustskyking/p/history-api-in-html5.html
http://www.welefen.com/pjax-for-ajax-and-pushstate.html
pjax：ajax和pushState结合的js库

http://item.jd.com/11055746.html
精益创业

http://item.jd.com/11355294.html
创新者的窘境

http://www.forbeschina.com/news/news.php?id=36967
周鸿祎推荐：十大商业经典图书

http://news.cnblogs.com/n/505279/
创业教父箴言：创业之前

http://news.cnblogs.com/n/505550/
当老板不是创业的好理由

http://www.cnblogs.com/mehale/p/4015519.html
从事IT业一个8年老兵转行前的自我总结1——初爻

第二章 Js概览

基于GoogleV8引擎

Object.keys(o)
数组方法：遍历forEach、过滤filter、改变map
实现了String.prototype.trim()
含有JSON解析

第三章阻塞与非阻塞IO

单线程注意点

小心处理内存中的变量，可能会影响两次访问的结果
不要编写阻塞式代码，可能会影响第二次访问的时间

事件轮训

先注册事件
不断询问这些事件是否已经分发dispatch
当事件分发了，相应的回调就会被触发
如果事件未触发，则继续执行其他代码
捕获未来才会执行到的函数所抛出的异常是不可能的
避免同步IO

第四章 Nodez中的Javascript

global对象

对应于浏览器window

process对象

process.nextTick == serTimeout(fn,1)

模块

require module exports
NPM
绝对模块指Node内置模块以及在node_modules模块require(‘fs’)
相对模块指通过相对路径找的模块require(‘./module’)
暴漏数据exports.a(多个)、重写module.exports(一个)

事件

EventEmitter
事件监听 on，事件分发emit，事件移除removeListener
只执行一次once
data事件数据是部分到达，而不是一次性全到达返回给你

buffer

处理二进制数据

第五章CLI &FS API

Stream

stdin 可读流 stdout/stderr可写流
stdin.resume 等待用户输入
console == process.stdout.write(str + ‘\n’)

fs

readdirSync(__dirname) readFileSync同步
readdir(‘.’, async) readFile 异步
createReadSteam 读取可变大小有data、end事件多用于图片、大型文件等
watchFile监视文件是否改变

process

process.argv 运行的参数
process.cwd 获取当前工作目录
process.env 环境变量
process.exit退出
信号量

第六章TCP

TCP

面向连接，基于IP协议
IP协议发包无序，TCP给发送的IP包含了标示符和数据流顺序信息
面向字节对字符以及字符编码完全无知，很好的灵活性
可靠性三次握手、窗口时间重发
流控制，对接收和发送的速度控制
拥堵控制避免拥堵、数包报的延迟率和丢包率不会太高

Telnet

当不是telnet协议是自动降级为TCP
发送GET /HTTP/1.1模拟浏览器请求，两次回车

net

Node.js核心TCP模块
data close end事件
conn.setEncoding(‘utf-8’) 或 Buffer.toString(‘utf-8’)
服务端createServer 客户端connect方法 connect事件

第七章HTTP

HTTP

TCP上层协议
Content-Type类型文本、HTML、XML、JSON、PNG
Transfer-Encoding: chunked 输出的内容长度不能确定，Node天生的异步机制，这样相应可以逐形成
301 永久转移 302 临时转移 304资源未改变 403未授权 404资源未找到
表单Content-Type application/x-www-form-unencoded

http 模块

request、response 参数
判断路由为method+url
querystring模块将字符串解析成对象
request方法模拟一个请求，传回来的数据2进制，设置utf-8
superagent 模拟客户端（模拟一个请求）模块
up 重启服务器模块

第八章Connect

工具集&中间件

模块:connect
中间件调用server.user(...)
日志中间件console.log(‘%s %s ’, req.method, req.url)
模拟请求时间过长中间件，在res.end是清除定时器
static中间件处理静态文件connect.static(‘..’)
query中间件获取查询字符串connect.query
logger 中间件connect.logger(‘dev’)
body parser中间件connect.bodyParser()如果在POST使用了JSON格式，body parser自动转JSON对象，还可以处理用户上传文件req.body.file多文件表单name 使用name=”file[]”
seesion中间件会话connect.session 使用方法req.session.user
redis session 会话持久化中间件
methodOverride 中间件让低版本浏览器支持PUT、DELETE、PATCH
basicAuth中间件用户身份验证

第九章EXPRESS

express

WEB应用开发框架，基于Connect
app.set(‘view engine’, ‘ejs’) 设置EJS模板引擎
app.set(‘view’, __dirname + ‘/view’) 设置视图层路径
app.set(‘view cache’, ‘true) 设置模板缓存
使用app.get()、app.put()、app.post()配置路由，可传参数如:id，获取req.params.id
res.render(‘search’，obj) 渲染模板
其他设置大小写敏感、严格路由、jsonp回调
为res和req提供了快捷方法 render渲染、redirect重定向req.header检查头信息
中间件 app.user(function(req, res, next){})
代码组织分层、分包、MVC，建议仿照Spring MVC

模板引擎

Express/Haml/Jade/CoffeeKup/JQuery Templates for node

第十章WebSocket

Ajax

异步javascripy
缺陷；每次都建立HTTP请求，消耗网络资源，不适于实时服务
HTML5 WebSocket
基于ws协议
node支持:websocket.io
客户端new WebSocket

缺陷

关闭不意味着断开，使用心跳检测机制判断
对JSON支持不够友好
客户端临时断开无法解决使用定时器或者刷新页面？
兼容性

第十一章Socket.io

优势

跨浏览器，支持WebSocket则原生，不支持使用长连接方式,连接会持续打开 20-50s
即使浏览器支持的WebSocket被代理或者防火墙禁止了，Socket.io仍然会通过其他技术来解决
如果客户端停止传输信息，并且一定时间没有正常的关闭，则认为连接已经断开
当连接丢失时，自动重连
对逻辑进行分层，有命名空间
支持emit分发和listen监听事件

第十二章MongoDB

MongoDB

面向文档，绝大多数情况是JSON
连接 new mongodb.Server(‘127.0.0.1’, 27017)
API open insert find ensureIndex findOne
$set 设置 $push 推入数组

Mongoose

类似于JAVA中ORM框架，简化数据库开发
连接mongoose.connect(‘mongodb://localhost/database’)
Schema：一种以文件形式存储的数据库模型骨架，不具备数据库的操作能力
Model: 由Schema发布生成的模型，具有抽象属性和行为的数据库操作对
Entity:由Model创建的实体，他的操作也会影响数据库
index 索引 title : {type : String, index : true} unique : true 唯一
new Schema({}).pre(‘save’, function(){})保存之前做一些处理
常用API find,findOne,remove,update,count
new Schema({}).find({_id:‘xx’}).where(‘title’,‘xxx’).sort(‘content’, -1).limit(5).run(function(err, data){}) 类似JQ查询
.select(‘_id’, ‘name’)选择查询指定字段
.skip 跳过 mongoose.Schema.ObjectId 生成随机ID
clazz : [Clazz] 嵌套的Sehema
clazz: {type : ObjectId , ref: ‘Clazz’} 关联查询
添加静态PersonSchema.statics.findByName通过model调用
添加实例方法 PersonSchema.methods.findSimilarTypes Entity调用

第十三章MySQL

MySQL

主要使用query执行SQL
有占位符 ? 插入数据（和JAVA一样）
使用seqelize Node版ORM框架

第十四章Redis

Redis

应用场景：简单数据模型、数据集。适合存储在内存
seesion持久化

第十五章代码共享

书写兼容性代码

导出模块，前端后端都可使用

(function(module){
module.exports = function(a, b ){
return a+b;
}
If(‘undefined’ != typeof window) {
Window.add = module.exports;
}
})(‘undefined’ == typeof module ? {module : {exports : {}}}: module)

模拟实现ECMA:扩展原型或者实现工具函数
EventEmitter。Assert、XMLHttpRequest、DOM、WebSocket、node-canvas都在 git上有实现
bowserbuild 将node模块转为浏览器可识别的代码

第十六章测试

assert

常用API ok,be/equal/eql/a/macth...

Mocha

简化书写
测试异步代码
生成报告

神马&书旗前端委员会月刊 1505

神马&书旗前端委员会月刊1505 期来袭，大家在做业务的同时不要忘了提升自己的知识面与基础能力，努力将咱们前端委员会打造成国内移动第一前端：）

本期月刊对比往期有一下变化：

新增访谈模块
将其他改为干货
吐血推荐的文章后面有*标识

JS

用ES6重写《JavaScript Patterns》中的设计模式 *

新API让JS用设计模式如此无违和感

Object.observe() 引爆数据绑定革命 *

将会改变当今的MVC框架实现监听数据模型编辑、更新行为的方法

使用ES6进行开发的思考

对ES6各个特性得出是否适合应用的初步结论，并一一解释其使用场景。

Revealing the Inner Workings of JavaScript’s “this” Keyword

实例来对this用法的探讨

开发资源大集合 *

包含几十个主流语言的框架、库的集合，强烈大家看看扩充知识面！（包括php同学！）

全面解析ECMAScript 6模块系统

一个轻松显示大数据集的 JS 插件

附带小胡子哥的文章百万数据如何在前端快速流畅显示

理解Javascript_09_Function与Object *

这是一个系列，强烈推荐

Thunk 函数的含义和用法

本文是《深入掌握 ECMAScript 6 异步编程》系列文章的第二篇。

co 函数库的含义和用法 *

阮老师新作，co 函数库是著名程序员 TJ Holowaychuk 于2013年6月发布的一个小工具，用于 Generator 函数的自动执行。

async 函数的含义和用法

异步编程的最高境界，就是根本不用关心它是不是异步。async 函数就是隧道尽头的亮光，很多人认为它是异步操作的终极解决方案。

强大的observejs

利用Object.defineProperty,以及内建 “__属性名” 来保存真正的 ”属性名” 的值来实现监听任意对象的任意数据变化。

Ten ways to reverse a string in JavaScript

十种JS反转字符串方式

[ 前端框架 ] 前端 MV*框架的意义 *

ECMAScript 6中除类之外的OOP新特性

ES6 In Depth Articles
深入解读ES6文章

盘点JavaScript里好用的原生API

MVC vs MVP vs MVVM *

相见恨晚，吐血推荐！

HTML5

MobileWeb 适配总结 *

神马使用的“固定高度，宽度自适应”，其他方法可以调研一下

移动端尺寸基础知识

从原理说起，理清关于尺寸的所有细节

神奇的第三维度

天猫互动前端的《3D互动游戏实践》棒棒哒，看豪车移动端虚拟现实联想到之前的3D美女实景图

simple-mvvm

分享会演示的代码，30 分钟写个 Angular.js

Zorro *

勾三股四的一套基于webcomponents的类似于boobytrap的组件

googlewebcomponents.github.io

google在webcomponents的实践

CSS

最新CSS4选择器前瞻

前端性能优化（CSS动画篇）

CSS硬件加速的好与坏 *

Topic

Node

Express 指南 *

皇帝的新衣：Node.js

给node.js泼了一盆凉水

配置Nginx SSL Node.js环境详细指南

是在不同的操作系统下配置Nginx和SSL，并且搭建一个Node.js运行环境

node.js在qzone的演进

QQ空间在Node.js的事件

[译] NodeJS 错误处理最佳实践

THE CORE CONCEPTS OF ANGULAR 2

ANGULAR核心**揭秘

Node.js 框架比较: Express vs. Koa vs. Hapi *

Node.js 自动猜单词程序的实现

动效

WWDC2015 CSS Animation *

WWDC2015邀请函中的动画效果，纯CSS，很酷！

双11喵喵舞MV

做的高大上的骨骼动画《双11喵喵舞MV》纯JS实现，每个人物角色舞蹈动作都可以随意编码，非传统帧动画，后了解用hilojs实现

设计师10大必备HTML动画工具

经验分享：多屏复杂动画CSS技巧三则

腾讯做复杂动画的经验之谈

分层渲染和动画性能优化

css动画制作器

css3模态弹框

工程化

《Gulp入门指南》

gulp 是基于 node 实现 Web 前端自动化开发的工具，利用它能够极大的提高开发效率。

React.js

React Native概述：背景、规划和风险

A UNIVERSAL IOS APP WITH REACT NATIVE

多终端适配的解决方案

干货

DevTools-Learning

前端开发者工具学习资料大全

现代浏览器的工作原理 *

对浏览器解析原理讲的很透彻（齐飞提供）

Visual Studio Code 的简单试用体验

微软放大招了, 可代替Sublime，编写的 js 被解释执行，从运行环境中找到补全

WebKit是如何工作的？

十张图让你了解浏览器解析原理

美女3D全景图

宅男福利

阿里巴巴集团官方移动测试服务

叮！传说中的重量级测试工具来啦！阿里巴巴集团官方移动测试服务免费开放：种类繁多的机型适配、深度BUG精准定位、性能数据完美收集，不论是app还是H5，全都通通搞定。

聊聊移动端跨平台开发的各种技术

信息量巨大，强烈推荐!

干货：Web应用上线之前程序员应该了解的技术细节

影响网页渲染的关键！

加快网站访问的思路

免费电子书阅读

hare and discover the best programming tutorials and courses online. *

各类编程资源大集合，强烈推荐！

一个程序员用 JavaScript 做的 GBA 模拟器

很好玩~~~~~~

十年磨一剑：梳理淘宝网技术架构的发展

如何在 StackOverflow 上谈笑风生

访谈 *

不走管理，也能成为前端专家？ | 100offer专访贺师俊Hax

朴灵：打破限制，从前端到全栈

去哪儿网前端架构师司徒正美：如何挑选适合的前端框架？

各主流行框架优劣点、适用场景盘点

-based

心智工具箱（12）：刻意练习

在成为牛人的道路上，没有人能否认练习的作用。但是一万小时定律有一些什么样的问题？原作者埃里克森（Ericsson）本意是什么？成人如何更好学习？

超越一万小时定律

如何习得专业技能，没有人能否认熟能生巧的意义。生性懒惰的我们，总是在寻找借口，试图回避练习。有一天，畅销书《异类》作者格拉德威尔(Gladwell)告诉你：“人们眼中的天才之所以卓越非凡，并非天资超人一等，而是付出了持续不断的努力。只要经过1万小时的锤炼，任何人都能从平凡变成超凡。” [^1]只要练习1万小时，就有了成为标准九的希望，无论天赋无论出身。你是不是怦然心动，屌丝的人生终于可以开始逆袭，立即购买作者的图书，并且报名参加各类1万小时练习小组。

然而，真相是，从来不存在一万小时定律，它仅仅是畅销书作家对心理科学研究一次不太严谨地演绎而已。一万小时定律的真实来龙去脉是什么？

让我们再次回到标准九西蒙那里。1973年，即将在1978年拿到诺贝尔奖的西蒙，与合作者Chase发表了一篇关于国际象棋大师与新手的比较论文。在这篇论文[^2]中，西蒙们发现，通过长期训练，虽然工作记忆容量相差不大，但是国际象棋大师，在摆盘、复盘等实验上都显著强于一级棋手、新手。其中，国际象棋大师、一级棋手、新手三类人能记忆的组块分别是：7.7、5.7与5.3。西蒙在文中首次提出专业技能习得的十年定律（10 year rule），西蒙推测，国际象棋大师能够在长时记忆系统中存储5到10万个棋局组块，获得这些专业知识大概需要10年。

这就是西蒙的十年定律。当时间来到1976年，一位瑞典心理学家移民美国，他就是埃里克森（Ericsson）[^3]。埃里克森参考西蒙论文的10年定律，两人在国际象棋领域的专业技能习得领域再次合作发表论文。[^4]随着西蒙老去，埃里克森在专业技能领域，积累的证据越来越多，1993年，发表论文[^5]，阐释他对一个音乐学院三组学生的研究结果。这就是被格拉德威尔引用，以致演绎出一万小时定律的实验：

把学院学习小提琴演奏的学生分成三个组。第一组是学生中的明星人物,具有成为世界级小提琴演奏家的潜力,第二组的学生只被大家认为“比较优秀”,第三组学生的小提琴演奏水平被认为永远不可能达到专业水准,他们将来的目标只是成为一名公立学校的音乐教师。….. 实际上,到20岁的时候,这些卓越的演奏者已经在他的生命中练习了10000个小时,与这些卓越者相比,那些比较优秀的学生练习的时间是8000个小时,而那些未来的音乐教师,他们的练习时间只有4000个小时。

有趣的是，格拉德威尔丝毫没有提及西蒙的贡献，是故意忽视还是真的没有读到？从论文标题到实际内容，埃里克森的研究报告强调的也仅仅是刻意练习（Deliberate Practice ）而已，而非一万小时这个魔术数字。心理科学史上从来不存在一个所谓的一万小时定律。以致埃里克森2012年10月在捍卫刻意练习观念时，提到格拉德威尔的演绎使得他的研究经常被当做稻草人在挨心理学界的批评，并且对格拉德威尔没有提及刻意练习，略有微词。

一万小时定律究竟有哪些问题呢？

首先，不同专业领域的技能习得时间与练习时间并不存在一个一万小时的最低阈值。如，优秀专业演员的专业技能习得往往是3500小时；记忆类专家技能的习得也并不是需要一万小时，而是数百小时。Hacker News读者们已经整理的证据表明，不少互联网公司创始人专业技能习得同样不是一万小时。
其次，成功与练习时间并不完全成正比，天赋在其中扮演重要作用。如心理学家平克指出，优秀科学家的平均智商在125以上。同样，1997年一篇研究报告表明，医生、律师、会计的智商多数位于标准七以上区间。一篇来自1990年的报告表明，非言语智商，能够解释少儿象棋成绩高低的12%。
最后，驳斥一万小时定律可以玩一个巧妙的**游戏，这就是哲学家Eubulides Miletus提出的沙堆悖论（Sorites paradox）：

1颗沙子不是堆，如果1颗沙子不是堆，那么，2颗沙子也不是堆；如果2颗沙子不是堆，那么，3颗沙子也不是堆；依次类推，如果9999颗沙子也不是堆；因此，1万颗沙子还不是堆。

“破解”沙堆悖论时，我们经常不得不设定一个固定的边界。如果我们说【一万颗沙粒是一堆沙】，那么少于一万颗沙粒组成的就不能称之为一堆沙。那么这样区分9999颗沙和10001颗沙就有点不合理。这样不得不设定一个可变的边界，但是这个边界是多少呢？我们现在并不知道。那么最初设定的那个【一万颗沙粒是一堆沙】作为知识的价值被削减。同样，在沙堆悖论的视野下，一万小时定律的价值也就这样被消解。正如真实的心理科学研究表明一样，成为专家的时间往往随着不同专业技能领域而变化。

刻意练习的本质

每位熟悉写作技巧的畅销书作者们，常常会用一个清晰的行动规则，如：练习一万小时成为标准九、二十一天养成好习惯等来激发你的行动。但是对于究竟有多少人能够坚持一万小时？一万小时是否真的导致成功？坚持一万小时的关键节点？一万小时练习的本质却置之不理。这些畅销书作者略过不谈的细节，却是科学着墨最多，也对人们提升自我最有帮助的地方。

事实上，埃里克森的刻意练习核心观点是，那些标准七区间以上的人们，拥有一种较强的记忆能力：【长时工作记忆】（Long-term working memory）。长时工作记忆正是区分标准七区间以上与标准五们的一个重要能力，它才是刻意练习的指向与本质。那些卓越的专家，能够将工作记忆与长时记忆对接起来，在进行钢琴、象棋等自身熟悉的专业活动时，能够调用更大容量的工作记忆。如同西蒙等1973年那篇开创性研究报告所指出的一样：国际象棋大师在长时记忆这款硬盘中存储了五万到十万个关于棋局的组块。

如果说标准八们，已将自己的大脑升级了，工作记忆内存条可以同时调用一块SSD硬盘来用；那些专业领域的新手们往往还是在使用小内存跑。

幸运的是，进化给标准五们留了条路。这种长时工作记忆能力，埃里克森认为是领域相关的，并且通过他所说的刻意练习，可以习得。只要你努力，砸锅卖血，做上苦力几十小时到成千上万小时不等，就能买来那款可以被工作记忆内存条调用与使唤的SSD硬盘——长时工作记忆。

标准五们怎样才能买得起那块硬盘？刻意练习的任务难度要适中（还记得昨晚写的人生标准九的文章吗？）、能收到反馈、有足够的次数重复练习、学习者能够纠正自己的错误。如此如此，必成大器。

其中，多数不靠谱的成功学在于选择了错误的练习方式，虽说喊的口号是刻意练习但实质不是刻意练习，因为没有激活长时工作记忆能力。比如，下象棋的次数毫无作用，十个一万小时，也成不了国手。但是，如果看着已经发表的棋谱，然后推测国手下法，这种刻意训练方式，就是往长时记忆硬盘里面攒SSD硬盘：存储关于象棋棋谱的组块。

【长时工作记忆】的培养要点主要有：

赋予意义，精细编码：标准八们能非常快地明白自己领域的单词与术语，在存储信息的时候，可以有意识地采取元认知的各项加工策略，参考心智工具箱（2）：元认知。
提取结构或模式：往往需要将专业领域的知识，提取结构或者模式，以更好地方式存储。比如，专家级别的开发者善用设计模式；
加快速度、增进链接：通过大量重复的刻意练习，编码与提取过程，专家比新手都快很多，增加长时记忆与工作记忆之间的各种通路。

所以，刻意练习的指向是去买SSD硬盘，而不是纯粹卖苦力，更不是帮畅销书作者们营销，喊喊热血口号：一万小时，今天，你坚持了吗？

隐知识

目前对刻意练习最大的批评是，埃里克森关于刻意练习的证据多在【认知复杂性】较低的活动，如象棋、钢琴、篮球、出租车驾驶、拼写。但是，对于【认知复杂性】较高的活动，如销售、管理等作用有限。怎样练习一万小时成为一名卓越销售与卓越CEO，从哪里练起？怎么练？练什么？认知复杂性高与认知复杂性低的学习活动很大程度上，差异在于隐形知识的多少与比重。隐形知识需要往情景中去寻。

仍然是西蒙，他认为人是【有限理性】，体现在学习中，就是【情境理性】。【在哪里用，就在哪里学。】人的学习受到情景制约或者促进。你要学习的东西将实际应用在什么情境中，那么你就应该在什么样的情境中学习这些东西。比如，你要学习编程，就应该在github里学习，因为你以后编程就是通过Github。再如，你要学习讨价还价的技巧，就应该在实际的销售场合学习，因为这一技巧最终是用在销售场合的。

刻意练习虽然并没有否认情景的重要性，但是在畅销书中，那些已经被学习科学证实的主流方式被放在一个不起眼的角落。与学习密切相关的隐形知识被忽略了。学习科学大量研究表明，成人的最佳学习方式并非独自练习，而是在情境中学习。有效学习是进入相关情景，找到自己的【学习共同体】，然后学习者刚开始围绕重要成员转，做一些外围的工作，随着技能增长，进入学习共同体圈子的核心，逐步做更重要的工作，最终成为专家。

这就是学习科学日益主流的观念：从【情景学习】出发，当一名【认知学徒】，它的要点有：

找到学习共同体：因为大量知识存在于学习共同体的实践中，不是书本中，所以有效的学习不是关门苦练，而是找到属于自己的学习小团体。如程序员在类似于github这样的网站练习编程。
隐性知识显性化：隐性知识是使人们有能力利用概念、事实以及程序来解决现实问题的知识。一般也称之为策略知识，具体培育方法参考前文【心智工具箱2：元认知】；
模仿榜样：榜样可以是现实生活中的导师，也可以是网上的导师；
培养多样性：在多种情境中实践，以此强调学习广阔的应用范围。如裁缝出师并不是已经练习了一万小时，而是能够缝制出足够好的，各种各样的衣服。

小结

图灵奖得主[Richard Hamming]谈到如何成为卓越，他认为练习时间并没有那么重要也无法精确无法明示，他写道：

在许多领域，通往卓越的道路不是精确计算时间的结果，而是模糊与含糊不清的。没有简单的模型成为伟大。

即使是格拉德威尔拿来当做一万小时定律例子的比尔盖茨也谦虚地谈到，

the 10000 hour rule helps.but to be achieved, it needs persistence and passing through a lot of cycles.

这或许才是西蒙的十年定律对我们真正的启发：耐心地、谦虚地保持大时间周期的刻意练习。

update：

国内流传【一万小时定律】与【Deliberate Practice 】，今晚整理一下反证，首先推荐我的【心智工具箱（12）：刻意练习】http://t.cn/zYyZvYr ；其次 @崔翔宇_采铜：【怎样成为高段位的学习者？（三）：操练】http://t.cn/8sjtkw9 ; 最后是反证文献1：http://t.cn/RvqxIq9 文献2：http://t.cn/RvqxIqo 文献3：http://t.cn/RvqxjIY

几个个人觉得不错的资料站点

Web前端高质量社区：div.io
各种方向的资源集合：toutiao.io
Android方面：hukai.me (性能优化)
android-arsenal.com/ (开源库)
fossdroid.com/ (开源库)
www.android-studio.org/ (Android studio中文社区)

暂时先发这些哈有看到好的我随时更新哈！！！

精彩博客集合

前端

UED

http://ued.sina.com/
新浪UED
http://ped.alipay.com/
支付宝PED
http://ued.alipay.com/
支付宝UED官方网站
http://mux.baidu.com/
百度MUX
http://www.baiduux.com/
百度泛用户体验
http://cdc.tencent.com/
腾讯CDC
http://wsd.tencent.com/
腾讯WSD用户体验设计团队
http://udc.weibo.com/
微博UDC
http://uedc.163.com/
网易用户体验设计中心
http://www.aliued.cn/
阿里巴巴（**站）用户体验设计部博客：
http://ued.taobao.com/blog/
淘宝网用户体验团队博客
http://cued.xunlei.com/
迅雷用户体验设计中心
http://ued.ctrip.com/blog/
携程UED

后端(JAVA)

http://cmsblogs.com/
陈明
http://blog.csdn.net/andycpp?viewmode=list
华丽的痘痘
http://blog.csdn.net/chaofanwei
星空
http://www.blogjava.net/youxia/
海边沫沫
http://www.cnblogs.com/xiekeli/
红心李
http://www.cnblogs.com/GoodHelper/
刘冬
http://www.cnblogs.com/zhenyulu/
吕振宇
http://terrylee.cnblogs.com/archive/2006/02/21/334911.html
TerryLee
http://www.cnblogs.com/wenhuisun/
天地不仁

设计

http://www.jing-ui.com/
静静的设计
http://www.raychase.net/
四火的唠叨
http://www.cnblogs.com/jenry/
bigwhiteshark（云飞扬）

管理

http://blog.csdn.net/column/details/prjmgmt.html
实战项目管理系列
http://blog.csdn.net/column/details/pattern.html
卡奴达摩
http://www.cnblogs.com/tianjinquan/
太空人

LINUX

http://blog.csdn.net/fengyily?viewmode=list
冯毅

算法

http://blog.csdn.net/column/details/algorithm-easyword.html
白话经典算法

友情链接

http://www.60sky.com/
撸壕

http://juntao.me/
涛哥

http://icaife.github.io/
蔡哥

viewport的一些外文资料

如果你确实已经熟悉在IOS上的viewport，请读“Using the Viewport Meta Tag”，会详细说明viewport，或者“Viewport Settings for Web Applications”,对于WEB应用的小技巧。否则秦都本章剩余章节。

读“Layout and Metrics on iPhone and iPod touch”学习怎么有效的在小屏幕上充分的利用屏幕宽度。
读“What Is the Viewport?”深入理解IOS上的viewport
读“Default Viewport Settings”和“Using the Viewport Meta Tag”去学习怎么使用viewport meta标签
读“Changing the Viewport Width and Height”和“How Safari Infers the Width, Height, and Initial Scale”如何更好的设置viewport来影响浏览器的渲染。
读“Viewport Settings for Web Applications”如果你设计移动网站。
读“Supported Meta Tags”看viewport meta的完整描述

神马&书旗前端委员会月刊 1504

神马&书旗前端委员会月刊 1504（首刊）

JS

开发无框架单页面应用 — 老码农的祖传秘方

一步步教你开发简单spa框架

promises简体书

见过的最完整的promise介绍

【前端优化之渲染优化】大屏android手机动画丢帧的背后

叶小钗对一个BUG的探究已经Chrome开发者工具Timeline的使用

浅谈从一道面试测试题谈谈对Nodejs编程的理解

做完这道题，对JS作用域、闭包加深理解

Generator 函数的含义与用法

阮老师新作，探讨ES6 较难理解的Generator

YOU MIGHT NOT NEED JQUERY

用原生方法替代JQ

前端要给力之：红绿灯大战中的火星生命-Promise

前端网红的代码之战总结

CSS

前端精选文摘：BFC 神奇背后的原理

见过的最容易懂得BFC文章，大量实例

回味background

我们最常用的CSS属性竟然会有这么多的学问

Web移动端Fixed布局的解决方案

你能相信吗？这些都是由一个DIV元素实现的动画，纯CSS3技术

一个DIV可以做很多事情，开开脑洞

加载 CSS 时不影响页面渲染

使用媒介查询小技巧懒加载CSS，可适用载外部CSS3字体

CSS3 Flexbox可视化指南

图文介绍，简单易懂

HTML5

你可能不知道的10个HTML5新功能

HTML5很多新API，比如电池接口API，还有可能会出的照相机API，语音API，能力向native靠近

移动端页面性能探究

那些年，我们一起被坑的H5音频

H5音频里的各种坑

Node.js

Web服务器的工作原理

前端同学急需填补的服务端支持

如何系统的学习Node.js

旅航弘树回答的

Web 开发后端缓存思路

WEB缓存的思考

node+express入门

使用最新版本的node+express，入门文章，快速搭建自己的第一个Node.js应用

从零开始nodejs系列文章

文章集合，强烈推荐

Node稳定性的研究心得

用node-inspector调试Node.js

工程化

How I build Node.js Applications

构建一个Node项目需要考虑的目录结构与职责

张云龙《前端工程》

SegmentFault D-Day 广州分享,张云龙介绍前端工程化

动效

9款非常有意思的HTML5动画推荐

增大脑洞

前端能力模型-动画类型及动画库的介绍

各个动画性能的总结和库的整理

用户体验中巧妙的过场动画【译

React.js

react native第一课

用JS写第一个自己的ios app

我对 React Native 的理解和看法

怎么更好的理解虚拟DOM? 1

怎么更好的理解虚拟DOM? 2

react初探

其他

Vim入门教程

关于前端开发的20篇文档与指南

精彩博客集合

2014年10月下前端资源分享

JS

http://www.webhek.com/ways-css-javascript-interact/
5种你未必知道的JavaScript和CSS交互的方法

http://html5online.com.cn/articles/2013032401.html
鼠标与触摸设备

http://www.zhangxinxu.com/study/201406/svg-animation-pandora-improve.html
SVG潘多拉图形动画效果demo

https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla
ECMAScript 6 New Support

http://www.laruence.com/2009/09/23/1089.html
深入理解JavaScript定时机制

http://swordair.com/javascript-minimum-time-interval/
JavaScript最小时间片

http://blogread.cn/it/article/6587?f=wb
谈谈页面停留时间

http://www.html-js.com/article/2328
React.js编程**

https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Obsolete_Pages/Obsolete_Pages/Obsolete_Pages/%E9%A0%90%E5%85%88%E5%AE%9A%E7%BE%A9%E7%9A%84%E5%87%BD%E6%95%B8/escape_%E5%92%8C_unescape_%E5%87%BD%E6%95%B8#userconsent#
escape 和 unescape 函數

http://www.ruanyifeng.com/blog/2009/09/find_element_s_position_using_javascript.html
用Javascript获取页面元素的位置

http://www.cnblogs.com/cloudgamer/archive/2009/01/06/1369979.html
JavaScript Tween算法及缓动效果

http://top.jobbole.com/15071/
JavaScript的诞生与死亡（双语字幕）

https://github.com/teambition/then.js/tree/master
thenjs JavaScript异步回调

http://www.html-js.com/article/A-day-to-learn-from-a-line-of-code-inside-the-JavaScript-study-JavaScript
从一行代码里面学点JavaScript

http://www.php100.com/html/program/html5/2013/0921/6218.html
HTML5 JavaScript实现图片文字识别与提取

http://blogread.cn/it/article/6642?f=wb
JavaScript 中的陷阱

http://www.cnblogs.com/xiyangbaixue/archive/2014/10/22/4042548.html
浏览器内核与js引擎

http://ued.taobao.org/blog/2014/04/xtpl/
基于前后端分离的模版探索

http://sentsin.com/web/253.html
使用Chrome开发工具调试Canvas

http://www.infoworld.com/article/2838008/javascript/nginx-has-big-plans-for-javascript.html
Nginx has big plans for JavaScript

http://www.oc35.com/uc_interview.html
JS抽奖

http://yanhaijing.com/basejs/
JavaScript简易教程

http://flaviusmatis.github.io/plugins/
Handpicked Javascript Plugins

http://jsbin.com/nowuk/1/edit?html
js常见方法集合

http://www.planabc.net/2008/02/20/javascript_new_function/
详解new function(){}和function(){}()

http://www.zhangxinxu.com/wordpress/2013/07/jquery-%E5%8E%9F%E7%90%86-%E6%9C%BA%E5%88%B6/#userconsent#
jQuery诞生记-原理与机制

https://github.com/barretlee/javascript-multiple-download
JS多文件下载

http://qianliwei.com/QFocus/index.html#
undefined的插件

CSS

http://www.zhangxinxu.com/wordpress/2011/09/cssom%E8%A7%86%E5%9B%BE%E6%A8%A1%E5%BC%8Fcssom-view-module%E7%9B%B8%E5%85%B3%E6%95%B4%E7%90%86%E4%B8%8E%E4%BB%8B%E7%BB%8D/#userconsent#
CSSOM视图模式(CSSOM View Module)相关整理

http://www.html5cn.org/article-6858-1.html
IE中的CSS3不完全兼容方案

http://www.html5tricks.com/demo/css3-responsive-paging/index.html#
纯CSS3响应式分页插件

http://www.cnblogs.com/2050/p/3409129.html
css3动画简介以及动画库animate.css的使用

http://www.w3cplus.com/css3/what-is-css-grid-layout.html
什么是网格布局

http://www.w3cplus.com/css3/how-to-enable-support-for-grid-layout-in-various-browsers.html
如何开启浏览器CSS Grid Layout功能

http://www.w3cplus.com/css3/line-base-placement-layout.html
网格单元格布局

http://www.w3cplus.com/content/css3-box-sizing
css3-box-sizing

http://wenku.it168.com/d_001336413.shtml
CSS进阶之路

http://bennettfeely.com/clippy/
clippy css图片样式工具

http://usablica.github.io/front-end-frameworks/compare.html
CSS FRONTEND FRAMEWORKS

http://responsive.vermilion.com/compare.php
响应式框架的比较

移动

http://www.chinaz.com/manage/2012/1128/283974.shtml
移动端webapp开发必备知识

http://www.cnblogs.com/sky000/archive/2013/03/29/2988952.html
zepto源码注释

http://www.imooc.com/learn/43
移动优先的跨终端 Web

http://www.zell-weekeat.com/support-for-older-browsers
如何创建支持低版本浏览器的响应式网站

kissyteam/kissy-mobile#3
触屏事件汇总

http://www.umindex.com/#userconsent#
友盟指数 - 设备指数以全新数据可视化方式呈现Android及iOS设备的相关数据

http://www.testwo.com/article/177
使用 chrome mobile emulation 来辅助 device 测试

http://wdm.taobao.com/pub2/publicos.htm
淘宝的无线数读，隔天更新，来自集团的90%app

http://5wilon.com/html/2014/shuji_0306/118.html
专访阿里前端工程师：淘宝移动Web开发那些事儿

http://demo.mobiscroll.com/select
https://github.com/fgnass/spin.js

http://code.google.com/p/mobiscroll/
安卓数字显示效果 spinner

http://www.zhangxinxu.com/wordpress/2012/10/html5-full-screen-api-firefox-chrome-difference/
HTML5全屏API在FireFox/Chrome中的显示差异

http://99jty.com/?p=1299
viewport双城记

http://www.zhangxinxu.com/wordpress/2012/10/new-pad-retina-devicepixelratio-css-page/
视网膜New iPad与普通分辨率iPad页面的兼容处理

实用

http://blog.jobbole.com/20604/
Vim 实用技术，第 1 部分: 实用技巧

http://blog.jobbole.com/78352/
Eclipse 常用快捷键 (动画讲解)

http://www.kankanews.com/ICkengine/archives/22630.shtml
git@osc(git)中team开发、fork和pull request的用法

http://blog.jobbole.com/57674/
超棒的 15 款 Bootstrap UI 编辑器

http://www.360doc.com/content/14/0401/10/176942_365396922.shtml
几个秒杀PPT的高大上的幻灯工具

http://www.html-js.com/article/2327
chrome调试工具常用功能整理

https://developer.mozilla.org/en-US/docs/Web/CSS/Tools
css tools

http://blog.mozilla.com.tw/posts/5589/editable-box-model-multiple-selection-sublime-text-keys-much-more-firefox-developer-tools-episode-31#userconsent#
淺談 Firefox 31 開發者工具

http://strut.io
在线制作Impress.js等基于WEB的PPT

http://www.html5tricks.com/8-unforget-html5-animation.html
分享8个难忘的HTML5炫酷动画及源码

http://jsfiddle.net/echo/jsonp/
回调JSONP

http://www.iinterest.net/2014/05/09/chrome-dev-tool-workspace/#userconsent#
Chrome 开发工具 Workspace 使用

http://blog.jobbole.com/78291/
开发者不可不知的Google Chrome七大新特性

https://github.com/miaoyaoyao/AngularJs-UI
AngularJs分页

http://jasny.github.io/bootstrap/javascript/#rowlink
bootstrap 的插件

https://www.npmjs.org/package/traceur
ECMAScript 6 转5

http://www.html5tricks.com/demo/css3-batman-animation/index.html
HTML5/CSS3实现蝙蝠侠人物动画演示地址

http://wf.uisdc.com/cn/
WEB开发基础 — web开发最佳实践手册

http://kangax.github.io/compat-table/es6/#
ECMAEcript6兼容性手册

http://amazeui.org/
国产UI

http://jsperf.com/
jsPerf: JavaScript performance playground

http://www.codeceo.com/article/programmer-book-and-magz.html
程序员必读的书籍和期刊杂志

http://www.cnblogs.com/Franks_blog/archive/2010/05/26/1744173.html
常用前端开发工具合集

https://modao.io/
WEB APP原型在线设计

http://yun.baidu.com/tools?qq-pf-to=pcqq.group
百度云收藏

http://www.superslide2.com/demo.html
JQ常见效果插件

http://www.jsjtt.com/webkaifa/html5/2013-10-29/42.html
html5截屏

http://www.webhek.com/drawwindow/
JS截屏

http://www.oschina.net/translate/performance-optimisation-with-timeline-profiles
chrome profiles

http://linxz.github.io/tianyizone/
css小工具集合。

http://baike.baidu.com/view/3968.htm
Cygwin windows下操作git利器。

http://www.html5tricks.com/7-nice-jquery-plugins.html
7个经典创意jQuery应用插件及源码

http://bbs.html5cn.org/forum.php?mod=viewthread&tid=79048&extra=
实现CSS动画的工具和教程指南

http://www.webhek.com/misc/interactive-resume/#userconsent#
超炫酷的HTML5简历

知乎

http://blogread.cn/it/article/6567?f=wb
如何成为一名优秀的web前端工程师（前端攻城师）？

http://www.zhihu.com/question/20127472
JavaScript中圆括号() 和方括号[] 的特殊用法疑问？

http://www.zhihu.com/question/19889770
知乎上有哪些 JavaScript 高手

http://www.zhihu.com/question/26014277
怎样拥有学霸那种一学就是十几个小时的精力？

http://www.zhihu.com/question/19556943
为什么淘宝这么成功，易趣却一败涂地？

http://www.zhihu.com/question/20246142
知乎上，前端开发领域有哪些值得推荐的问答？

http://www.zhihu.com/question/19969737
一些人瞧不起 jQuery 的理由是什么？

http://www.zhihu.com/question/20287740
Web 前端开发前景如何？

http://www.zhihu.com/topic/19550901
知乎前端标签

http://www.zhihu.com/question/19886046
Web 前端开发岗位，该选择百度还是腾讯？

http://www.zhihu.com/question/20238906
Web 开发的前端、后端的入门门槛是不是比较低？

http://segmentfault.com/q/1010000000727790
谈谈你对各种编程语言的看法
http://segmentfault.com/q/1010000000725223
GitHub应该放什么类型的代码?

http://www.zhihu.com/question/26058295
校招进 BAT 产品岗究竟多难？

http://www.zhihu.com/question/19819610
在 Mac 上进行开发比在 Windows 上效率更高吗？如何量化和比较这两个平台的开发效率

http://segmentfault.com/q/1010000000729671
作为一个IT人员是否必须有Macbook？

http://www.zhihu.com/question/19579212
产品经理应该如何正确处理老板不靠谱的需求？

http://www.zhihu.com/question/24693717
怎么从零开始学习 Python 语言编程？

http://www.zhihu.com/question/20252436
学习编程语言最好的方法是什么？

http://www.zhihu.com/question/26350691
阿里java校招本科生要求？自学没方向

http://www.zhihu.com/question/26187669
怎么判定web前端架构师的能力高低？

http://www.zhihu.com/question/26304098
买了kindle就一定会爱上读书吗？

http://zhuanlan.zhihu.com/imike/19878922
创业的首要问题

http://www.zhihu.com/question/21157664
为什么世界四大古代文明只有中华文明没有被毁灭？

http://www.zhihu.com/question/26026419
为什么滴滴打车都烧了几十亿却忍着不赚钱，背后的商业逻辑是什么?

http://www.zhihu.com/question/26187669
怎么判定web前端架构师的能力高低？

http://www.zhihu.com/question/22609639
云计算到底那家强？

http://www.zhihu.com/question/26226720
为什么前端不能一直做？难道要转行？？

http://www.zhihu.com/question/23512853
如何评价淘宝 UED 的 Midway Framework 前后端分离？

http://www.zhihu.com/question/23150301
一份优秀的前端开发工程师简历是怎么样的？

http://www.zhihu.com/question/19639471
遇到关注你薪资且会直接发问的老同学，怎么回答最合适？

http://www.zhihu.com/question/26228085
现在从事 Web 前端开发的高级工程师，想请问你们初入行时的战斗力如何？

http://www.zhihu.com/question/20790576
大公司里怎样开发和部署前端代码？

http://www.zhihu.com/question/19638115
知乎工程师们的开发环境是怎样的？

综合

http://www.html-js.com/article/2313
一个对前端模板技术的全面总结

http://www.html5cn.org/article-6980-1.html
程序员编程的10个实用技巧

http://news.html5tricks.com/2014-programmer-salary.html#userconsent#
2014年程序员的工资有多高？你是否该跳槽了！

http://blog.jobbole.com/56673/
Web应用开发中的几个问题

http://www.codeceo.com/article/10-years-taobao-tech.html
淘宝的十年技术之路

http://top.jobbole.com/14753/
程序员必须知道的10个算法和数据结构有哪些？

http://news.html5tricks.com/alibaba-mayun-saying.html
阿里上市后首次员工讲话马云说了啥？

http://www.codeceo.com/article/2015-baidu-offer.html
百度2015校园招聘面试题回忆录（成功拿到offer）

http://news.html5tricks.com/mayun-chuangye.html
马云：创业智慧！

http://www.html5cn.org/article-6982-1.html
老程序员：当编程成为你的第二职业

http://www.codeceo.com/article/computer-boot-process.html
计算机启动过程详解

http://www.iteye.com/news/22043
7本不错的HTML 5书籍推荐

http://blog.jobbole.com/46589/#userconsent#
有jQuery背景，该如何用AngularJS编程**？

http://wenku.baidu.com/link?url=UYSMOXQajtKOlqxn7qUMyOXh9oSyiIQiXJ12hzP-nWrVZxAu-tmAm-JUdm1A47mCQyeu0P-YDv-6G7m3aaDslgkpOOl4nwjob_Lf7mo-XTq
D2-淘宝移动端Web开发实践

http://www.cnblogs.com/coco1s/p/4034937.html
BAT及各大互联网公司2014前端笔试面试题--Html,Css篇

http://www.cnblogs.com/coco1s/p/4029708.html
BAT及各大互联网公司2014前端笔试面试题--JavaScript篇

http://cmsblogs.com/?p=1368#0-qzone-1-26860-d020d2d2a4e8d1a374a433f596ad1440
要扁平化，也要可用性

http://yuedu.baidu.com/ebook/43f627450722192e4436f641
**顶尖技术团队访谈录

http://blog.jobbole.com/46589/#userconsent#
有jQuery背景，该如何用AngularJS编程**？

https://github.com/justjavac/free-programming-books-zh_CN/blob/master/what-non-programming-books-should-programmers-read.md
“程序员应该阅读的非编程类书籍有哪些？”

http://www.vaikan.com/math-gifs/
21副GIF动图让你了解各种数学概念

http://blog.jobbole.com/48252/
我泡在GitHub上的177天

http://top.jobbole.com/15551/
几十种编程语言的快速入门教程

http://www.chinahrd.net/article/2013/03-21/85191-1.html
人人网的失败：抄袭不来的是灵魂

http://top.jobbole.com/15613/
github干货系列

系列

d2

snfed/attendance-records#4
参加2014 D2前端技术交流的一些感想和思考
moxiaohe/moxiaohe.github.io#2
记录10.25杭州D2前端技术论坛
http://segmentfault.com/blog/jiyinyiyong/1190000000742126
参加 D2 的这个周末
http://www.hacke2.cn/2014-10-d2/
2014.10.25 杭州D2行
snfed/attendance-records#5
勾三股四的感悟
http://www.cnblogs.com/jikey/archive/2010/12/21/1913113.html
第五届D2-豪情
http://hikejun.com/blog/2010/12/20/%E7%AC%AC%E4%BA%94%E6%AC%A1d2%EF%BC%8D%E5%85%B3%E6%B3%A8%E5%9C%A8%E5%89%8D%E7%AB%AF%E5%9F%BA%E7%A1%80%E6%9E%B6%E6%9E%84/#userconsent#
第五次D2--张克军
https://github.com/snfed/attendance-records/issues
苏宁总结

规范

https://github.com/ecomfe/spec/blob/master/html-style-guide.md
HTML编码规范
https://github.com/ecomfe/spec/blob/master/css-style-guide.md#46-2d-%E4%BD%8D%E7%BD%AE
CSS编码规范
https://github.com/ecomfe/spec/blob/master/javascript-style-guide.md
JAVASCRIPT编码规范
http://yuwenhui.github.io/
http://www.cnblogs.com/hustskyking/p/javascript-spec.html
前端编码规范之js
http://segmentfault.com/a/1190000000443795
最流行的PHP 代码规范
http://www.zhihu.com/question/20351507
http://www.cnblogs.com/tugenhua0707/p/3507957.html
AMD与CMD规范的区别
http://docs.kissyui.com/1.4/docs/html/tutorials/style-guide/kissy-source-style.html
KISSY 源码规范
https://github.com/hfcorriez/fig-standards/blob/zh_CN/%E6%8E%A5%E5%8F%97/PSR-2-coding-style-guide.md
php代码编写规范
http://codeguide.bootcss.com/
bt编码规范
https://github.com/Suxiaogang/Code_Guide
规范加强版。

CDN

http://lib.sinaapp.com/
http://open.bootcss.com/
http://libs.useso.com/
https://cdnjs.com/
http://openapi.baidu.com/wiki/index.php?title=docs/cplat/libs
https://developers.google.com/speed/libraries/?csw=1

验证

http://validform.rjboy.cn/demo.html
表单验证
http://code.ciaoca.com/jquery/validation_engine/demo/
https://github.com/posabsolute/jQuery-Validation-Engine
数字验证
http://www.gafish.net/archives/1527
表单验证规则
http://niceue.com/validator/demo/
https://github.com/niceue/validator
漂亮验证

2014年11月下前端资源分享

js

http://segmentfault.com/a/1190000000355221
全栈式 JavaScript 介绍

http://www.html-js.com/article/2468
JavaScript Promise －告别异步乱嵌套

http://www.imooc.com/wenda/detail/237604
web 另类方法实现“另存为”功能

http://bbs.csdn.net/topics/390938738
关于js中内存分配的一些疑惑

http://www.evget.com/article/2014/11/13/21815.html
盘点8款最小的JavaScript前端开发框架

http://www.shejidaren.com/how-to-learn-javascript.html
如何正确学习JavaScript

http://www.cnblogs.com/zztt/p/4098266.html
JavaScript 频繁发射事件处理的优化 --- 函数节流/事件稀释

http://www.cnblogs.com/horve/p/4092064.html
谈谈DOMContentLoaded：Javascript中的domReady引入机制

http://www.html-js.com/article/2418
使用原生JavaScript实现数据绑定

http://jser.me/2013/08/20/javascript%E7%9A%84%E5%87%A0%E7%A7%8D%E4%BD%BF%E7%94%A8%E5%A4%9A%E8%A1%8C%E5%AD%97%E7%AC%A6%E4%B8%B2%E7%9A%84%E6%96%B9%E5%BC%8F.html
javascript的几种使用多行字符串的方式

http://caibaojian.com/iframe-adjust-content-height.html#userconsent#
iframe高度自适应内容

http://html-js.com/article/Forced-grid-programming-topics
审视co和展望ES7

http://www.zhangxinxu.com/wordpress/2013/04/js-mousewheel-dommousescroll-event/#userconsent#
JS滚轮事件(mousewheel/DOMMouseScroll)了解

http://segmentfault.com/blog/acwong/1190000001660292
Seajs 实践(一)—— 模块化 2048 游戏

http://www.cnblogs.com/rubylouvre/p/3990290.html
javascript 隐性类型转换步骤

http://segmentfault.com/blog/liangyi/1190000002361044
RequireJS:一款优秀的AMD模块加载器

http://blog.jobbole.com/64771/
JavaScript基础工具清单

http://prompt.ml/0
xss攻击比赛

CSS

http://www.cnblogs.com/radom/archive/2012/04/19/2457356.html
CSS3那些不为人知的高级属性

http://www.cnblogs.com/acmilan/archive/2012/03/02/2377812.html
box flex 弹性盒模型

http://www.zhangxinxu.com/wordpress/?p=1338
CSS box-flex属性，然后弹性盒子模型简介

http://www.css119.com/archives/1605
CSS3盒模型display:box详解

http://www.w3cplus.com/css3/designing-css-layout-with-flexbox.html
Flexbox制作CSS布局易如反掌

http://www.w3cplus.com/blog/666.html
深入了解 Flexbox 伸缩盒模型

http://www.missyuan.net/school/web_2012/web_8338.html
CSS3实例教程：详解calc()函数功能

http://www.w3cplus.com/css/css-simple-shapes-cheat-sheet
CSS制作图形速查表

http://www.feelcss.com/three-pure-css-to-achieve-the-triangle-method.html
三种纯CSS实现三角形的方法

http://www.elonglau.com/171.html
基于CSS3的WEBAPP横向滑动模式演化

http://www.cnblogs.com/xueming/archive/2012/03/21/VerticalAlign.html
利用vertical-align:middle实现在整个页面居中

http://www.zhangxinxu.com/wordpress/?p=3381
伪元素表单控件默认样式重置与自定义大全

http://aliceui.org/
支付宝样式解决方案

http://hxgdzyuyi.github.io/blog/chinese-subset.html
中文字体其实也可以用在网页上的

http://www.w3cplus.com/preprocessor/sass-bring-change.html#userconsent#
Sass带来的变革

http://www.cnblogs.com/top5/archive/2012/02/14/2351959.html
CSS3模拟各种图形

http://www.w3cplus.com/blog/tags/131.html#userconsent#
垂直居中

http://www.cnblogs.com/skylar/p/4106325.html
CSS3 Flexbox不迷路指南

http://blog.moocss.com/tutorials/html-css-tutorials/438.html
固定(Fixed) vs. 流动(Fluid) vs. 弹性(Elastic)：哪种布局更适合你？

http://www.imooc.com/wenda/detail/237236
5种你未必知道的JavaScript和CSS交互的方法

移动WEB

http://sc.chinaz.com/info/130410113358.htm
浅淡HTML5移动Web开发

http://www.w3cplus.com/css/safari-6-and-chrome-21-add-image-set-to-support-retina-images.html
image-set实现Retina屏幕下图片显示

http://developer.51cto.com/art/201309/410720.htm
WebKit最新特性srcset简介

http://mobile.51cto.com/web-444532.htm
WebApp开发技巧精华总结

http://www.imooc.com/wenda/detail/235401
HTML5语义标签的实践（blog页面）

综合

http://www.52ij.com/jishu/4255.html
Git 协议的分支作用

http://www.cnblogs.com/hustskyking/p/git-improve.html
git版本管理策略及相关技巧(A)

http://blog.csdn.net/superyan/article/details/41049473
一位创业者创业失败后，成功的做了一个创业孵化器!

http://weibo.com/p/1001603776207387757094
程序员真正的价值

http://lxshopping.blog.51cto.com/4542643/1574929
一次网站迁移故障及分析

http://www.cnblogs.com/hustskyking/p/git-improve.html
git版本管理策略及相关技巧(A)

http://www.imooc.com/wenda/detail/235696
你不可不知的10个Github功能

http://twitter.github.io/
twitter开源

http://www.yalewoo.com/git_https_password.html
Git使用https方式记住密码

http://www.w3cplus.com/css/front-end-web-development-quiz.html#userconsent#
Web前端开发测试题

http://blogread.cn/it/article/6901?f=wb
浏览器的重绘(repaints)与重排(reflows)

http://www.lukew.com/ff/entry.asp?1392
RESS: Responsive Design + Server Side Components

http://www.cnblogs.com/ctriphire/p/4116207.html
Chrome 控制台console的用法

作品

http://www.qimeiwu.com/dajiang/index.html#userconsent#
3D柱子展示

http://browser.qq.com/
QQ浏览器，很炫

http://runjs.cn/code/ws7x93sx
俄罗斯方块

http://baozipu.zhihu.com/#fkwct
这是一个美食家勇闯金融界的故事.

http://www.cnblogs.com/lhb25/p/html5-interview-questions.html
10个最常见的 HTML5 面试题及答案

知乎

http://www.zhihu.com/question/26573474
支付宝在 2014 年「双十一」期间的峰值处理交易速度达到每分钟 285 万笔，这在业内是怎样的一个水平

http://www.zhihu.com/question/25868625
有哪些神一般的实验设计？

http://www.zhihu.com/question/22146521/answer/20462433
前端大牛们都学过哪些东西？

http://www.zhihu.com/question/23748804
怎样在 GitHub 下收集 star?

资源

http://help.gitbook.io/editor/README.html
gitbook editor

http://read.douban.com/column/159479/
豆瓣前端专栏

http://www.browserstack.com/
吊炸天的一个测试网站，模拟任何计算机与浏览器

http://xpressive.org/
MAC 开发前端工具

https://www.flinto.com/
APP动态原型

http://apistore.baidu.com
apistore

系列

视差滚动

http://www.alloyteam.com/2014/02/optimized-articles-of-parallax-scrolling-love-story/
视差滚动的爱情故事之优化篇

http://www.nintendo.com.au/gamesites/mariokartwii/
马里奥赛车

http://www.alloyteam.com/2014/01/parallax-scrolling-love-story/
视差滚动的爱情故事

http://www.ok-studios.de/home/
只用两层

HTML5和JavaScript Web应用开发读书笔记

HTML5和JavaScript Web应用开发

第一章客户端架构

过去前端开发人员不用关心用户界面后的框架，从未先现在一样关注浏览器的性能
过去利用服务端模板和组件框架，如JAVA 的JSP,Velocity，前端只是套个模板而已
如今浏览器的性能已经得到了很大的提升，很多逻辑在客户端写，而后台仅仅提供Restful风格的接口
我们现在创建的不是网站，而是基于HTML5，CSS3和JavaScript的可靠地应用程序
服务端模板引擎已经逐渐被JavaScript模板所取代
JavaScript API得到了更多硬件访问的支持，例如Geolocation、Web Workers
应该为当前的项目作出价值的决策，必须建立和维护编写、测试、和调试代码与选择框架的工作流
WEB开发模式已经逐渐在演化，我们前端是新时代的先锋，抓住这个机会，创建性能强大，可伸缩的应用，利用WEB最新规范将其推进一步，变得更好。

第二章移动WEB

28%会使用移动设备来冲浪，但也有很大一部分人使用IE9以下的浏览器
维基百科 HTML5引擎对比页面
Webkit、Mobile Firefox、OperaMobile
浏览器的市场份额,最新浏览器HTML5支持
优雅降级
移动设备模拟器列表

第三章为移动WEB构造程序

移动设备的成功依赖于两个因素：所以平台一致的外观；具有离线能力、UI动画和通过Rest风格或者WebSocket端点读取和发送数据的后端服务
有两个影响：CPU/GPU的速度和互联网速度
移动端的设计模式
要考虑的事情：硬件加速，内存分配和计算负担，电池的消耗与寿命，使用canvas代替image
常见交互滑动，翻转，旋转transtion,transtform,transtlate.建议使用translate3d, 2d转换不支持GPU加速
使用Chrome查看每秒帧数FPS,查看是否加速用合成渲染边框
读取和缓冲，将AJAX缓冲到localStorage 可存5M
IOS使用InnerHTML可能会出问题
网络类型检测与处理
移动WEB常用于单页，可以平滑的向原生应用过渡，减少了请求次数

移动框架

对触摸屏设备的优化，确保使用CSS3过渡处理动画
在所有主流平台浏览器上跨平台一致性
使用或封装最新的HTML5 CSS3标准
框架背后的强大开源社区
单页框架：JQuery Mobile, JQTouch
无页面结构框架：xui
100%JavaScript驱动：SenchaTouch, Wink Tooolkit, The-M-Project

移动调试

第四章桌面WEB

由于AJAX的出现，在后台生成HTML的时代宣告结束
在客户端生成HTML降低了服务器的负载
使用HTML5 + Node.js的例子，比前身快2~10倍

客户端优势

更好的用户体验
网络带宽减少（降低成本）
具有可移植性（离线）

服务端优势

更好的安全性
减少客户端的处理开销（移动端电池）
具有可扩展性（方便添加更多服务器）
性能检测可以使用UA或Modernizr.js

特征检测

原生特征检测一般使用创建一个元素看某一个方法是否存在
使用Modernizr.js可能会带来加载时间超过30MS，因为必须在DOM加载之前渲染各个值，
使用Modernizr.js不建议在生产环境中使用，但是可以在开发阶段使用它将各个浏览器的兼容性先调试好
FormFactory.js可以检测不同类型的的设备,如移动设备版本、电视版本

UA

window.navigator.userAgent检测，但是不可靠
Google的一款UA解析器，基于JSONua-parser，另一款基于JSplatform.js
服务端检测，MobileESP用来检测userAgent的首标

压缩

确保之压缩可压缩的内容，不要把资源浪费在可压可不压的内容上
未访问这选择正确的压缩方案
正确配置WEB服务器，将压缩的内容发给具体的有解压能力的客户端
如果一个大型页面(20k ~ 30K)压缩可能会加载CPU的负载，远大于SQL的执行，建议不压身
压缩的目标可以有HTML, CSS, JS, XML, JSON, HTC, TXT(Robots.txt)
可使用GZIP(减少70%，90%浏览器支持)或DEFLATE
压缩JS和CSS的工具有Closure Cpmpiler, Yahoo!YUI Compressor, JSMin, Packer,
前端构建(验证压缩合并等)grunt, Jawr, Ziproxy

JavaScript MVC框架

第五章 WebSocket

从浏览器发出请求包含了header，无压缩的header可能有200b~2kb之前
WebSocket通过套接字的全双工同学，是客户端和服务器通信的高效手段
优雅降级是指在WebSocket不受支持时退回到就技术(Flash或长轮训)
NIO和线程直接的争论永无止境，一般的，高并发建议NIO，对计算有很大要求的用多线程
观察者模式，一般的有三个事件，OPEN, MESSSAGE, CLOSE
使用Jetty服务器实现WebSocket的例子
不仅可以传递文本，JSON，而且可以传递二进制，用老发送流式音频，也可以提供画布（你画我猜）与实时的屏幕共享技术
使用代理技术如HAProxy让拆除服务器又不影响新的服务

优势

没有HTTP Header
没有持续(Keep-alive)问题引起的时滞
低延时，更好地吞吐量和相应能力
对移动设备的电池有利

框架

Ver.x是一个全异步，通用的JVM语言应用容器，是JVM版的Node.js
Socket.io目标是在每种浏览器和移动设备实现应用，优雅降级
Atmosphere可运行在任何基于JAVA的WEB框架

第六章 Web Storage

Cookie只有4K的存储量，而且每次都会带在HTTP请求头，与服务器共享
Web Storage有5M，但是存储数据若为UTF-16只有2.6M，IE和Firefox除外
Web Storage分为localStorage和sessionStorage(关闭浏览器或标签会消失)
读取或存储数据，是阻塞式的
常用API:length;key(n);getItem(key);setItem(key, value);removeItem(key);clear();
使用localStorage[name] = 'hacke2',localStorage.name = 'hacke2', localStorage.setItem('name', 'hacke2')效率不同
同步问题使用StorageEventAPI解决
使用JSON在Web Storage上要进行编码和解码
无安全性可言
浏览器隐私模式下存储会出现异常
使用场景，存储一些Base64的图片，用户搜索的一些数据(神马搜索)等，QQ空间、Disqus评论将草稿存储在loaclStorage,自动登录，带有时间戳的缓存等
从客户端缓冲数据允许离线且连接到网络时刷新数据
用Backbone进行数据库同步
在任何浏览器中使用Web Storage

框架

LawnChair轻量级支持移动设备
persistence.js用于服务端，集成Node.js和MySQL

第七章 Geolocation

提供对于宿主设备相关的地理位置信息的脚本访问，定位用户移动时跟踪器经纬度
地理防护：进入或离开一个位置进行提醒
地址匹配：利用Google将经纬度转为实际地址
一般跟踪：跟踪汽车，走路，跑步的距离
navigator.geolocation.getCurrentPosition(function(){})
防止激活Geolocation的一个变通方法
实例：用户跟踪，反向地址匹配
Geolocation API跨浏览器支持

框架

第八章 Device Orientation API

加速度计，陀螺仪，指南针
实例：用设备的移动完成滚动

第九章 Web Workers

当WEB应用需要在JavaScript进行繁重的工作和后台处理的时候，推荐使用
Web Worker API检测
Web Worker 性能测试
实例：池化和并行作业对应的演示程序
实例：处理图像

2014年11月上前端资源分享

js

http://blog.jobbole.com/29454/
常用javascript设计模式

http://coderlmn.github.io/code-standards/#userconsent#
前端代码规范及最佳实践

http://www.w3cfuns.com/thread-5591957-1-1.html
人人网javascript面试题

http://blog.51yuekan.com/2014/10/08/2014-08-02-javascript-module-define/
Javascript模块化开发－轻巧自制

https://github.com/hacke2/thin/tree/master/docs
从零开始写JavaScript框架

http://coolshell.cn/articles/9666.html
浏览器渲染原理

http://coolshell.cn/articles/9749.html#jtss-tsina
JS加载原理

http://bbs.html5cn.org/thread-84774-1-1.html
HTML5 中 40 个最重要的技术点

http://www.thinkjs.org/test/websocket
thinkjs 15行实现聊天系统

http://shangchun.net/promise-insight.html#userconsent#
剖析 Promise 之基础篇

xufei/blog#5
构件单页WEB应用

http://nodejs.cn/api
nodejs api

http://segmentfault.com/blog/colin4124/1190000000373243
如何恰当地学习 JavaScript

https://github.com/Lucifier129/Lucifier129.github.io/blob/master/lab/build-your-own-jquery-library.md#userconsent#
如何写一个你自己的jQuery库？

https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_graphics_with_canvas#userconsent#
使用canvas绘图

http://blog.sina.com.cn/s/blog_53d3c24a0100mpnv.html#userconsent#
|运算符的技巧

http://rapheal.sinaapp.com/2014/11/06/javascript-error-monitor/#userconsent#
前端代码异常监控

http://www.w3cfuns.com/thread-5597323-1-1.html
用AOP改善JavaScript代码

https://github.com/alsotang/node-lessons
Node.js包学包会

http://www.codeceo.com/article/node-js-upload-large-file.html
Node.js上传1G文件

http://cloudbbs.org/forum.php?mod=viewthread&tid=28773&page=1&extra=#pid180304
JavaScript之web通信

http://zhuxinyong.com/2014/11/03/%E4%BD%BF%E7%94%A8Express4%E5%92%8CNode%E6%90%AD%E5%BB%BARESTful-API/
使用Express4和Node搭建RESTful API

http://www.cnblogs.com/fengyuqing/p/backbone_events_api_usage.html
Backbone事件模块及其用法

http://bbs.html5cn.org/thread-83317-1-1.html
HTML5画布(CANVAS)速查简表

http://www.gbtags.com/gb/site/sunnyboy2013.htm
图解闭包

css

http://www.cnblogs.com/zhaoran/archive/2013/05/24/3097482.html
css3 box-sizing属性

http://www.webhek.com/misc/mastering-nth-child/#userconsent#
精通:nth-child

http://www.cnblogs.com/dolphinX/p/3508869.html
浮动与BFC

http://ued.ctrip.com/blog/wp-content/webkitcss/quicksearch.html
webkit css 速查

http://www.cnblogs.com/ranran/archive/2014/11/03/4071088.html
CSS 和 JS 动画哪个更快

http://www.html5tricks.com/15-cool-html5-css3-animation.html
15个无比华丽的HTML5/CSS3动画应用

http://rauchg.com/2014/7-principles-of-rich-web-applications/
开发富WEBAPP的7个原则

http://www.daqianduan.com/4721.html
CSS创建三角形

http://ued.ctrip.com/webkitcss/
新版Webkit各属性的介绍，

http://enjoycss.com/
enjoycss

http://css3lib.alloyteam.com/
css3lib

http://www.cnblogs.com/yexiaochai/p/4074624.html
CSS3布局

http://www.iloushi.cn/ued/playground/background/
多层背景交换

http://www.cnblogs.com/lilyimage/p/3682810.html
flex全揭秘

http://blog.bingo929.com/transform-translate3d-translatez-transition-gpu-hardware-acceleration.html
使用CSS3开启GPU硬件加速提升网站动画渲染性能

http://blog.bingo929.com/html5-and-css3-tools-list.html
HTML5和CSS3工具资源汇总

移动

http://lyric.im/best-practice-for-web-app-development/
WEBAPP最佳实践

http://juntao.me/?p=42
Web移动端页面快速实现滑动效果

https://developer.apple.com/library/safari/navigation/
safari 开发者文档

http://mobile.51cto.com/web-388485.htm
Web App开发入门

http://isux.tencent.com/responsive-web-design.html
响应式网页设计

http://www.cnblogs.com/vajoy/p/3903591.html
跨终端响应式页面设计入门

http://www.lukew.com/ff/entry.asp?1927
大屏幕手机按键设计的几种思考

http://www.cnblogs.com/aaronjs/p/3147470.html
web app开发利器 - iscroll4 解决方案

http://pixelhandler.com/posts/develop-a-restful-api-using-nodejs-with-express-and-mongoose
使用express和mongoose在Node.js上开发restfun api

http://www.w3cmark.com/2014/99.html
移动端面试

https://www.zybuluo.com/hacke2/note/45079
移动的一些名词

http://www.html-js.com/article/2400
关于webapp中的文字单位的一些捣腾

http://www.html-js.com/article/2403
iSlider 移动端 Webapp 滑动的最优解决方案

http://www.nowamagic.net/csszone/css_IeFilterTransparencyShadowsEtc.php#userconsent#
IE滤镜实现透明度/阴影/渐变等特效

http://www.html-js.com/article/Like-the-winter-flexible-design-and-implementation-of-the-mobile-phone-Taobao-cold
手机淘宝的flexible设计与实现

作品

http://aui.github.io/popupjs/doc/selectbox.html
select修饰器

http://www.seejs.com/demos/examples/opa/#userconsent#
无痕哥滑动

http://jsbin.com/jonuyuzu/2/edit
无痕哥购物车动画

http://www.seejs.com/demos/examples/moon/#userconsent#
无痕哥白发魔女传

http://www.ituring.com.cn/article/25069
前端开发技术的发展

http://www.codefans.net/jscss/code/3808.shtml
JQ视觉差异

http://www.neoease.com/lazy-load-jquery-plugin-delay-load-image/#userconsent#
JQ懒加载

http://www.adanghome.com/js_demo/45/

http://www.lightapp.cn/auto/index/3462?channel=1&code=00f807513935e39fd4fd5afac71f03b0&weixin.qq.com=&from=timeline&isappinstalled=0#wechat_webview_type=1&from=timeline&isappinstalled=0
移动滑动

http://demo.kalcaddle.com/index.php?editor
WEB桌面

http://demo.itivy.com/jdigiclock/index.html
模拟HTC手机时间和天气

https://github.com/romashamin/Size-Marks-PS
Size-Marks-PS

http://www.yyyweb.com/demo/animated-buttons/index.html
CSS3按钮

https://www.manymo.com/emulators
移动端模拟

https://github.com/ccampbell/mousetrap
对键盘操作的一些封装

http://barretlee.github.io/SuperMarker/index_cn.html
小胡子哥的切图神器

http://www.gbtags.com/gb/gblaitu.htm#0-tsina-1-81620-397232819ff9a47a7b7e80a40613cfe1
图片生成工具

http://www.cnblogs.com/lhb25/p/jquery-face-detection-plugin.html
JQ人脸识别

http://www.cnblogs.com/flylee90/p/4086102.html
CSS3写轮眼

http://www.html5tricks.com/10-cool-html5-new-animation.html
10款优秀的HTML5作品

http://btgoogle.com/SchoolTest.html
投简历时学校选择器

http://www.oschina.net/news/56993/30-newest-free-ui-kits-for-november-2014
11 月份 30 个最新的免费 UI 工具包

知乎

http://www.zhihu.com/question/26165631
对于同样的浮点数运算为何 Java 与 C 的结果不相同？

http://www.zhihu.com/question/21523362
js就是操作DOM用的么？

http://www.zhihu.com/question/23657255
如何快速判断 DOM 元素位于 viewport 以外?

http://www.zhihu.com/question/20175038
为什么使用原生 JS 删除、替换 DOM 节点总是要用到父节点？

http://www.zhihu.com/question/26157282
新手关于如何看编程经典书的一些疑惑？

http://www.zhihu.com/question/20691294
为什么「box-sizing:border-box」没有被广泛采用

http://www.zhihu.com/question/24997992
面试阶段如何与 HR 沟通薪酬？

http://www.zhihu.com/question/20194937
**公司在 GitHub 上有哪些比较出彩的开源项目？

http://www.zhihu.com/question/22989105
「只差程序员」为什么会招黑？

http://www.zhihu.com/question/25680951
怎么进入BAT的研发部门?

http://www.zhihu.com/question/26157282
新手关于如何看编程经典书的一些疑惑？

http://www.zhihu.com/collection/38766289
前端收藏栏

http://www.zhihu.com/question/26295825
作为一个前端工程师，是往node方面转，还是往HTML5方面转？

http://www.zhihu.com/question/26521450
前端切图之前你是如何分析设计图的？

综合

http://www.cnblogs.com/twobin/p/4071132.html
这个小伙总结的基本都覆盖了的

http://developer.51cto.com/art/201404/435435.htm
如何在github上为开源做贡献

http://www.cnbeta.com/articles/341603.htm
Google已为Chrome带来全新的书签管理器

http://www.cnblogs.com/hustskyking/p/life-in-alibaba.html
我在阿里这仨月

http://www.cnblogs.com/huang0925/p/4069921.html
程序员健身

http://news.html5tricks.com/something-about-internet-companies-and-software-engineering.html
互联网公司和软件工程那些事

http://www.codeceo.com/article/10-job-questions-i-ask.html
10个我最喜欢问程序员的面试问题

http://www.codeceo.com/article/7-feature-programmer-have.html
优秀程序员的精神

http://www.cnblogs.com/astwish/articles/3548844.html
如何在github上fork一个项目来贡献代码以及同步原作者的修改

http://blog.csdn.net/wirelessqa/article/details/20153689
Git入门指南十一:Git branch 分支与合并分支

http://hi.barretlee.com/2014/04/30/switch-branch-in-git/
git切换到远程分支

https://www.zybuluo.com/mdeditor
在线 Markdown 编辑阅读器

http://cdn.code.baidu.com/
百度静态资源库

jayli/jayli.github.com#16
航旅无线前端团队必备技能

http://news.cnblogs.com/n/172861/
揭秘Amazon反应速度超快的下拉菜单

http://www.cnblogs.com/editor/p/4080517.html
吐槽贴：百度地图 api 封装的实用功能；

http://krpano.com/
制作全景图

http://2014.jsconf.cn/slides/herman-taobaoweb
淘宝前后端分离

http://www.codeceo.com/article/5-sort-algorithm.html
5种排序算法性能比较总结

系列

模块化规范

https://github.com/cmdjs/specification/blob/master/draft/module.md
seajs/seajs#242
cmd
https://github.com/amdjs/amdjs-api/wiki/AMD
https://github.com/amdjs/amdjs-api/wiki/AMD-(%E4%B8%AD%E6%96%87%E7%89%88)
amd
seajs/seajs#588
前端模块化开发那点历史
http://www.zhihu.com/question/20351507
AMD 和 CMD 的区别有哪些？
seajs/seajs#547
前端模块化的价值
http://lifesinger.wordpress.com/2011/05/17/the-difference-between-seajs-and-requirejs/
SeaJS 和 RequireJS 的异同
seajs/seajs#971
如何改造现有文件为 CMD 模块
define的定义
seajs/seajs#242
cmd define 模块定义
http://www.ruanyifeng.com/blog/2012/11/require_js.html
amd define 模块定义
seajs/seajs#242
CMD 模块定义规范

导航站分享

http://whycss.com/
http://sentsin.com/daohang/
http://www.cnfeinfo.com
http://123.jser.us/
http://www.css88.com/nav/

前端性能优化

http://www.gbtags.com/gb/share/3771.htm
http://www.gbtags.com/gb/share/3775.htm
http://www.gbtags.com/gb/share/3782.htm

淘宝装修工具

http://www.001daima.com/index.php?get=active&getmod=editor
http://www.esio.cn
http://www.soasoa.cn/index.html
http://www.dianmishu.com/
http://www.animer.cn/editor.html

处理移动Web应用Scroll效果JS库集合

https://github.com/ftlabs/ftscroller
https://github.com/zynga/scroller
https://github.com/davidaurelio/TouchScroll
http://cubiq.org/iscroll

浏览器原理

http://www.html5rocks.com/zh/tutorials/internals/howbrowserswork/
浏览器的工作原理
http://www.html5rocks.com/zh/tutorials/internals/howbrowserswork/
http://ux.sohu.com/topics/50972d9ae7de3e752e0081ff?qq-pf-to=pcqq.group
http://www.smallni.com/css-performance-from-the-browsers-rendering/
浏览器的工作原理：新式网络浏览器幕后揭秘
http://coolshell.cn/articles/9666.html
浏览器的渲染原理简介
http://blog.vtmer.com/2013/05/high-performance-javascript-1/
js 并行加载与顺序执行
http://fex.baidu.com/blog/2014/05/what-happen/
从输入 URL 到页面加载完成的过程中都发生了什么事情？
http://ux.sohu.com/topics/50972d9ae7de3e752e0081ff?qq-pf-to=pcqq.group
浏览器的工作原理：新式网络浏览器幕后揭秘
http://hikejun.com/blog/2012/02/02/js%E5%92%8Ccss%E7%9A%84%E9%A1%BA%E5%BA%8F%E5%85%B3%E7%B3%BB
js css的顺序
http://coolshell.cn/articles/9749.html
js的装载与执行
http://renyongjie668.blog.163.com/blog/static/1600531201097062789/
浏览器加载和渲染html的顺序

ES兼容性查询

http://kangax.github.io/compat-table/es5/
这是5的
http://kangax.github.io/compat-table/es6/
这是6的
http://kangax.github.io/compat-table/es7/
这是7的。

简历

http://learnshare.github.io/about/index.html
不错的个人简历
http://hcy2367.github.io/resume/
简历
http://ncuey.sinaapp.com/CrispElite/
张伦
https://github.com/hacke2/ResumeSample
简历
http://blog.dandyweng.com/2013/07/how-my-website-was-created/
翁天信
http://www.webhek.com/misc/interactive-resume/
动画方式的简历
http://www.linqing07.com/resume.html
组件丰富简历

我收集的一些关于前端的思维导图

对于如何学习一门知识，我觉得思维导图是一个不错的工具，学习之前可以看一下大致的学习路径，学习后可以尝试自己画一下理清自己的知识体系，分享一些我收集的有关前端的思维导图>

git的使用

web前端工程师修炼之道

电子商务用到的知识

流量劫持

前端一些相关知识

全栈工程师一些相关知识

全栈工程师所要学的一些知识

正则一目了然图

程序员的职业路线规划

由于github page升级，旧的代码块样式会乱，待升级

The page build completed successfully, but returned the following warning:

You are attempting to use the 'pygments' highlighter, which is currently unsupported on GitHub Pages. Your site will use 'rouge' for highlighting instead. To suppress this warning, change the 'highlighter' value to 'rouge' in your '_config.yml'. For more information, see https://help.github.com/articles/page-build-failed-config-file-error/#fixing-highlighting-errors.

GitHub Pages was recently upgraded to Jekyll 3.0. It may help to confirm you're using the correct dependencies:

 https://github.com/blog/2100-github-pages-now-faster-and-simpler-with-jekyll-3-0

For information on troubleshooting Jekyll see:

 https://help.github.com/articles/troubleshooting-jekyll-builds

If you have any questions you can contact us by replying to this email.

由于github page升级，旧的代码块样式会乱，待升级