HTML、JavaScript和GLSL编码规范
HTML编码规范
始终将文档类型声明为文档中的第一行:
<!doctype html>
使用小写元素名称:
<p>, <div>
关闭所有的元素:
<p> ... </p>
关闭空元素:
<br />
使用小写属性名:
<div class="...">
用引号引用所有的属性值:
<div class="...">
不要在等号旁使用空格:
<div class="...">
尽量一行不要超过80个字符
为了可读性,添加空行来分隔大型或逻辑代码块
为了可读性,使用2个空格的缩进。不要使用制表符(tab)
总是包含一个<html>, <head> 和 <body> 标签
总是包含语言、编码和 <title>:
为复杂逻辑部分添加注释:
<!-- This is a comment -->
使用简单语法链接样式表:
<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);
右大括号与原始语句位于同一缩进处:
命名规范
构造器以大写字母开头。
方法/函数以小写字母开头。
方法/函数应使用camel case。thisIsAnExample
变量应始终在单词之间使用下划线。this_is_an_example
适当时,在名称中包含变量类型。value_list
元素id和类名应始终在单词之间使用下划线。
私有方法应使用前导下划线将它们与公共方法分开。
名称中不应使用缩写。
分配名称时不应使用复数。
评论应该合理使用。
使用YUIDoc的规则来给函数添加注释。
GLSL编码规范
避免使用All-in-one着色器代码,根据需要编写单独的着色器代码
将webgl版本号放在每个着色器的顶部 #version 103


最新评论
- 相关文章
微信公众号在线生成二维码带参数怎么搞?
带参数二维码是微信公众号渠道二维码的一种实现
微信的带参数二维码有两种,一种是临时二维码,一种是永久二维码,但是永久二维码的生成是有个数限制的,微...WebGL场景中多相机拍摄的原理和意义
一般而言,3D场景的渲染只需要一个相机,不过借助多相机可以获取一些单相机无法达到的特效。比如突显特定对象并模糊背景。
3D相机渲染的基本原理是依靠颜色...HTML5 And Canvas 2D Specs Are Now Feature Complete, First HTML 5.1 Working Draft Published
We’ve been writing about HTML5 for quite a while, but, until today, the actual HTML5 specs and standards were still moving targets. Now, however, the...
如何使用BabylonJS加载OBJ或STL模型
BabylonJS(也就是babylon.js,这是一个和three.js类似的WebGL开发框架),更多的用在游戏领域。
本文说明和演示如何使用babylon.js来加载一个标准3d模型文...如何使用CSS3合成模式(blend-mode)和滤镜(filter)实现彩色蜡笔(时光机)照片特效
在之前的文章中我们已经详细讲解过CSS3滤镜(filter,也可称之为过滤器)的工作方式,本文将实现一个当下流行的时光机相片特效实例来说明其实际用途。
我们...HTML5动画背后的数学2 - 仿生智能算法综述
HTTP1.1协议现状、问题和解决方案
HTTP的现状最早的HTTP协议非常简单,只能用来传送文本,方法也只有GET,后来逐步发展到1.1,能够支持多种MIME格式数据(如文本、文件),支持GET,POST,HEAD,OPTI...
计算WebGL中的uniforms变量使用数
在使用Three.js为人体模型加载皮肤材料时,启用了skinning:true的参数。有时候会导致GL编译错误,提示“too many uniforms”。下面的文章有助于理解错误原因和检...
CSS3图片混合(Blend)效果及其参考计算公式一览表
在Photoshop软件中,混合是将两个图层的色彩值进行合成,从而创造出大量的效果。在这些效果的背后实际是一些简单的数学公式在起作用。下面所介绍的公式仅适用于R...
WebGL入门教程2 - GPU基本概念和工作流水线(渲染管道)
如何使用CSS3实现一个平滑的3D文本标题
要实现3D文本,基本上有3种方法:1. 使用CSS3的投影滤镜(filter: drop-shadow)2. 使用3d建模和CSS3 3d变换来实现(最真实)3. 使用CSS3 text-shadow属性来实现...
在PHP网页程序中执行Sass/Compass命令
我们需要在wow云开发平台支持sass/compass等预编译样式语言,为此我们首先尝试了scssphp扩展,但是在支持最新语法上,经常会出现异常。所以我们采用了代理的方式...
更多...