Search code examples
jqueryflashdatatablestabletools

Why is tableTools making multiple calls to the same SWF file?


I happened to notice in my application that the copy_csv_xls_pdf.swf is getting called three times when datatables/tabletools are invoked. I put together a jsfiddle which (sometimes) illustrates the issue:

Multiple calls to the same file

The same behavior can be observed from the TableTools documentation: Even from the official documentation

This behaviour is particularly problematic because the intial load of the file doesn't seem to be cached by the browser for the subsequent loads during that same request.

There seems to be a request to this file for each button that is "powered" by the SWF.

Still, why is this file getting loaded multiple times? Is it necessary? How can it be prevented (while still providing the same functionality)?

Ignore the following unnecessary code....


...which is only provided so that SO will allow me to include the link to the jsfiddle:

$('#browser_data').dataTable({
    "bPaginate": false,
    "bAutoWidth": false,
    "bLengthChange": false,
    "sDom": "<'row-fluid'<'span6'f><'span6'<'pull-right'T>>r>t",
    "oTableTools": {
        "aButtons": [ "copy", "xls", "pdf" ],
        "sSwfPath": "http://datatables.net/release-datatables/extras/TableTools/media/swf/copy_csv_xls_pdf.swf"
    }
});

Solution

  • Google Chrome

    Here is a snippet of the request headers -- the headers are the same whether I hard-refresh or just refresh:

    :host:datatables.net
    :method:GET
    :path:/release-datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf
    :scheme:https
    :version:HTTP/1.1
    accept:*/*
    accept-encoding:gzip, deflate, sdch
    accept-language:en-US,en;q=0.8,sw;q=0.6
    cache-control:no-cache
    cookie:
    

    Do you see cache-control:no-cache? This seems to suggest that caching is explicitly turned off when making these requests. Every refresh shows status 200 for each request ... never do I see 304.

    And as far as the 304 statuses in your screenshot are concerned it's important that they are 304, 304, 304 and not 200, 304, 304. This would suggest that each request is unique in some way other than URL-wise and therefore each has to be explicitly cached. Let's see if that's a correct hypothesis ....

    Mozilla Firefox

    Here is the procedure I followed to run some tests:

    • set caching very on by setting cache limit to .34GB
    • loaded the pages: and refreshed and noted results
    • reproduced results by hard-refreshing followed by a refresh

    Here are the results -- one status for each button:

    • Initial Loading Statuses: 200, 200, 200, 200
    • Refresh: 304, 304, 304, 304
    • Hard Refresh: 200, 200, 200, 200
    • Refresh after Hard Refresh: 304, 304, 304, 304

    Considering the buttons are not exactly the same, even though the .swf URL is the same, wouldn't this make perfect sense? The same URL giving rise to a different button each time! Could there be some sort of signature to differentiate the requests for each button? This is the behavior of dynamic content -- same URL different content.

    One final test:

    I turned off caching -- set cache limit to 0 and the results are:

    • Hard Refresh: 200, 200, 200, 200
    • Refresh: 200, 304, 200, 200

    Conclusions

    1. Each button content is cached. That's why even when there's enough disc space allotted to caching initial page load and hard refreshes show 200, 200, 200, 200 and not 200, 304, 304, 304.
    2. Whether these buttons would be cached is a function of your browser settings: if caching is on and how much space is allotted to caching.
    3. Quite likely 200, 304, 200, 200 may suggest that there was not enough disc space to cache Copy button, but was just what CSV button needed, and there was nothing left to cache Excel and PDF buttons.