Есть страница состоящая из одного большого фонового рисунка (бэкграунд), текстовой информации, javascript скриптов (jquery и сторонних). Фронтенд.
При нажатии на кнопку или ссылку на странице, происходит переход на файл действий. Бэкэнд.
Далее этот файл выполняет действия и снова возвращает нас на страницу, но уже с другой информацией.
Разумеется, содержимое загружается "некрасиво" - дерганье, блинки (мигает фоновый рисунок в IE - не кэшируется?).
Возможно, тут бы подошел ajax - но на странице меняется 80% контента. Да и часть информации получаю методом GET. Да это можно было реализовать, но в данной структуре - это не рационально.
Проще говоря - много переделывать.
Пробовал вариант с невидимым div. div который отображается только после загрузки всего контента.
Но так, тоже видно мигание этого дива (в силу скорости загрузки?).
может поможет: https://ru.wikipedia.org/wiki/WebP
Насколько мне известно, этот формат также поддерживает постепенное улучшение качества изображения по мере загрузки.
Вы уверены что у вас меняется 80% страницы? Неужели на каждой странице свой набор скриптов? Почему-то мне кажется что меняется текстовая часть и один-два скрипта.
Разделите фронт на изменяемые (динамические) и неизменяемые (статичные) части. Сначала пусть грузится статика, потом AJAX-ом подгружается динамика и отображается. При переходе с сервера загружается только динамическая часть.
Да 80%. По типу общее окно и общее меню, а контент окна разный.
Ajax не поможет в силу get запросов. Я не могу Ajax -ом изменять адресную строку, а она должна менятся после запроса.
Я бы сделал следующее:
1) картинка - обязательно progressive JPEG, а не обычный (и как следует оптимизировать)
2) CSS не во внешний файл, а прямо в код страницы в тег style
3) неблокирующая асинхронная загрузка всех JavaScript (но тут придется повозиться, вешая цепочку событий onload)
Посоветовать что-либо еще, не видя конкретного сайта, довольно сложно.
1) Странно. Наверно дело не в картинке т.к. сервер внутри 100 мегабитной сети, и в хроме картинка кэшируется, а в ие нет - мигает при каждом переходе внутри сайта.
2) Тоже сомнительно. Не удобно.
3) А вот это интересно. Дело в том, что у меня около 10 скриптов в коде. И скорее всего из за них эти мигания (блинки). Предлагаете засунуть их все в onload?
показывать и скрывать прелоадер плавно (как угодно)
в любом случае, миллисекунды, секунды, будет занимать подгрузка контента
чтобы не было дёрганий и было человеко-понятно - оптимальный вариант - прелоадер