Thanks again. Directly drawing text on a canvas using HTML5 is an option I hadn't properly considered. And of course moving divs around is faster than redrawing on canvas.
Does anyone know how svg would fit into all this? Would it be faster to move an svg character than a div? I assume it would be faster than repainting it on the canvas. Luckily all these options are available to me because my management has the cahones to only support IE9 and higher. On Fri, Jan 31, 2014 at 8:35 AM, Jukka Jylänki <[email protected]> wrote: > I think the traditional non-GPU HTML/JS solution for games has been to > create a "CSS DOM Renderer", which is a JS API that creates <div>s with > absolute positioning on text draw calls, which utilizes the DOM to draw > text. This API is of course declarative in nature, instead of > immediate/imperative, which can be a good or bad thing depending on what > the existing app expects. I could not find a tutorial for that with brief > googling, but there's a similar text on CSS DOM sprite rendering at > http://buildnewgames.com/dom-sprites/ , which is closely resembling > thing. The performance is apparently tricky to get right, since it depends > on avoiding full repaints of the whole page on the text operations. > > Another way is to use HTML5 <canvas> text rendering features which Alon > mentioned already: > https://developer.mozilla.org/en-US/docs/Drawing_text_using_a_canvaswhich is > probably a bit saner approach. I think that should work on IE10 as > well (?) > > Jukka > > > > 2014-01-30 Mark Hahn <[email protected]>: > > > you can compile FreeType >> >> Thanks, I found a demo for this. The big problem is that freetype js is >> 1.8 mbytes. >> >> I'm considering SVG as a solution also since I could draw one character >> at a time. >> >> >> On Wed, Jan 29, 2014 at 5:07 PM, Alon Zakai <[email protected]> wrote: >> >>> If you need pixel-perfect text tendering you can compile FreeType or >>> such and use that. That will render pixels which you then copy to where you >>> want. >>> >>> Or, you can use the browser's text rendering capabilities on a canvas, >>> but it will differ based on font, browser, os, etc. >>> >>> - Alon >>> >>> >>> >>> On Wed, Jan 29, 2014 at 2:36 PM, Mark Hahn <[email protected]> wrote: >>> >>>> I am going to use emscripten to port a text pagination application to >>>> the browser. This is an engine that displays text in a page with precise >>>> and complex line-wrap and pagination rules. It uses the metric of a font >>>> and calls an API to render the font. >>>> >>>> Compiling the engine to asm.js should be easy but I'll have to >>>> implement the text rendering function myself. I don't know how to do this. >>>> >>>> I looked at the SDL api and I see no mention of text. I can't use >>>> webgl because I need IE support. I don't see how I could use html/css >>>> because each character must be placed accurately. >>>> >>>> Any ideas would be greatly appreciated ... >>>> >>>> -- >>>> You received this message because you are subscribed to the Google >>>> Groups "emscripten-discuss" group. >>>> To unsubscribe from this group and stop receiving emails from it, send >>>> an email to [email protected]. >>>> For more options, visit https://groups.google.com/groups/opt_out. >>>> >>> >>> -- >>> You received this message because you are subscribed to the Google >>> Groups "emscripten-discuss" group. >>> To unsubscribe from this group and stop receiving emails from it, send >>> an email to [email protected]. >>> For more options, visit https://groups.google.com/groups/opt_out. >>> >> >> -- >> You received this message because you are subscribed to the Google Groups >> "emscripten-discuss" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected]. >> For more options, visit https://groups.google.com/groups/opt_out. >> > > -- > You received this message because you are subscribed to the Google Groups > "emscripten-discuss" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > For more options, visit https://groups.google.com/groups/opt_out. > -- You received this message because you are subscribed to the Google Groups "emscripten-discuss" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. For more options, visit https://groups.google.com/groups/opt_out.
