2Объедините и сжимайте файлы JavaScript и CSS на стороне сервера.
Одним из наиболее важных рекомендаций по оптимизации веб-производительности является сокращение количества HTTP-запросов, а также это самое важное правило в YSlow. Решения для сокращения HTTP-запросов включают объединение файлов JavaScript и CSS, CSS-спрайтов, карт изображений и использование URI данных для кодирования изображений. CSS-спрайты и сопоставление изображений сейчас широко доступны, но из-за того, что IE6 и IE7 не поддерживают URI данных и проблемы с производительностью, эта технология не получила широкого распространения. В настоящее время количество файлов JavaScript и CSS на большинстве веб-страниц такое же, как и при их разработке. Небольшое количество веб-страниц будут объединены локально в соответствии с реальной ситуацией. Многие из этих объединений выполняются выборочно вручную. Каждое новое слияние необходимо снова выполнять локально. Завершение и загрузка на сервер являются относительно случайными и громоздкими, и сжатие того же файла имеет аналогичную ситуацию. Используя слияние и сжатие на стороне сервера, мы можем сделать детализацию файлов минимально возможной в соответствии с логикой разработки и использовать правила URL-адресов на веб-странице для автоматического объединения и сжатия файлов, что будет достаточно гибким и эффективным.
Обработчик комбо YUI
В июле 2008 года команда YUI объявила, что предоставит сервис Combo Handler для компонентов YUI JavaScript на YAHOO! Combo Handler — это модуль Apache, разработанный Yahoo!, который позволяет разработчикам просто и удобно комбинировать файлы JavaScript и CSS через URL-адреса, тем самым значительно сокращая количество запросов к файлам. Например, использование компонента редактора форматированного текста YUI2 на странице требует добавления нескольких файлов JavaScript. Общие методы следующие:
После использования службы Combo Handler приведенный выше код можно записать так:
Помимо небольшого снижения читаемости кода, использование службы Combo Handler значительно снижает количество HTTP-запросов, а также уменьшает объем URL-кода, что имеет решающее значение для оптимизации веб-производительности. Таким образом, начиная с YUI 2.6.0, его основной компонент YUI Loader имеет встроенную функцию обработки комбо. То есть при использовании YUI Loader путем настройки атрибута объединения можно загрузить несколько файлов JavaScript или CSS. форма использования службы Combo Handler в сочетании, если статический файловый сервер поддерживает Combo Handler. В YUI, когда для параметра комбайна установлено значение true, CDN по умолчанию использует Yahoo! CDN ( http://yui.yahooapis.com ), поэтому проблем нет. Это одна из самых очаровательных частей YUI.
К сожалению, скорость http://yui.yahooapis.com в Китае не очень хорошая. Первоначально Yahoo China предоставляла http://cn.yui.yahooapis.com/ , но еще не предоставляла услугу Combo Handler. в то же время по разным причинам его обновления с YUI 2.7.0 остановились. Хуже всего то, что, хотя модуль Apache, разработанный Yahoo! для поддержки Combo Handler, как сообщается, будет иметь открытый исходный код, по крайней мере на данный момент это частная технология. Чтобы использовать ее, вам необходимо реализовать подобные функции самостоятельно, поэтому они существуют. в Китае не так много применений подобных технологий.
<script src="http://yui.yahooapis.com/combo? <script src="http://yui.yahooapis.com/2.8.0r4/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script src="http://yui.yahooapis.com/2.8.0r4/build/container/container_core-min.js"></script>
<script src="http://yui.yahooapis.com/2.8.0r4/build/menu/menu-min.js"></script>
<script src="http://yui.yahooapis.com/2.8.0r4/build/element/element-min.js"></script>
<script src="http://yui.yahooapis.com/2.8.0r4/build/button/button-min.js"></script>
<script src="http://yui.yahooapis.com/2.8.0r4/build/editor/editor-min.js"></script>