JS-компоненты обычно поставляются с CSS-изображением, но использовать его таким образом может быть немного затруднительно. Чтобы сделать компонент достаточно самостоятельным, мне пришла в голову идея упаковать CSS-изображение в js, а затем. Кстати, уменьшение количества запросов кажется более важным, хе-хе.
Так как же упаковать? Хотя существуют такие решения, как пакеты ресурсов , наши основные пользователи по-прежнему используют модные браузеры, такие как ie6!
Мое решение:
- CSS : CSS можно хранить в js в виде строки и динамически добавлять на страницу с помощью js. Страница может быть непригодна для использования, но на компонент это обычно не влияет.
- image : изображения, используемые в CSS, компилируются в js с использованием dataURI ( RFC 2397 ) и MHTML ( RFC 2557 ). ( dataURI и MHTML, написанные Цинь Гэ, по-прежнему рекомендуются студентам, которые не знают, что они собой представляют). Если вам нужен абсолютный путь в CSS, вы также можете сохранить js. Если js используется напрямую, это теоретически возможно, но обычно лучше просто изменить имя класса js.
- flash : некоторые относительно небольшие флэш-памяти, такие как хранение, копирование и т. д., также могут быть упакованы. Однако теперь мы можем решить проблему не-IE. Для не-IE можно использовать внешние ссылки.
Вот пример тестирования упаковки .
Некоторые детали и запутывания
- Не обязательно упаковывать все изображения в js. Упаковываются должны быть изображения, которые необходимо использовать.
Так что лучше упаковать исключенные картинки в другой пакет или использовать картинки напрямую? - Изображения можно сначала сжать, а затем отредактировать. Я выбираю инструмент сжатия изображений pngout и обычно использую
-s5 .
Кто-нибудь проводил тесты несжатых данных в base64. Вероятно, нет , каждый может сделать свое мнение. - Повторяющиеся ссылки на изображения будут очень большими, если вы используете dataURI напрямую, а gzip глуп как свинья и не сжимает их.
Я решил сохранить его как переменную js, а мои одноклассники на Таобао используют метод класса. - MHTML не может отображаться в ie7+/vista из-за отсутствия конечного разделителя. В Win03sp2 отсутствует
Content-Type , и это вызывает запросы безопасности. Причина в том, что MIME не является стандартным и не все можно пропустить. - Что мне выбрать: упаковать все в один файл или упаковать в два файла по типам MHTML и dataURI и отправить файл по ua на сервер или прочитать его разумно библиотекой классов. Кажется, последнее более гармонично?
- Есть проблема с использованием dataURI для компиляции swf. Говорят, что с fp8 проблем нет, но сейчас fp10.
Еще одно индивидуальное решение — упаковать js в swf, но это кажется дисгармоничным.
многочастный/связанный пример
Это не стандартно, но переносы строк также очень важны.
Тип контента:multipart/related;boundary="_BAIDU_YOUA_BB_YEP"
--_BAIDU_YOUA_BB_YEP
Тип контента: изображение/png
Местоположение содержимого:logo.png
Кодирование передачи контента: base64
...база64...
--_BAIDU_YOUA_BB_YEP
Тип контента: изображение/png
Местоположение содержимого:nono.png
Кодирование передачи контента: base64
...база64...
--_BAIDU_YOUA_BB_YEP--
