Медленная страница Php с несколькими вызовами API: мои пользователи будут ждать

это первый вопрос, который я публикую на этом сайте, так что извините, если заголовок не ясен.

У меня такая ситуация: php-страница, которой нужно обрабатывать данные, взятые из разных вызовов API (facebook, youtube, lastfm). Как и ожидалось, страница загружается годами, и это нормально. Итак, вопрос.

Можно создать страницу, которая просто берет два основных данных, которые мне нужны для запуска процесса — идентификатор facebook и токен — затем говорите пользователю подождать, а на стороне сервера инициировать процесс, не покидая эту надоедливую «загрузку страницы». " открытым? Я действительно понятия не имею, как вызвать такую ​​​​вещь.

Заранее спасибо.

Пс. Мне уже удалось оптимизировать с помощью fql множественный запрос для api facebook и другие подобные трюки, но поскольку результат вызова из одного api приводит к конкретному вызову другого, мне не кажется возможным его получить быстро И, очевидно, я уже прошел через процесс аутентификации в Facebook для пользователя, приземлившегося на этой странице с медленной загрузкой.


person LapsuS    schedule 19.01.2012    source источник


Ответы (2)


Вы захотите использовать этот тип парадигмы для получения наилучшего пользовательского опыта.

AJAX — ваш друг

Отправьте только минимальную информацию, необходимую для отображения схемы страницы для пользователя.

<html>
<head>
...scripts, meta, css etc...
</head>
<body>
<h1>Facebook Info</h1>
<div id=facebook-info>
<p>loading...</p>
</div>

<h1>Twitter Info</h1>
<div id=twitter-info>
<p>loading...</p>
</div>

</body>
</html>

Затем в каждом из разделов контента (который вам еще предстоит загрузить) есть счетчик.

При загрузке вашего javascript (я сокращаю для ясности... см. http://jQuery.com/ для получения дополнительной информации об их ajax-вызовах), вы можете совершать вызовы на определенные php-страницы, которые выдают некоторый JSON. Вот где настоящая работа происходит и требует времени.

<script>
$(document).ready(function(){
   $.ajax('/content/getFacebookInfo.php',displayFacebookContent);
   $.ajax('/content/getTwitterInfo.php',displayTwitterContent);
});
</script>

Затем в функциях обратного вызова displayFacebookContent и displayTwitterContent вы динамически создаете контент для DOM.

<script>
var displayTwitterContent = function(response) {
  var html = "<ul>";
  foreach(var i in response.posts) {
     html += "<li>" + response.posts[i].message + "</li>";
  }

  html += "</ul>";
  $('#titter-info).append(html);
};
</script>

Опять же, это сокращено, чтобы показать концепцию, вам нужно будет конкретизировать сценарии, а также создать обработчики php, которые отвечают объектами JSON.

Перекладывая тяжелую работу на обработчики AJAX, основной HTML-код обслуживается быстро, и пользователь доволен. К тому времени, когда его глаза будут перемещаться по странице, некоторые из вызовов AJAX будут завершены, и вы динамически вставите полезные данные в DOM, и они увидят их.

Это похоже на поиск Google, когда вы вводите текст, он выполняет обратный вызов AJAX на сервер и захватывает контент для отображения в режиме реального времени, прежде чем вы даже нажмете кнопку «Отправить».

person DMCS    schedule 19.01.2012
comment
Спасибо за парадигму! Я собираюсь изучить вызовы ajax и сделать свой сайт быстрее - person LapsuS; 19.01.2012

Если вы аутентифицируете пользователя с помощью FB, возьмите файл cookie. Если он существует, используйте некоторый тип сценария JQUERY для отображения наложения «загрузка» на странице.

person Paul Dessert    schedule 19.01.2012
comment
JQuery BlockUI идеально подходит для блокировки пользовательского ввода в ожидании ответного вызова. - person Jonah Bishop; 19.01.2012