Query Tool Slow to Load

To Dave and maintainers,

Here's when the click event handler triggers,
[image: Query open.jpg]
Here is the first loading screen,
[image: query loading.jpg]
It takes 3.8 - 1.5 = 2.3s for the loading screen to show up.

Here's when the query tool is ready to use,
[image: Query close.jpg]

It takes 4.7s - 1.5s = 3.2s total for the query tool to be ready since
click, 0.9s for UI instantiation.

So, I looked at what is causing the delay, there is an ajax request to
initialize_datagrid that takes 2s to complete. It's primary job is to
return a transaction id under the key `gridTransId` after making the
connection to the database. Obviously, dns, ssl, and password
authentication to a remote database is going to incur delays. There is
nothing that can be done to prevent that. BUT, there is no need to delay
the loading of the query editor till the transaction id is received.

this.on('pgadmin-datagrid:transaction:created', function(trans_obj) {
this.launch_grid(trans_obj);
});

^ This is where the delay happens. I suggest launching the grid instantly
behind the $spinner_el and remove the $spinner_el when the transaction id
is recieved and set via self.

There are two primary hindrances to doing this, one being the transaction
id being used as a url param in new tab mode,

var url_params = {
'trans_id': trans_obj.gridTransId, // <<---- HERE
'is_query_tool': trans_obj.is_query_tool,
'editor_title': titileForURLObj.title,
},
baseUrl = url_for('datagrid.panel', url_params) +
'?' + 'query_url=' + encodeURI(trans_obj.sURL) +
'&server_type=' + encodeURIComponent(trans_obj.server_type) +
'&server_ver=' + trans_obj.serverVersion+
'&fslashes=' + titileForURLObj.slashLocations;

The other being this close handler,

queryToolPanel.on(wcDocker.EVENT.CLOSED, function() {
$.ajax({
url: url_for('datagrid.close', {'trans_id': trans_obj.gridTransId}), //
<<---- and HERE
method: 'DELETE',
});
});

Looking at the python server, this id is nothing but a random number
between 1 and 9999999,
# Create a unique id for the transaction
trans_id = str(random.randint(1, 9999999))

So instead of generating this id once the connection to the database has
been established, I suggest generating a random number in javascript and
POSTing it to the backend to be associated with the newly created
connection asynchronously while the query tool loads in the background. The
spinning indicator can be removed once the server sends an OK response once
the connection is established and associated with the number POSTed.