Hiệu suất trò chơi canvas HTML5 so với các lựa chọn thay thế

Question

Tôi bắt đầu phát triển trên trò chơi HTML5 bằng canvas. Mọi thứ vẫn ổn cho đến nay, nhưng tôi có một số điều tôi hơi bối rối, chủ yếu là phải làm với hiệu suất của trò chơi như vậy. Vì vậy, thay vì tôi chạy vào một loạt các vấn đề sâu xuống quá trình phát triển, tôi sẽ biết ơn để tìm hiểu ngay bây giờ.

Trước đây tôi đã từng làm việc bằng các ngôn ngữ như OpenGL và hiểu được tầm quan trọng của việc hiển thị thứ tự hiệu quả, đây là thứ có thể mang lại hiệu suất cao hơn hàng trăm lần. ra giữa các kết cấu/shaders vv Đây có phải là điều tôi nên lưu ý với một trò chơi canvas, hoặc những thứ sẽ tự động được xếp hàng và kết xuất theo một thứ tự hiệu quả?

Nó sẽ là một trò chơi 2D, nhưng với một vài đối tượng trên màn hình, và hầu hết trong số chúng đều bị bão hòa và thay đổi độ sáng động (bộ lọc). Việc thực hiện có phải là một vấn đề nghiêm trọng không?

Các giải pháp thay thế, bất kỳ công cụ trò chơi javascript nào có thể giúp hiệu suất? Tôi có muốn tăng hiệu suất bằng cách chuyển sang WebGL mặc dù canvas chuẩn có tăng tốc phần cứng không?

Answer 1

Có, bạn sẽ nhận được tăng hiệu suất lớn với WebGL. Cân nhắc sử dụng hệ thống hiển thị 2D tuyệt vời được gọi là Pixi. Nó hiển thị sprites cho WebGL với một dự phòng cho Canvas.

Hoặc, bạn có thể thực hiện ở mức độ thấp hệ thống render WebGL sprite của riêng bạn sử dụng game-shell và gl-modules. gl-now là một điểm vào tốt vào các mô-đun này. Bạn có thể sử dụng chúng để xây dựng công cụ trò chơi của riêng bạn.

Phaser, là một công cụ trò chơi HTML5 hoàn chỉnh hiện có rất nhiều lực kéo và sử dụng Pixi dưới mui xe để hiển thị. Một nơi tốt hơn Stackoverflow để tìm kiếm trợ giúp về tất cả các vấn đề này là http://www.html5gamedevs.com.