Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>While other ansers focus on guessing whether your desire (parsing DOM without string manipulation) makes sense, I will dedicate this answer to the comparison of reasonable DOM parsing methods.</p> <p>For a fair comparison, I assume that we need the <code>&lt;body&gt;</code> element (as root container) for the parsed DOM. I have created a benchmark at <a href="http://jsperf.com/domparser-vs-innerhtml-vs-createhtmldocument" rel="nofollow">http://jsperf.com/domparser-vs-innerhtml-vs-createhtmldocument</a>.</p> <pre><code>var testString = '&lt;body&gt;' + Array(100001).join('&lt;div&gt;x&lt;/div&gt;') + '&lt;/body&gt;'; function test_innerHTML() { var b = document.createElement('body'); b.innerHTML = testString; return b; } function test_createHTMLDocument() { var d = document.implementation.createHTMLDocument(''); d.body.innerHTML = testString; return d.body; } function test_DOMParser() { return (new DOMParser).parseFromString(testString, 'text/html').body; } </code></pre> <p>The first method is your current one. It is wel-supported accross all browsers.<br> Even though the second method has the overhead of creating a full document, it has a big benefit over the first one: <strong>resources (images) are <em>not</em> loaded</strong>. The overhead of the document is marginal compared to the potential network traffic of the first one.</p> <p>The last method is -as of writing- only supported in Firefox 12+ (no problem, since you're writing a GreaseMonkey script), and is the specific tool for this job (with the same advantages of the previous method). As it name implies, it is a DOM parser.</p> <p>The <a href="http://jsperf.com/domparser-vs-innerhtml-vs-createhtmldocument" rel="nofollow">bench mark</a> shows that the original method is the fastest <sup>4.64 Ops/s</sup>, followed by the DOMParser method <sup>4.22 Ops/s</sup>. The slowest method is the <a href="https://developer.mozilla.org/en-US/docs/DOM/DOMImplementation.createHTMLDocument" rel="nofollow"><code>createHTMLDocument</code></a> method <sup>3.72 Ops/s</sup>. The differences are minimal though, so I definitely recommend the <a href="https://developer.mozilla.org/en-US/docs/DOM/DOMParser" rel="nofollow"><code>DOMParser</code></a> for the reasons stated earlier.</p> <hr> <p>I know that you're using <code>GM_xmlhttprequest</code> to fetch data. However, if you're able to use <code>XMLHttpRequest</code> instead, I suggest to give the following method a try: Instead of getting plain text as response, you can get <a href="https://developer.mozilla.org/en-US/docs/HTML_in_XMLHttpRequest" rel="nofollow">a document as a response</a>:</p> <pre><code>var xhr = new XMLHttpRequest(); xhr.open('GET', 'http://www.example.com/'); xhr.responseType = 'document'; xhr.onload = function() { var bodyElement = xhr.response.body; // xhr.response is a document object }; xhr.send(); </code></pre> <p>If Greasemonkey script is long active on a single page, you can still use this feature for other domains which do not support CORS: Insert an iframe in the document whose domain is equal to the other domain (eg <code>http://example.com/favicon.ico</code>), and use it as a proxy (activate the GM script for this page as well). The overhead of insering an iframe is significant, so this option is not viable for one-time requests. </p> <p>For same-origin requests, this option may be the best one (although not benchmarked, one can argue that returning a document directly instead of intermediate string manipulation offers performance benefits). Unlike the <code>DOMParser</code>+text/html method, the <code>responseType="document"</code> is supported by more browsers: Chrome 18+, Firefox 11+ and IE 10+.</p>
    singulars
    1. This table or related slice is empty.
    1. POHow to optimize string-to-DOM conversion?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USRob W
    1. USRob W
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POHow to optimize string-to-DOM conversion?
      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. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    1. COInteresting, I show a 200ms difference between `DOMParser` and `createElement`. The first mentioned takes about +/-422ms and the other one +/-642ms. Ironically, the very tests hosted there suggest a 3.11 Ops/s on the very method I used originally. I assume it didn't account for images.
      singulars
      1. PO
      1. USUser2121315
    2. CO@User2121315 I have added another method to my answer. Might be interesting for you, depending on your situation.
      singulars
      1. PO
      1. USRob W
    3. COI would like to thank you for introducing me to `DOMParser`, it is certainly better than the method I've been using. As for the `XMLHttpRequest`, I'm afraid I'm bound by CORS but the iframe solution sounds very hackish and perhaps outweighs the benefit of those 450ms.
      singulars
      1. PO
      1. USUser2121315
 

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