CSS спрайты: хвост виляет собакой

Mar 13, 2011 13:02

Буквально вчера впервые узнал из твиттера о существовании так называемых CSS спрайтов, и целой "технологии" их создания. Если коротко, смысл этой модной оптимизации сводится к тому, что вместо загрузки большого количества мелких изображений (картинок оформления, иконок и.т.д.) веб-страничка загружает одну большую картинку а потом "выкраивает" из нее с помощью CSS нужные кусочки и показывает их по-отдельности. В итоге снижается количество запросов к веб-серверу и, как следствие, увеличивается скорость загрузки страницы. Не особо вдаваясь в подробности технической реализации данного метода, могу сразу сказать, что недостатком подобной технологии является неудобство поддержки сайта и изменения/добавления новых изображений, особенно если нет исходных не оптимизированных файлов. С другой стороны, эта технология совершенно не решает проблему загрузки других мелких не графических файлов, например CSS и JavaScript.

Интересно, что за последние несколько лет веб-браузеры в погоне за стандартом HTML5 внедряли огромное количество нововведений, начиная от тэга "video", заканчивая поддержкой 3D рендеринга. Но никто даже не задумался о новом малюсеньком тэге, который раз и навсегда решил бы проблему спрайто-любцев:

...



...

Тэг mount монтирует содержимое архивов (сохраняя структуру директорий) images.zip и javascripts.zip в виртуальные директории "/img" и "/js" соответственно. После этого, любое обращение к файлам из этих директорий происходит без запроса к серверу, читая файл непосредственно из архива. Если браузер не поддерживает тэг mount, то он загружает картинку и скрипт как обычно из директорий /img и /src на сервере. Сам архив кэшируется браузером на общих основаниях.

Добавление маунт-тэгов в большинстве случаев не потребует никаких изменений в коде веб-сайта. По возможности маунт может поддерживать не только .zip, но и .gz, .rar, .bz2 и другие типы архивов.

webdev

Previous post Next post
Up