5 ms·

You can use document fragments for this and get a similar performance boost without resorting to string concatenation.

• gruseom 13y ago
  Do you mean SVG document fragments? Can you explain in more detail or point to an example?
  • spellboots 13y ago
    Here is an introduction. They are not SVG specific but you can build SVG elements in a document fragment, which is a lot faster than appending to the DOM, then append the fragment to the DOM all in one go. See http://ejohn.org/blog/dom-documentfragments/ http://ejohn.org/blog/dom-documentfragments/ or google for an introduction. Building strings and using innerHTML is a very ugly way to get performance, you should definitely try to using the document fragment approach as it has similar performance characteristics.
    • gruseom 13y ago
      So these are regular document fragments? I vaguely remember that we tried that and it didn't work nearly as well, but it's been a while. Building strings and using innerHTML is a very ugly Ah. Then you'll be dismayed to hear we use tables for layout as well :)
  • spellboots 13y ago
    In fact, using a document fragment is actually faster at least in some cases: http://jsperf.com/svg-fragment-test http://jsperf.com/svg-fragment-test
    • microcolonel 13y ago
      The naiive approach was fastest for this example, but that's probably because the document was so small.