逼死强迫症之代码规范（性能优化）
var关键字变量命名（利用$符号带头区分jQuery对象与HTML DOM对象）
var a = 0,
$loading = $('#loading'),
$body = $('body');
多次操作DOM对象缓存为变量
//不好的写法
$('#loading').html("loading...");
$('#loading').fadeIn();
//提升性能的写法
var $loading = $('#loading');
$loading.html("loading...");
$loading.fadeIn();
//再或者是
$loading.html("loading...").fadeIn(); //链式
逻辑判断表达式
if(!$a) {
$a = $('#a');
}
//高性能 + 精简
$a = $a || $('#a');
jQuery选择器
//老生常谈
//不要使用class选择器
//不要使用class选择器
//不要使用class选择器(重要的事情说三遍)
var a = $("span#a");
var b = $("#a #b"); //性能非常非常的差，而且没有必要(会遍历前一个节点)
慎重操作DOM
//一次性的DOM渲染
var list = '<ul id="list">';
for (var i = 1; i < 100; i++) {
list += '<li>' + i + '</li>';
}
list += '</ul>';
$('body').append(list);
// 多次重复的DOM渲染(不要这样写！)
$('#header').append('<ul id="list"></ul>');
for (var i = 1; i < 100; i++) {
$('#list').append('<li>' + i + '</li>');
}
慎重使用全局变量，少用attribute存数据，data()方法附加数据（某前端live讲到数据存取性能时候提到，但是并没有找到具体性能指标）
//项目中多数使用attr存取数据
<li data-id="877" value="101172" retype="pub"></li>
//采用jQuery的内部函数data()来存储状态
$('#a').data('key', 'value'); //存储
$('#a').data('key'); //调用
各种兼容坑坑坑（项目经验）
神奇的safari兼容
safari的new Data()只能识别"xxxx/xx/xx"，不能识别"xxxx-xx-xx"
神奇的获取窗口位置兼容写法
var leftX = typeof window.screenLeft == 'number' ? window.screenLeft : window.screenX;
ver topY = typeof window.screenTop == 'number' ? window.screenTop : window.screenY;
神奇的Firefox兼容
window.event不能用！而且没有removeNode方法，只能使用node.parentNode.removeChild(node)
操作目录树的时候被坑过。
迷之手机端video对象（iOS兼容）
之前iOS操作video对象（设置display:none时不会隐藏弹出的播放窗口，只会隐藏页面上的video节点），但是目前用户反馈弹出的播放窗口也会隐藏了！（还未找到有人出现相同问题）
题外话
之前写代码碰到瓶颈期，不知道怎么才能提升；有时候还会被项目进度逼着走，不得以的时间为了快速解决问题忽略了一些细节性问题，然而对于这些细节性问题的钻研，往往是提升能力的一大关键点。
“多拆一些好的轮子，而不是刻意去重新发明轮子”在我看来很有道理，为优秀的源码写扩展十分有利于能力的提升。（最近新写的几个umeditor组件与通用方法都写成文档放在git-flow上了，有兴趣的可以看看源码一起分享看法哟）
共勉。
作者 @郑小明
2017 年 1 月 5 日
