3 Replies Latest reply on Jan 18, 2019 4:05 PM by Richard Pineo

    Using Javascript API to Capture Elapsed Times When Refreshing

    Jeremy DeVoss



      I am integrating vizzes (sp?) into an external web application and one of the things I would like to capture is the time that elapses between when a filter is changed and when the viz becomes interactive again. I am currently using the "onFirstInteractive" create option callback to know when the viz has completed the initial load. However, I would also like to know when a viz refresh starts and ends because of a filter change.


      Using the FILTER_CHANGE event, I can listen for when the a filter has changed but as the documentation says, the viz might not be interactive yet when this event fires.


      Is there a way to get the elapsed time from when the filters have changed and when the viz is interactive again? Even not using the Javascript API?


      Thanks for any and all ideas or comments,

      Jeremy DeVoss


        • 1. Re: Using Javascript API to Capture Elapsed Times When Refreshing
          Russell Christopher

          Hey Jeremy -


          There really isn't a good way to try and instrument this on the client-side: onFirstInteractive gets fired once (and only once) per viz being rendered. So it'll already be too late to lean on this when applying filters because it'll already have fired when the viz was rendered in it's "virgin" state.


          You might be able to approach this by:


          • Getting into the system tables of Tableau Server
          • Monitoring network traffic TO the page and keying on a certain amount of "silence" meaning that the request completed successfully (example: Network Monitoring | PhantomJS)

          Either of these would take a LOT of effort to implement, though.

          Curious - what's the value in doing this for you?


          • 2. Re: Using Javascript API to Capture Elapsed Times When Refreshing
            Jeremy DeVoss

            Howdy Russell,


            The basic use case is that we want to capture the elapsed time a workbook refresh takes, the filters in play, the values of those filters, and report the information in Google Analytics so that we can measure workbook load total load times from the client perspective.


            After thinking about this problem a bit more, it would be enough for there to be events that are raised before a viz goes inactive because of a refresh and when it is interactive again. With these two events and the FILTER_CHANGE event, I could capture all of the things I would like to capture.


            Things get a bit sticky though because of the async nature of the event callbacks. Perhaps a better way to gather metrics/statics on the client side would be to have the JS integration library to expose a statics object that would gather/contain the the elapsed times to/from specific steps in the rendering pipe.


            If I can't capture this information on the client side, could I do that using logs or something (other than getting into the system tables for Tableau) on the server side?


            Thanks for your time,


            • 3. Re: Using Javascript API to Capture Elapsed Times When Refreshing
              Richard Pineo

              I know this is an old thread, but have there been any modifications or updates to the API that would facilitate this request? My situation is similar to what is described above. We have a web application with an embedded Tableau Viz in it. We are currently capturing metrics for other portions of the web site and it would be great to be able to capture timings and user behavior via the Tableau JS API.


              I searched through the API documentation and didn't see anything that would fit the bill but it's quite possible I missed something. Ideally we would like to track an event every time the user interacts with the visualization and how long that interaction took before the Viz was responsive again as we have performance issues that we'd like to track and identify.


              Ideal state would be an event sourced by the API that has something like the following properties:  (or functions to retrieve these values)


                actionName: string,   // E.g. 'filer_change' or 'mark_selection'

                elapsed: number,      // ms elapsed before the viz is interactive again

                actionTarget: string   // more details about the action e.g. which filter was modified




              Richard P