web前端开发编码规范及性能优化

代码优化

这个部分仅仅将代码优化本身,不考虑性能,关于代码部分的性能优化在 页面渲染 部分 代码优化 中

HTML+CSS

• 符合 XHTML 规范: 小写,正确嵌套,必须关闭;
• 双引号,合理缩进,utf-8编码;
• 标签语义化,便于维护;
• 合理注释,比如 div 关闭的地方表明配对的 div;
• HTML,CSS,JS 分离,方便维护;
• 避免使用 iframe, 否则会阻塞父文档 onload;
• 样式继承,不要重复;
• 不要乱用 href 和 onclick, 他们本质不同,href 偏向资源加载,而 onclick 仅仅是点击;其次 click 事件在 href 之前执行;
• css伪类选择器不宜太多,防止选择器过载;
• 不要让样式难以覆盖,少用!improtant;
• 善于利用样式继承(注意继承和层叠是不一样的概念);
• 不要保留过时的浏览器前缀和兼容性写法;

JavaScript

• 标识符简短清晰,不用 1 和 0 代替 true 和 false,合理编写注释,提高代码可读性;
• 定义变量一定写 var,以免污染全局,同时,new Function() 和 eval() 也会污染全局;
• 长字符串用字符串链接写法,而非跨行。在兼容的情况下,用 ES6 中的多行字符串也更好;
• 不要在 if 和 for 中定义函数,前置没有意义,破坏分支;后者易出现循环参数拖尾的情况;
• 在此法作用域开始处声明变量,提高可读性;
• var Name = function Name(){}; 有利于堆栈跟踪(注意变量名一致性);
• 位运算不要大