2d engine with WebGL

Posted by Philipp on Game Development See other posts from Game Development or by Philipp
Published on 2012-11-24T12:51:56Z Indexed on 2012/11/24 17:19 UTC
Read the original article Hit count: 137

Filed under:

html5

|

webgl

I am currently developing a HTML5 canvas game with a sprite-based 2d engine.

The engine is working well so far, but now I thought that I could maybe add some cool graphic effects when I would re-implement the whole engine with WebGL. The whole graphic engine would stay strictly two-dimensional (think of it as a 3d world where the z coordinate of all vertices is 0.0).

What I hope to gain from this is the ability to use pixel shaders to create special effects. I also think that the performance could improve.

What do you think about that plan?

© Game Development or respective owner

Related posts about html5

Is there a HTML5 Validator plugin for Firefox?

as seen on Super User - Search for 'Super User'
Is there a plugin for firefox to validate HTML 5? I've always used this but if my webpage has a <!DOCTYPE HTML> doctype it complains about it not having a doctype at all. >>> More
HTML5 video tag in chrome - wmv

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi Al, I need to make a page which displays a video. Firefox and and Opera support the OGG format, no problem there. Chrome is ... "stupid" and does not recognize OGG. Does Chrome on Windows know how to handle WMV? I already have them encoded, and no I cannot recode new videos since the media is… >>> More
HTML5 cache manifest: whitelisting ALL remote resources?

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm doing an iPhone version of a desktop site that includes a blog. The blog often embeds images from other domains (the image URLs always start with http:// in this case, obviously), but because I'm using cache-manifest, these images don't load because they aren't declared in the manifest file. I… >>> More
Learning HTML5 - Sample Sites

as seen on Geeks with Blogs - Search for 'Geeks with Blogs'
Part of the challenge with HTML5 is understanding the range of different technologies and finding good samples. The following are some of the sites I have found most useful. IE TestDrive http://ie.microsoft.com/testdrive/ A good set of demos using touch, appcache, IndexDB, etc… >>> More
Online video tutorials for HTML 5

as seen on Geeks with Blogs - Search for 'Geeks with Blogs'
Here are some of the best introductory HTML5 videos I have found online/for free. Mix 2011: HTML5 for Skeptics - Scott Stansfield channel9.msdn.com/Events/MIX/MIX11/EXT21 Filling the HTML5 Gaps with Polyfills and Shims - Ray Bango channel9.msdn.com/Events/MIX/MIX11/HTM04 50 Performance… >>> More

Related posts about webgl

Is there a 2d sprite library for webgl?

as seen on Stack Overflow - Search for 'Stack Overflow'
I am looking to build a 2d game using WebGL. I want the hardware acceleration that WebGL provides and I cannot get this from the 2D canvas context in the canvas tag. With that said, is there a tutorial on creating 2D sprites using webGL? Or, better yet, is there a 2D sprite library for WebGL? … >>> More
How do I enable WebGL sites with Firefox 4 Beta?

as seen on Ask Ubuntu - Search for 'Ask Ubuntu'
I am using Firefox 4.0b12 from the Mozilla Team's "Firefox Next" PPA. My about:config has webgl.enabled_for_all_sites set to true as most guides recommend that and also say that is all that is needed. It doesn't work for me. The main Mozilla Demos page ("Web O' Wonder") gives me: Unfortunately… >>> More
How can I reduce draw calls when using glBufferSubData and DYNAMIC_DRAW?

as seen on Game Development - Search for 'Game Development'
At first I had the problem where I had about 150 rectangles rendered every tick. I only used STATIC_DRAW and glBufferData. I added support for DYNAMIC_DRAW and glBufferSubData and now I have a very good result... but the number of draw calls (glDrawArrays) is the same. Best practices from Mozilla… >>> More
High CPU Usage with WebGL?

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm checking out the nightly builds of Firefox and Chromium with support of WebGL with a few demos and tutorials and I can't help but wonder about the extremely high CPU load they cause. A simple demo like this one runs at a sustained 60% of my dual core. The large version of this one maxes out the… >>> More
Render text on canvas using WebGL

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I want to render some text on a canvas using WebGL, which API of WebGL should be used? Note: "text" can be either plain text or HTML snippet with CSS style >>> More