Подключение CSS в конце страницы: проблема

1.98K
.
Столкнулся с такой проблемой.
Подключаю css файлы в конце контента, из-за чего появляется секундная (меньше, но ее видно) задержка между выводом страницы на экран, и приобретением ей всех свойств прописанных в css.
Пока ищу решение, но что то ни как.
Надо как то ускорить загрузку css или повысить его приоритет перед разметкой (т.е. лочить рендеринг до момента полной загрузки css)
Может кто ни будь сталкивался?
Знаю один вариант (засунуть весь контент в таблицу) но он мне не нравится.
Буду благодарен любым советам (кроме переноса подключения в шапку, конечно)
.
ramzes, а буферизация тут не поможет?
.
это делается на стороне клиента (рендеринг)
буфферизация - на стороне сервера.
тут именно с браузером воевать надо
.
ramzes
за одно нате вам
компрессор css файлов (+/-)


Scaning....

_account.css Сжат. Экономия 2.64kb
_administraror.css Сжат. Экономия 0.742kb
_events.css Сжат. Экономия 0.939kb
_forum.css Сжат. Экономия 4.356kb
_login.css Сжат. Экономия 0.159kb
_mail.css Сжат. Экономия 0.401kb
_music.css Сжат. Экономия 0.992kb
_user.css Сжат. Экономия 3.311kb
audio.css Сжат. Экономия 5.235kb
colors.css Сжат. Экономия 3.607kb
core.css Сжат. Экономия 3.278kb
editor.css Сжат. Экономия 0.065kb
.
это делается на стороне клиента
Может быть это и не подойдёт под твои требования, но что если перенести подключение стиля на сторону сервера, в css-файлe задать стилевые свойства, например :
css.inc.php (+/-)


А потом в php-файле подключить этот стиль
index.php (+/-)

Сойдёт за альтернативу? Или только рендеринг?
.
Ты немного не понял.
смотри.
в хтмл есть подключение ксс, в самом конце.
все это дело отдается разом, точнее отдается страница, браузер ее читает, и рендерит по мере прочтения
DOM строится не разом весь, а по мере рендеринга хтмл браузером.
что получается:
див, див, картинка (браузер прочел и вывел)
опа, линк на css файл. (браузер поперся его качать, или искать в своем кэше [т.е. даже кеширование файла css не позволит загрузить его в DOM раньше чем ращметку которая идет выше линка на css файл])
и так, css скачался/нашелся, обработался, все это заняло некие микросикунды, в течении которых, те самые дивы болтаются на экране без стиля, т.к. браузер еше только читал ксс.
в этом и проблема
.
есть легальный способ заставить браузер не выводить на экран контент до тех пор пока он не прочтет его весь. от и до.
это табличная верстка.
но она мне не подходит.
вот мне надо добится такого же эффекта, но другим путем. сначала полная вычитка, потом только вывод на экран.
сама задержка роли не играет. страницы изначально быстрее среднестатистических вдвое-трое
.
ramzes, это тупизм выводить стиль в самом конце! Таким образом ты не добьешься приоритета, так как они будут в самом низу иерархии.

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

А вообще, стиль заносится в кеш после первой загрузки страницы.
.
blackvj
это тупизм выводить стиль в самом конце
В одном из своих скриптов я юзаю подключение стиля описанным мною выше по тексту способом - нет никаких проблем.
Внизу выводят только js, чтобы они не тормозили загрузку страницы, тем самым давая шанс подгрузиться первым делом стилям.
С этим тоже не должно быть проблем - чтобы не ставить в очередь контент, и не ждать загрузки скрипта(а только потом уже остатка контента), юзай атрибуты defer или async.
.
# blackvj (21.06.2016 / 23:48)
ramzes, это тупизм выводить стиль в самом конце! Таким образом ты не добьешься приоритета, так как они будут в самом низу иерархии.

Внизу выводят только js, чтобы они не тормозили загрузку страниц
давай ты не будешь мне про тупизм тут лечить?
цитирую гугл спид пейдж
Исправьте обязательно:
Удалите из верхней части страницы код JavaScript и CSS, блокирующий отображение
Количество блокирующих скриптов на странице: 4. Количество блокирующих ресурсов CSS на странице: 12. Они замедляют отображение контента.

я вроде как описал суть проблемы, а не просил давать оценку тому или иному решению
Всего: 57