Stopping database reads holding up web ui rendering

Question

I have a PHP web service that I am building.

I can for see a problem looming, and would like some input on how to combat it, before I write too much code.

I have 14 sites, which each contain an instance of a mysql database, which is updated by another custom perl script.

In order to consolidate this data into a single web front end, I am attempting to write a php web page that does the following.

On the front page, the web server connects to all 14 database servers and pulls back the information it requires, and then renders it on the page. Currently this works flawlessly as all the data is held on my local machine, but in production this data will be spread across the 14 separate databases.

So my question is, what is the best way to go about abstracting the database reads from the the UI painting. Ideally i would like to have the full webpage render, with a loading bar indicating when the user could expect the data to be displayed.

Is this something achievable via AJAX, or should i be looking in another direction.

Thanks in advance.

Answer 1

I would do something like this:

• create a small php proxy that can be callable from AJAX as you cannot connect to other website with AJAX
• display full page layout with the elements empty
• start displaying elements as soon as the DOM is ready with AJAX
• every element will have a loading bar as soon as you start loading data from functions

Eg:

 ___________________________________
| data_1 | data_2 | data_3 | data_4 |
 ‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾

start function loadData1() will replace data1_id with a loading bar and start AJAX call

 ___________________________________
| ...... | data_2 | data_3 | data_4 |
 ‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾

Same for other elements