[CakePHP4]ソースコードをMinify化して圧縮する方法

[CakePHP4]ソースコードをMinify化して圧縮する方法
2021年05月13日2023年10月10日

CakePHP4でMinify(軽量化)化する方法を紹介します。

Minify(軽量化)化してファイルサイズを圧縮することでメリットが大きいので、運用サイトにも入れたいものです。

Minify(軽量化)のメリット

Minifyする最大のメリットは、ファイルサイズを最小限にしてWebブラウザが読み込む表示速度を向上することができます。

フルスクラッチだと、コードを読みやすくするためにインデントを入れたり改行を入れたりしますが、こういった行為がファイルサイズを大きくしています。

他にjsやcssファイルのMinify化はサーバーの容量の節約や難読化防止に役立つといわれていますが、微々たるものかと思います。(やらないよりやったほうが良いくらいのメリット)

CakePHP4でMinify(軽量化)化する方法は2種類

CakePHP4でMinify化する方法は2種類あります。

Minify化用のパッケージを入れる

composerを使用してMinify化用「wyrihaximus/minify-html」のパッケージをインストールします。

composer require wyrihaximus/minify-html

パッケージをインストール後、Application.php でプラグインを追加します。

src/Application.php
<?php

use WyriHaximus\MinifyHtml\Plugin as MinifyHtmlPlugin; // ← 追加

class Application extends BaseApplication
{

    public function bootstrap()
    {
        $this->addPlugin(MinifyHtmlPlugin::class); // ← 追加
    }


あとは、Minify化したいコントローラーにヘルパーを読み込んであげるだけです。

改行やスペース、HTMLのコメントも削除してくれます。

継承元の親クラスとかに記述してあげれば全画面Minify化することができます。

public function initialize(): void
{
    $this->loadHelper('WyriHaximus/MinifyHtml.MinifyHtml');
}
動作確認する場合は、デバッグモードをfalseにする必要があります。デバッグモードの場合はMinify化されません。

ハードコーディングする

先ほどはパッケージをインストールして有効化する方法を紹介しましたが、わざわざパッケージを入れたくないという場合は、直接ソースコードに書くことでMinify化することができます。

修正箇所は1ファイルのみです。

AppView.phpファイルに下記の記述を追加してあげます。

src/View/AppView.php
...
use Cake\Core\Configure;

class AppView extends View
{

    ...
    public function render(?string $template = null, $layout = null): string
    {
        $html = parent::render($template, $layout);

        // デバッグモード or 管理画面は通常出力
        if (Configure::read('debug') || ($this->getRequest()->getParam('prefix') == 'Admin')) {
            return $html;
        }
        
        // Minify化する
        return $this->sanitizeOutput($html);
    }

    function sanitizeOutput($buffer)
    {

        // 改行が必要なタグは抽出
        preg_match_all('#\<textarea.*\>.*\<\/textarea\>#Uis', $buffer, $foundTxt);
        preg_match_all('#\<pre.*\>.*\<\/pre\>#Uis', $buffer, $foundPre);

        // 改行が必要なタグを先に置換しておく
        $buffer = str_replace($foundTxt[0], array_map(function ($el) {
            return '<textarea>' . $el . '</textarea>';
        }, array_keys($foundTxt[0])), $buffer);
        
        $buffer = str_replace($foundPre[0], array_map(function ($el) {
            return '<pre>' . $el . '</pre>';
        }, array_keys($foundPre[0])), $buffer);

        $search = [
            '/\>[^\S ]+/s',
            '/[^\S ]+\</s',
            '/(\s)+/s'
        ];

        $replace = [
            '>',
            '<',
            '\\1'
        ];

        // 改行を削除する
        $buffer = preg_replace($search, $replace, $buffer);

        // 改行が必要なタグを元に戻す
        $buffer = str_replace(array_map(function ($el) {
            return '<textarea>' . $el . '</textarea>';
        }, array_keys($foundTxt[0])), $foundTxt[0], $buffer);
        
        $buffer = str_replace(array_map(function ($el) {
            return '<pre>' . $el . '</pre>';
        }, array_keys($foundPre[0])), $foundPre[0], $buffer);

        return $buffer;
    }
}

改行が必要なタグ<textarea><pre>タグは、「\n」で改行をおこなっているため、置換されないように退避しておく必要があります。

動作確認する場合は、デバッグモードをfalseにする必要があります。デバッグモードの場合はMinify化されません。

また管理画面はMinify化する必要がないので除外しています。

コメント

コメントを残す

お名前(任意)
コメント:新規