HTML、JavaScript和GLSL编码规范

techbrood 发表于 2019-09-23 17:52:23

- +

HTML编码规范

始终将文档类型声明为文档中的第一行: <!doctype html>
使用小写元素名称: <p>, <div>
关闭所有的元素: <p> ... </p>
关闭空元素: <br />
使用小写属性名: <div class="...">
用引号引用所有的属性值: <div class="...">
不要在等号旁使用空格: <div class="...">
尽量一行不要超过80个字符
为了可读性，添加空行来分隔大型或逻辑代码块
为了可读性，使用2个空格的缩进。不要使用制表符（tab）
总是包含一个<html>, <head> 和 <body> 标签

总是包含语言、编码和 <title>:

<!doctype html> 
<html lang="en-US"> 
<head>   
  <meta charset="UTF-8">   
  <title>HTML5 Syntax and Coding Style</title> 
</head>

为复杂逻辑部分添加注释: 
使用简单语法链接样式表: <link rel="stylesheet" href="styles.css">
使用简单语法加载外部脚本: <script src="myscript.js">
在html中使用与javascript相同的命名约定
始终使用小写文件名
使用一致的文件扩展名: .html, .css, .js, .frag, .vert, .fbx, .glb

Javascript编码规范

总是包含 "use strict"; 语句，来强制变量声明
尽可能避免全局变量，如需要定义全局变量，建议使用小写字母 g 开头的变量名
使用JSLint来检查语法错误
为了可读性，添加空行来分隔大型或逻辑代码块
为了可读性，使用2个空格的缩进。不要使用制表符（tab）
在适当的情况下对条件语句使用速记: var results = (test === 5) ? alert(1) : alert(2);
右大括号与原始语句位于同一缩进处:

function func() {
  return {
    "name": "Batman"
  };
}

命名规范

构造器以大写字母开头。
方法/函数以小写字母开头。
方法/函数应使用camel case。thisIsAnExample
变量应始终在单词之间使用下划线。this_is_an_example
适当时，在名称中包含变量类型。value_list
元素id和类名应始终在单词之间使用下划线。
私有方法应使用前导下划线将它们与公共方法分开。
名称中不应使用缩写。
分配名称时不应使用复数。
评论应该合理使用。
使用YUIDoc的规则来给函数添加注释。

/**
 * Reverse a string
 *
 * @param  {String} input_string String to reverse
 * @return {String} The reversed string
 */
function reverseString(input_string) {
  // ...
  return output_string;
};

GLSL编码规范

避免使用All-in-one着色器代码，根据需要编写单独的着色器代码
将webgl版本号放在每个着色器的顶部 #version 103

(12)

3689

私信收藏

发送私信

发送

HTML、JavaScript和GLSL编码规范

HTML编码规范

Javascript编码规范

GLSL编码规范

增强现实引擎ARToolKit工作原理简介

CSS3原生变量（Native Variables）新特性简介

使用CSS3 box-decoration-break特性实现多行文本样式

Web界面编程状态变化和JS开发框架（React/Angular/Ember）

使用HTML5 FileReader和Canvas压缩用户上传的图片

计算WebGL中的uniforms变量使用数

Blender2.7 快捷键一览表

WebGL入门教程4 - 使用纹理贴图（Texture Map）

浏览器控制台报JS脚本执行错误：Module is not defined

使用Canvas绘制完美的不完美圆形

Three.js 开发基础知识 - 绘制3D对象

如何使用CSS3实现一个平滑的3D文本标题

使用纯CSS3实现一个3D旋转的书本

div 、section 、article的区别和使用场景