Как выяснить, что не даёт странице загрузиться до конца?

Question

[Shultc]

Что имеем:
Итак. Я скачал простой бесплатный темпелейт сайта на HTML5. Он разделён на 4 секции (<section>). Во вторую секцию я добавил плагин для отображения галерей фотографий с Facebook (https://github.com/jveldboom/facebook-gallery )

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

Вопрос:
Как выяснить, что именно не даёт загрузиться остальным частям страницы. Я новичок в web-разработке, но, как понимаю, это должна быть какая-то проблема в php, потому что консоль пустая... Или есть какая-то стандартная проблема, которую я не учёл?

Заранее благодарен!

Answer 1

[Игорь Воротнёв]

PHP то тут при чем? Смотрите не только консоль, но и закладку Network.

UPDATE:
Похоже отловили баг в библиотеке. См. комментарии к этому ответу.
Shultc "Библиотека, генерирующая альбомные thumbnail'ы не закрывает тег img"

Comments

[Shultc]

В Network просто не грузится. Останавливается и всё... Может тогда с jQuery что-то не так? Но как это выяснить....

[Игорь Воротнёв]

Shultc: таймлайн что показывает? какие ресурсы загрузились, на каком останавливается? скриншот хоть сделайте.

[Shultc]

При загрузке страницы:

И в этот момент и подгружается не всё что надо. Но загружаются thumbnail'ы для альбомов.

После щелчка по альбому:

Открывается альбом, и появляется недостающий остаток страницы... Что интересно, так то, что там идёт список картинок, но не видно новых элементов дизайна, которые в прошлый раз не подгрузились...

[Алексей Быков]

Тэги все закрыли?

[Shultc]

Алексей Быков: вот думал о незакрытых тегах... Но в статичной части всё закрыто. Возможно система галереи генерирует незакрытый тег... Но как отследить? Браузер автоматически все теги закрывает. Есть способ это отдебажить?

[Игорь Воротнёв]

Shultc: судя по скринам, все грузится до конца. Возможно, действительно, не закрыт тег где-то, из-за этого не отображается часть страницы.

[Shultc]

Нашёл! Библиотека, генерирующая альбомные thumbnail'ы не закрывает тег img:

function displayAlbums()
	{
		$this->loadCache($this->id); // loads cached file
		$gallery = '';
		$json_array = $this->getData($this->id,$type='albums');
		$data_count = count($json_array['data']);
		for($x=0; $x<$data_count; $x++)
		{
			if(!empty($json_array['data'][$x]['object_id']) AND $json_array['data'][$x]['size'] > 0) // do not include empty albums
			{
				$gallery .= '<li class="span2">
    							<a href="?id='.$json_array['data'][$x]['aid'].'&title='.urlencode($json_array['data'][$x]['name']).'" class="thumbnail" rel="tooltip" data-placement="bottom" title="'.$json_array['data'][$x]['name'].' ('.$json_array['data'][$x]['size'].')">
    							<img src="http://graph.facebook.com/'.$json_array['data'][$x]['object_id'].'/picture?type=album">
    							</a>
  							</li>';
			}
			
		}
		$gallery = '<ul class="thumbnails">'.$gallery.'</ul>';
		
		if($this->breadcrumbs != 'n'){
			$crumbs = array('Gallery' => $_SERVER['PHP_SELF']);
			$gallery = $this->addBreadCrumbs($crumbs).$gallery;
		}
		
		$this->saveCache($this->id,$gallery); // saves cached HTML file
		
		return $gallery;
	}

Напишу им на гитхаб.
Всем спасибо!

[Игорь Воротнёв]

Shultc: отлично)

[Shultc]

Блин, и снова перестало работать... =( Есть какой-то способ проверить, все ли теги закрыты?

[Игорь Воротнёв]

Shultc: www.htmllint.net/en/html-lint/htmllint.html или валидатором W3C.

[Shultc]

Окей, каким-то образом всё рушит то, что хранится в папке "кэш"... Поэтому после изменения, любого изменения и первого запуска, выглядело, как-будто проблема решена — кэш был пуст. Отключу кэширование.

[Shultc]

Игорь Воротнёв: Спасибо вам большое!