jQuery « как сократить задержку в подгрузке стилей jQuery UI

Занимаемся разработкой внутренней CRM-системы, недавно на совковую верстку страниц начали внедрять стили и улучшения интерфейса из Jquery UI.

И клиенты очень ругаются на то что красивые стили Jquery UI подгружаются с задержкой.
Тоесть при открытии страницы загружается верстка и после с 0.5 - 1 секундной задержкой подгружаются стили Jquery UI

Они у меня вызываются в хвосте страницы конструкциями вида:
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .javascript.geshi_code {font-family:monospace;} .javascript.geshi_code .imp {font-weight: bold; color: red;} .javascript.geshi_code .kw1 {color: #000066; font-weight: bold;} .javascript.geshi_code .kw2 {color: #003366; font-weight: bold;} .javascript.geshi_code .kw3 {color: #000066;} .javascript.geshi_code .co1 {color: #006600; font-style: italic;} .javascript.geshi_code .co2 {color: #009966; font-style: italic;} .javascript.geshi_code .coMULTI {color: #006600; font-style: italic;} .javascript.geshi_code .es0 {color: #000099; font-weight: bold;} .javascript.geshi_code .br0 {color: #009900;} .javascript.geshi_code .sy0 {color: #339933;} .javascript.geshi_code .st0 {color: #3366CC;} .javascript.geshi_code .nu0 {color: #CC0000;} .javascript.geshi_code .me1 {color: #660066;} .javascript.geshi_code span.xtra { display:block; }

$(‘button.nextBtn').button({icons: {primary: "ui-icon-circle-triangle-e"}});
и тд

пробовал собрать все css в 1файл – не помогло,
переносить загрузку стилей и скриптов в шапку не хочу,
есть ли разумное решение?

1 ответов


Конечно, сделать не различные картинки для состояний кнопки, а CSS спрайты. Либо сделать предзагрузку картинок для изображений кнопок (но это более худший вариант).


Сам jQuery Ui весит 200кб, css файл для него 30 кб, графика для него — от 26 кб. Проблем быть не должно. Однако, если скрипт выполняется в конце, то само-собой что долго грузится будет. Если сервер, на котором находится ваш проект перегружен, то можете попробовать скинуть свои картинки на другой хост, или на крайний случай, на сервис для хранения картинок, jQuery UI же можно запускать с онлайн-репозитория гугла — тогда отдача этих 250кб данных будет идти не от вас.
А может быть вообще, что у посетителей медленный интернет (у моего друга из деревни интернет не качает больше 50кб в секунду), вот и будут качать ваши картинки по несколько секунд.
А графику для jQuery UI случайно не свою используете? Может у вас там графика весит много.