|
HTML5为我们提供了很多旨在精确描述内容的语义元素。确保你可以从它丰富的词汇中获益。 你需要理解你正在使用的元素的语义。用一种错误的方式使用语义元素比保持中立更糟糕。 保持代码的简洁。忘记原来的XHTML习惯。 可访问性不应该是以后再想的事情。提高网站不需要你成为一个WCAG专家，你完全可以通过修复一些小问题，从而造成一个巨大的变化，例如：
当定义语言和字符编码是可选择的时候，总是建议在文档级别同时声明，即使它们在你的HTTP标头已经详细说明。比任何其他字符编码更偏爱UTF-8。 除非有正当理由才能在内容前加载脚本，不要阻塞页面的渲染。如果你的样式表很重，开头就孤立那些绝对需要得样式，并在一个单独的样式表中推迟二次声明的加载。两个HTTP请求显然比一个慢，但是感知速度是最重要的因素。 虽然分号在技术上是CSS一个分隔符，但应该始终把它作为一个终止符。 型盒子模型对于整个文档而言最好是相同的。全局性的* { box-sizing: border-box; }就非常不错，但是不要改变默认盒子模型的特定元素，如果可以避免的话。 不要更改元素的默认行为，如果可以避免的话。元素尽可能地保持在自然的文档流中。例如，删除图像下方的空格而不改变其默认显示：  同样，如果可以避免的话，不要关闭元素流。 在CSS中有许多定位元素的方法，但应该尽量限制以下属性/值。按优先顺序排列： 最小化紧密耦合到DOM的选择器。当选择器有多于3个结构伪类，后代或兄弟选择器的时候，考虑添加一个类到你想匹配的元素。  当你不需要的时候避免过载选择器。
不要让值和选择器难以覆盖。尽量少用id，并避免!important。
覆盖样式使得选择器和调试变得困难。如果可能的话，避免覆盖样式。
不要重复可以继承的样式声明。
保持代码的简洁。使用简写属性，没有必要的话，要避免使用多个属性。
英语表达优于数学公式。
果断地删除过时的浏览器引擎前缀。如果需要使用的话，可以在标准属性前插入它们。
视图转换优于动画。除了opacity 和transform，避免动画其他属性。
可以的话，使用无单位的值。如果使用相对单位，那就用rem 。秒优于毫秒。
如果你需要透明度，使用rgba。另外，始终使用十六进制格式。
当资源很容易用CSS复制的时候，避免HTTP请求。
不要使用Hacks。
可读性，正确性和可表达性优于性能。JavaScript基本上永远不会是你的性能瓶颈。图像压缩，网络接入和DOM重排来代替优化。如果从本文中你只能记住一个指导原则，那么毫无疑问就是这一条。
尽量保持函数纯洁。理论上，所有函数都不会产生副作用，不会使用外部数据，并且会返回新对象，而不是改变现有的对象。
尽可能地依赖本地方法。
如果强制有意义，那么就使用隐式强制。否则就应该避免强制。
不要使用循环，因为它们会强迫你使用可变对象。依靠array.prototype 方法。
如果不能避免，或使用array.prototype 方法滥用了，那就使用递归。
这里有一个通用的循环功能，可以让递归更容易使用。 忘记arguments 对象。余下的参数往往是一个更好的选择，这是因为： 你可以从它的命名中更好地了解函数需要什么样的参数 真实数组，更易于使用。
忘掉apply()。使用操作符。
当有更惯用的做法时，就不要用bind() 。
没有必要的话，就不要嵌套函数。
避免调用多重嵌套函数。使用合成函数来替代。
缓存功能测试，大数据结构和任何奢侈的操作。
const 优于let ，let 优于var。
IIFE 和return 语句优于if， else if，else和switch语句。
如果可以的话，避免for…in。
在对象有合法用例的情况下，map通常是一个更好，更强大的选择。
Curry虽然功能强大，但对于许多开发人员来说是一个外来的范式。不要滥用，因为其视情况而定的用例相当不寻常。
不要用看似聪明的伎俩混淆代码的意图。
不要害怕创建小型的，高度可组合的，可重复使用的函数。
最小化依赖性。第三方是你不知道的代码。不要只是因为几个可轻易复制的方法而加载整个库：
原文链接：http://www./article/full-frontend-guidelines.html |
|
|
