gl.createbuffer()返回null说明webgl上下文无效，需先检查gl是否为有效webglrenderingcontext，确认canvas已正确获取上下文且未丢失。
createBuffer 返回 null 怎么办
调用 gl.createBuffer() 后得到 null，基本可以断定 WebGL 上下文已丢失或尚未正确获取。常见于 canvas 没有绑定上下文、getContext("webgl") 返回 null 但没检查、或页面被挂起后恢复时上下文失效。
- 务必在调用前确认
gl是有效 WebGLRenderingContext：用if (!gl) { console.error("WebGL not available"); } - 创建 buffer 前不要依赖异步操作（如图片加载完成）——buffer 创建本身是同步的，但后续
bindBuffer和bufferData必须在有效上下文中执行 - 移动端或后台标签页可能触发上下文丢失，可监听
webglcontextlost事件，但createBuffer本身不会主动抛错，只会静默返回null
bufferData 传入 TypedArray 时长度/类型不匹配的典型表现
顶点数据必须用 Float32Array（最常用）、Uint16Array（索引缓冲）等 TypedArray 传入 gl.bufferData()。若传入普通数组（[1, 0, 0, 1, 1, 0]）或类型不符（如用 Int32Array 存浮点坐标），浏览器不会报错，但渲染结果错乱或完全黑屏。
- 顶点坐标、法线、UV 等属性一律用
Float32Array；索引（element array）可用Uint16Array（≤65535 个顶点）或Uint32Array（需开启OES_element_index_uint扩展） - 注意字节对齐：例如每个顶点含 3 个 float（x/y/z），共 12 字节，若数据长度不是 3 的倍数，
vertexAttribPointer步长设错会导致取值偏移 - 示例正确写法：
const positions = new Float32Array([0, 0, 0, 1, 0, 0, 0, 1, 0]);<br>gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);<br>gl.bufferData(gl.ARRAY_BUFFER, positions, gl.STATIC_DRAW);
STATIC_DRAW / DYNAMIC_DRAW / STREAM_DRAW 选错影响性能
第三个参数指定数据使用模式，它不改变 buffer 内容，但会提示驱动如何优化内存布局和传输策略。选错不会导致崩溃，但可能让 GPU 频繁重上传或缓存失效。
-
gl.STATIC_DRAW：数据创建后几乎不修改（如模型顶点）——这是绝大多数几何缓冲的首选 -
gl.DYNAMIC_DRAW：每帧都改（如粒子位置、蒙皮骨骼变换）——避免用STATIC_DRAW，否则驱动可能把 buffer 放进只读显存区，更新变慢 -
gl.STREAM_DRAW：单次使用即丢弃（如动态生成的 UI 几何）——极少用，现代驱动对此优化有限，通常用DYNAMIC_DRAW更稳妥
忘记 bindBuffer 就调用 bufferData 的后果
gl.bufferData() 总是作用于当前绑定到目标的 buffer（ARRAY_BUFFER 或 ELEMENT_ARRAY_BUFFER）。如果没先调用 gl.bindBuffer(gl.ARRAY_BUFFER, myBuffer)，数据会被写入上一次绑定的 buffer，甚至可能是默认的 0 号 buffer（无效）——此时无报错，但你的 buffer 仍是空的。
- 顺序不能颠倒：必须
createBuffer → bindBuffer → bufferData - 同一个 buffer 可重复绑定并调用
bufferData更新内容（如动画），但每次更新前仍需先bindBuffer - 调试技巧：用
gl.getParameter(gl.ARRAY_BUFFER_BINDING)查当前绑定的 buffer，返回null表示未绑定任何 buffer
createBuffer 范畴内，但紧邻其下游。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
