Програмний каркас Asset Pipeline у Ruby on Rails мінімізує javascript та css файли, проте залишає поза увагою зображення, які також належать до файлів ресурсів. Існує багато алгоритмів без втрат і з втратами для оптимізації і стиснення зображень, котрі можна інтегрувати у каркас Asset Pipeline.
Огляд форматів
Растрові графічні формати слугують для опису растрової графічної інформації, яка в свою чергу застосовується, коли потрібна висока точність в передачі кольорів і напівтонів.
Формат GIF (Graphics Interchange Format, — формат взаємообміну графікою, розширення — gif) був запропонований найбільшою службою онлайну CompuServe спеціально для передачі растрових зображень у глобальних мережах.
GIF використовують для подання індексованих кольорових зображень та HTML-документів у електронних мережах. Він є ущільненим форматом, розробленим для прискорення пересилання файлів телефонними лініями.
JPEG (Joint Photographic Experts Group, розширення — jpg) розроблений групою експертів із фотографії (що видно з назви) під егідою ISO. Зараз він знайшов широке застосування для відображення фотографій та інших тонових зображень в електронних мережах.
Цей формат економить 50-70 % обсягу пам'яті за рахунок видалення з файлу тої його частини, яка не має значного впливу на якість зображення та дозволяє регулювати співвідношення між мірою стискання файлу та якістю зображення.
Формат PNG (Portable Network Graphics — мережева графіка, що переноситься, розширення — png), як видно з назви, призначений для передавання зображень по мережі. Цей формат не захищений патентами, не вимагає ліцензування й фінансових відрахувань і тому має широко розповсюджуватися — саме через патентування й жорстке ліцензування алгоритму LZW і виник PNG. Він використовує алгоритм стискання Deflate (вдосконалений LZW — краще стискання, ніж GIF на 10-30 %), підтримує п'ять різних фільтрів стискання. Крім цього передбачені 254 рівня альфа-каналу та черезрядкова розгортка.
Створення процесора
Для стиснення без втрат, можна використовувати гем sprokets-image_compressor, який оптимізує всі файли в форматі PNG і JPG без втрати якості в Asset Pipeline. Результати високі, але їх можна покращити. Для цього можна використати утиліту з втратою даних для стиснення PNG файлів pngquant, що в основному перетворює 32-бітові кольори в 8bit кольори, що ледь помітно для людського ока. В результаті зменшення розміру файлу сягає більше 50 %.
Встановивши дану утиліту, потрібно написати новий ініціалізатор для Вашого проекту Rails у каталозі config/initializers:
Rails.application.assets.register_mime_type 'image/png', '.png'
Rails.application.assets.register_postprocessor 'image/png', :png_compressor do |context, data|
IO.popen("pngquant -", "rb+") do |process|
process.write(data)
process.close_write
process.read
end
end
Щоб запустити створений процесор потрібно ввести команду rails assets: precompile у терміналі в каталозі проекту. Як результат, усі зображення з розширенням .png у Asset Pipeline стали меншого розміру.
Можливі проблеми
Іноді результатом цих дій насправді стає більший файл, ніж вхідний, або ж додаткове стиснення візуально спостерігається. З цих причин можна запускати pngquant лише до деяких файлів. Для цього потрібно створити клас, що перевірятиме результат стиснення.
class PngQuantProcessor < ::Tilt::Template
def prepare
# noop
end
def evaluate(scope, locals, &block)
IO.popen("pngquant -", "rb+") do |process|
process.write(data)
process.close_write
process.read
end
end
end
end
Файл ініціалізатора потрібно переписати відповідно до нового класу.
Rails.application.assets.register_mime_type 'image/png', '.quant'
Rails.application.assets.register_engine '.quant', PngQuantProcessor
Усім файлам, які треба стиснути, потрібно додати розширення .quant. Після їх компресії Asset Pipeline повертатиме користувачеві звичайні зображення у форматі PNG.
Див. також
Джерела