#3728 Buttons not available until page loads

[Benjam]

On my dev machine at home, it's not the fastest because I have other things running, and various other scripts running with my PHP that cause it to slow down. While the page is loading (which sometimes takes several seconds), the new AJAX powered buttons (which seems to be all of them now) aren't available until the page fully loads. This is slowing my work way down. Where I used to be able to click a button before the page fully loaded, I now have to wait. This is not a very good user experience.

It seems that PMA is heading toward a fully AJAX powered system, and I'm not sure if this is a good thing. Simply because it's not needed, but mostly because it can actually degrade the user experience if not done properly.

For me, and I know this is just my opinion, but, the only AJAX that I actually use/enjoy is the edit in place for the table data, and maybe the reorder ability. All the other AJAX things are just fluff, and they were tolerable before, but now they are actively getting in the way of me doing my job.

The reason I bring this up is because I read somewhere that the enableAJAX directive is going to be removed, which leads me to believe that PMA is heading towards a fully AJAX powered system with no ability to turn it off. If this is the case, then the system NEEDS to be built with usability in mind, and not just using the new cool toy. Especially for something as useful and ubiquitous (at least in my line of work) as PMA.

[Marc Delisle]

Thanks for sharing your concerns.

Which browser and client OS are you using?

[Benjam]

I am on Chrome on Win 7 64bit.

Thanks.

[Rouslan Placella]

Hi Benjam,

I'm not too sure about the issue that you are experiencing. I'm guessing that you are referring to the fact that you need to wait for the server response to come back, during which time the "Loading..." message is shown. Is this correct?

Bye,
Rouslan

[Benjam]

No, the situation I'm talking about is after I click refresh, and the page shows up, but the browser is still loading the files, while the spinner is spinning, the buttons are not clickable.

This is usually due to running scripts in the head of the page, and setting those scripts to run on doc.ready. In that case the buttons are not clickable until the page is fully loaded.

Another method is to load the scripts at the bottom of the page, which gives the rest of the page time to load before being blocked by a script loading. It also allows the scripts to be run without being put into a doc.ready block which means they are available as soon as the element is visible (in most cases).

[Rouslan Placella]

Ok, I understand what you are talking about now.

[Rouslan Placella]

I can't quite see how this can be fixed, and I'm also having trouble replicating the issue.

[Benjam]

If you are running things in a jQuery(document).ready( ); block, then you can improve speed by running them outside of the doc.ready block but after the DOM for the portion you are changing is sent. e.g. at the bottom of the page, or in a script that is loaded at the bottom of the page.

[Marc Delisle]

Is this fixed in 4.0.0-alpha1 ?

[Rouslan Placella]

No, and as far as i'm concerned it never will be.

[Benjam]

For a product as large and as widely used as phpMyAdmin, that kind of response is... unfortunate.

That kind of attitude towards legitimate issues will only push users away, towards an older release which will then have to be maintained in addition to the newer release, or towards another product altogether.

[Rouslan Placella]

What attitude? This issue cannot be fixed. And the "solutions" that you have provided will not work, it's that simple.

[Benjam]

They can be fixed, and the solutions I provided are perfectly usable.

Also, your use of quotes around "solutions" tells me that you have no respect for me and therefore your users, which is also unfortunate. And that's precisely the attitude I'm referring to.

But in case I need to clarify my "solutions":

Move the scripts running the clickable things to the bottom of the page so they'll be loaded and run after the DOM has been generated, and remove the $(document).ready( ); wrapper from the script. That way the script is run as soon as it is encountered, and it does not have to wait for the entire document to be loaded. Links are immediately clickable, and users on slower machines or servers don't have to wait for images and other assets to be loaded before they can interact with the system.

Also... it would be helpful and appreciated if an abort call were added to the ajax powered links. There have been a few times where I clicked the wrong link, and had to wait for the new page to fully load and become active before I could click the correct link. With normal HTML links, if you click an incorrect link, and then quickly click the correct link before the page refreshes, it will load the new page instead. The way it is now, the user has to wait until the new page is fully loaded and the links become active before the new, correct link can be clicked. This fix can be achieved by running the .abort( ); method on any currently running ajax requests before generating the new request.

If you have legitimate reasons why these "solutions" can't be implemented, please, let me know.

[Rouslan Placella]

In pma 4.0 there is only one page load ever, when the user opens a pma page for the first time. After that, clicking on any link will cause only some of the content to get replaced on the page. So, if the user is allowed to click on a link before the page is ready, it would totally defeat the purpose of the system.

As far as the other issue, it's valid and I filed it for you at [#3780].

[Benjam]

Thank you for filing that other bug for me. I should have done that.

Regarding the single page load, I understand what you are saying, but the problem still persists even after a full page load. The newly shown links are not clickable for a short period of time while the page portion loads.

I will do some more research into exactly why, and how to fix it. I'll get back to you with my findings.

Thanks.

[Benjam]

Ok, I've looked into it a little bit, and it looks like there are a couple AJAX calls; one to fetch the actual page contents, and another to fetch any missing scripts that the page might need.

The links do not become clickable until after the second ajax call is completed and all the various onload events have fired. On my machine this takes around 2-3 seconds after the main page content has loaded. During this time, I can see the links, but clicking on them does nothing.

One possible solution (and I'm just throwing out ideas here), is to make a special function for the links that is loaded with the main application, something like:

$('body').on('click', 'a', function(evt) {
evt.preventDefault( ):
do_ajax_stuff_here( );
});

That way the links are clickable as soon as they are visible, regardless of any other scripts or events that are waiting to be fired.

[Marc Delisle]

How is phpMyAdmin 4.0.9 behaving for you guys?

[Atul Pratap Singh]

I think this can be closed, an associated ticket 3780 has been implemented.