Каков наилучший способ быстрой загрузки сайта с боковой прокруткой?

Question

Я новичок в переполнении стека и программировании, так что прости меня за любую неловкую фразу!

Я создаю веб-сайт с боковой прокруткой, богатый графикой и размером 680x9400px. Я буду использовать некоторые javascript и / или mootools для создания крутого эффекта боковой прокрутки, похожего на http://sursly.com.

Я занимаюсь веб-оптимизацией всех используемых изображений, но хотел бы знать, есть ли у кого-нибудь еще идеи о том, как ускорить загрузку страницы? Есть ли способ предварительно загрузить сайт в горизонтальных разделах, например?

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

Answer 1

Обратите внимание, что большая часть графики на сайте Sursly чисто черно-белая. Это значительно ускоряет загрузку сайта, так как файлы могут быть оптимизированы.

Answer 2

Я согласен с ответом Past One, но изменил бы его немного: вместо того, чтобы загружать его по мере необходимости, загружайте его, когда можете. То есть изначально ничего не загружалось, кроме первой страницы. Как только это загрузится, загрузите второе, затем третье и т. Д.

Отслеживайте, какие части загружены и еще не загружены, и, если запрашивается «страница», которая не загружена, отобразите знак «Пожалуйста, подождите» и поднимите эту страницу в очередь с приоритетами.

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

Answer 3

Используя что-то вроде jQuery Lazy Loading Plugin , вы можете получить ощутимое ускорение, поскольку будут загружены только видимые изображения. Поэтому они не будут конкурировать с закадровыми изображениями.

Я знаю, что вы, вероятно, будете использовать mootools, но меня удивит, если у них не будет ничего подобного.

Answer 4

Большинство веб-сайтов, которые работают так же, как Google Maps. Они делят мир (или, в вашем случае, виртуальную страницу с боковой прокруткой) на плитки. Когда пользователь прокручивает, AJAX используется для загрузки следующей плитки и отображается, когда пользователь достигает края видимой в данный момент плитки.

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