Mặc định WebGL xóa drawing buffer (color, depth, stencil) trước mỗi frame vẽ mới. Để giữ nội dung frame trước (ví dụ vẽ tích lũy, paint app), bật preserveDrawingBuffer: true khi tạo context.
Cách bật
var canvas = document.getElementById('mycanvas');
var gl = canvas.getContext('webgl', { preserveDrawingBuffer: true });
Tác động
- Mặc định (false): Buffer bị xóa đầu mỗi frame → hiệu năng tốt, tiết kiệm bộ nhớ GPU.
- Bật (true): Buffer giữ nguyên → có thể vẽ tích lũy, đọc pixel bằng
readPixels()sau khi vẽ, chụp ảnh canvas (toDataURL()) đúng nội dung.
Lưu ý
- Bật
preserveDrawingBuffercó thể giảm hiệu năng (GPU phải giữ buffer, không tối ưu được). - Chỉ bật khi thực sự cần: paint app, screenshot, đọc pixel sau render.
- Nếu chỉ cần screenshot, có thể vẽ lên offscreen canvas rồi copy.
Mã trong bài gốc có lỗi: mycanvas.clearColor không tồn tại, đúng là gl.clearColor; mycanvas.clear đúng là gl.clear(gl.COLOR_BUFFER_BIT).