Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I had a go at this in <a href="http://jsfiddle.net/4vjY6/15/" rel="nofollow">this jsFiddle</a>. Replacing a chunk of content is fastest when using DOM methods, but setting <code>innerHTML</code> isn't cripplingly slower and probably acceptable if your templates aren't very complex and you won't lose too much time in the string manipulation. (This isn't very surprising, "dealing with broken HTML quickly" is kind of what browsers are supposed to do and <code>innerHTML</code> is an ancient and popular property that probably had lots of optimisation go into it.) Adding another join() step in the innerHTML method also didn't really slow it down.</p> <p>Conversely, using <code>jQuery.tmpl()</code> /and/ the DOM fragment method was orders of magnitude slower in Chrome on Mac. Either I'm doing something wrong in the <code>dom_tmpl</code> function, or deep-cloning DOM nodes is inherently slow.</p> <p>I commented out the append tests because they froze up the tab process when you run the whole suite - thousands through tens of thousands of nodes shoved into a document probably confuse Chrome somehow. Appending with innerHTML alone ended up glacially slow because the string ends up being really huge.</p> <p>The conclusion would seem to be: unless done stupidly or on very large strings, concatenating strings in a templating library likely <strong>isn't going to be what makes it slow</strong>, while trying to be clever with cloning chunks of the DOM will. Also, <code>jQuery.tmpl()</code> handled 2000-ish ops/sec on my computer, and 500-ish on my iPhone 4, this is likely "fast enough" if you're targetting these platforms. It was also in the same ballpark as the DOM fragment function making the latter largely pointless.</p> <p>If you mostly need to replace the content of existing nodes and your templates aren't very large, use Underscore.js's templating and <code>innerHTML</code>. Underscore.js seems to do ten passes through the whole string, so if your templates /are/ large this could be an issue. </p> <p>If you need to append to existing nodes, you can avoid serialising and reparsing the existing content by creating a wrapper element, seting its <code>innerHTML</code>, then append the wrapper element to the target node. </p> <p>If you <em>really</em> want speed or your templates are crazy large, you'll probably have to do something like having a server-side script precompile your templates into Javascript that creates the respective nodes. </p> <p>(Disclaimer: I don't claim to be any good at constructing test cases and benchmarks and only tested this in WebKit, you should tailor this to your use case and get a more relevant set of numbers.)</p> <p><strong>Update:</strong> I <a href="http://jsfiddle.net/4vjY6/17/" rel="nofollow">updated my jsFiddle benchmark</a> to not use any jQuery features, in case its presence (user data on nodes etc.) was the cause of DOM node cloning being slow. Didn't help much.</p>
    singulars
    1. This table or related slice is empty.
    1. POAny JavaScript templating library/system/engine/technique that returns a DOM fragment?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USmillimoose
    1. USmillimoose
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POAny JavaScript templating library/system/engine/technique that returns a DOM fragment?
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    1. COI re-factored the benchmark. Check it out [here](http://jsperf.com/appendchild-or-innerhtml). Now it isn't freezing the browser.
      singulars
      1. PO
      1. USAalex Gabi
    2. COAs you said I want to pre-compile templates on server side. So I need to save those compiled templates. The problem with jQuery is that it's compiling in jQuery dependent templates.
      singulars
      1. PO
      1. USAalex Gabi
    3. COThe jQuery plugin is really slow anyway. As I said (somewhere in that wall of tl;dr), if you are willing to roll a solution that generates straightforward DOM-manipulating code, that will give you by far the best performance. It's just a lot of extra work compared to just joining up strings, which is plenty fast.
      singulars
      1. PO
      1. USmillimoose
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload