Користувацький процесор Asset Pipeline для стиснення зображень

Програмний каркас 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.

Див. також

• Ruby on Rails
• Asset Pipeline
• PNG

Джерела

• Шпортько О.В. Підвищення ефективності стиснення кольорових зображень у форматі PNG : [укр.].
• Федік Л.Ю. Растрові формати графічних файлів : [укр.].
• David Verhasselt. Writing custom Asset Pipeline processors to compress images : [англ.].