<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
  </head>
  <body bgcolor="#ffffff" text="#000000">
    On 11/23/2010 6:46 PM, Robert O'Callahan wrote:
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">On Wed, Nov 24, 2010 at 3:30 PM, Charles Pritchard <span
        dir="ltr"><<a moz-do-not-send="true"
          href="mailto:chuck@jumis.com">chuck@jumis.com</a>></span>
      wrote:<br>
      <div class="gmail_quote">
        <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
          0.8ex; border-left: 1px solid rgb(204, 204, 204);
          padding-left: 1ex;">
            SVG is a document format. It is not reliably implemented.
          It's far more expensive to implement SVG on a new environment
          than Canvas.<br>
        </blockquote>
        <div><br>
          So? You don't have to implement it.<br>
        </div>
      </div>
    </blockquote>
    Google, Microsoft, Apple, do, have to implement it.<br>
    <br>
    As an app designer, my app should work on ~ four different browsers.
    I need my app to work, with what's out there in practice.<br>
    <br>
    And for other environments, I would have to. I've implemented for
    JVM, Active X (thanks Vlad/Mozilla), Flash and .Net.<br>
    <br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
          0.8ex; border-left: 1px solid rgb(204, 204, 204);
          padding-left: 1ex;">
          I can't do much for you here other than explain to you what
          I'm hearing.<br>
          a) Why are you using our Canvas implementation instead of our
          SVG implementation.<br>
          b) Why are you using ctx.fillText('Test') instead of
          element.appendChild(document.createElement('text')).textContent
          = 'Test'.<br>
          <br>
          For answers<br>
          a: I'm using it because I work across a variety of browser
          platforms. Canvas is far better supported.<br>
        </blockquote>
        <div><br>
          It doesn't make sense to request entirely new features (that
          by definition aren't currently supported) because existing
          features aren't widely supported.<br>
          <br>
        </div>
      </div>
    </blockquote>
    It's currently supported by Microsoft, and to a lesser extent,
    WebKit. It's not features, it's one feature.<br>
    And as you pointed out, it may be supported in FF4; though it's
    behavior is not standardized.<br>
    <br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <div>Anyway, I'm not sure why you think <canvas> is far
          better supported than SVG. What browser supports
          <canvas> but not SVG?<br>
        </div>
      </div>
    </blockquote>
    AFAIK, FF is the only to support SVG FE.<br>
    <br>
    SVG is a large spec, even SVG Tiny is unevenly implemented.<br>
    <br>
    WebKit had terribly slow SVG support; IEs was non-existent, though
    it was a reasonable task to bring canvas in. I can barely do a nice
    thing in SVG on the iPhone. It takes 20 seconds to load a rendering
    that takes less than one in canvas. These are the reasons why I
    think canvas is better supported. Further, when there are holes,
    it's easier to work around them in Canvas than SVG.<br>
    <br>
    One gaping hole in SVG is repeated elements. I can not reasonably
    implement InkML rendering in SVG. I need David Dailey's replicate
    tag to do it with any real performance:<br>
    <a
href="http://srufaculty.sru.edu/david.dailey/svg/SVGOpen2010/replicate.htm">http://srufaculty.sru.edu/david.dailey/svg/SVGOpen2010/replicate.htm</a><br>
    <br>
    In many ways, SVG has some of the same shortcomings as VML.<br>
    <br>
    When it comes to the canvas standard, there are a few holes, no
    doubt, but they are minor. There are some globalCompositionModes
    that aren't touchable, text support needs a backup library for
    legacy clients, shadow isn't a reliable module. That's what I work
    with.<br>
    <br>
    Again, I don't see SVG/Canvas as at all exclusive. One is high
    level, one is low level, and the high level work takes quite a bit
    of work.<br>
    <br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
          0.8ex; border-left: 1px solid rgb(204, 204, 204);
          padding-left: 1ex;">
          <div class="im">
            <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
              0.8ex; border-left: 1px solid rgb(204, 204, 204);
              padding-left: 1ex;">
              <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
                0.8ex; border-left: 1px solid rgb(204, 204, 204);
                padding-left: 1ex;">    <br>
              </blockquote>
              Sure, but there are plenty of canvas uses that aren't
              animating all the<br>
              time (I've seen image editing apps, sites that use canvas
              as their<br>
              _input_, not their output, etc).<br>
                <br>
            </blockquote>
          </div>
          1. Name one.</blockquote>
        <div><br>
          <a moz-do-not-send="true" href="http://arewefastyet.com">http://arewefastyet.com</a><br>
        </div>
      </div>
    </blockquote>
    Uses a second canvas layer for animation.<br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <div><a moz-do-not-send="true"
            href="http://www.simile-widgets.org/timeplot/">http://www.simile-widgets.org/timeplot/</a><br>
        </div>
      </div>
    </blockquote>
    I don't know what was meant by "sites use canvas as their _input_,
    not their output", but anyway, it does fit the challenge.<br>
    Here's a case where no Canvas animation happens. The state is
    retained, but all the repainting is done by either clicking a link
    to go to a new page, or by abusing HTML DIVs.<br>
    <br>
    It has inefficient use of DOM+HTML. The doc is a lot heavier than it
    needs to be. For their code setup, SVG is a better use case. They do
    support VML. They're only using Canvas to draw lines, likely for
    compatibility reasons. Thus the VML hooks.<br>
    <br>
    They do keep a state, and setup to plot live data. They don't use
    it, they have separate links instead. Turning their "Live Examples"
    links into a select element would have made good sense.<br>
    <br>
    Here's a better implementation of a time plot. Hold shift to
    click+drag.<br>
    <a class="moz-txt-link-freetext" href="http://timepedia.org/chronoscope/">http://timepedia.org/chronoscope/</a><br>
    <br>
    Anyway, I agree, you've named an example.<br>
    <br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <div><a moz-do-not-send="true"
            href="http://jwf.us/blog_apps/mandelbrot_canvas/">http://jwf.us/blog_apps/mandelbrot_canvas/</a><br>
        </div>
      </div>
    </blockquote>
    Re-draw button, right there. State vars in private zoom variable. It
    outputs to Canvas.<br>
    <br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
          0.8ex; border-left: 1px solid rgb(204, 204, 204);
          padding-left: 1ex;">Robert's suggestion would radically alter
          the existing functionality of canvas</blockquote>
        <div><br>
          Only in a way that maintains compatibility with existing
          content. Otherwise I wouldn't have suggested it.<br>
        </div>
      </div>
    </blockquote>
    Existing apps targeting mobile devices (android/iphone) and scaling
    for those devices with the pixel ratio / dpi density variables would
    be broken. It violates a clearly defined separation of roles with
    CSS and Canvas.<br>
    <br>
    <blockquote
      cite="mid:AANLkTi=YC52P+Ap27rq8U5x_+dF0xyKoQGUwuULCgsy8@mail.gmail.com"
      type="cite">
      <div class="gmail_quote">
        <blockquote class="gmail_quote" style="margin: 0pt 0pt 0pt
          0.8ex; border-left: 1px solid rgb(204, 204, 204);
          padding-left: 1ex;">
          and require a whole lot of work from other vendors.<br>
        </blockquote>
        <div><br>
          Not really. <br>
        </div>
      </div>
    </blockquote>
    Implement it as an extension, let us know how much time was
    involved. It may help other vendors budget their resources.<br>
    <br>
    I'm very uncomfortable with it being used as the standard behavior
    for the existing HTML Canvas element.<br>
    <br>
    <br>
    -Charles<br>
  </body>
</html>