Giriş yapmadınız.

#1 27.08.2015 21:36:58

MURATSPLAT
Yönetici
Yer: Antalya
Kayıtlı: 06.05.2014
Mesajlar: 642
Website

HTML Sıkıştırmak için tavsiyeler

Selamlar,

CSS, JS gibi assetleri Elixir ile hallediyorum.

Merak ettiğim ise render edilen HTML dosyalarını sıkıştırmak için  en ideal yol hangisidir.

Elamanın biri şöyle bir öneri sunmuş:

App::after(function($request, $response)
{
    // HTML Minification
    if(App::Environment() != 'local')
    {
        if($response instanceof Illuminate\Http\Response)
        {
            $output = $response->getOriginalContent();
            // Clean comments
            $output = preg_replace('/<!--([^\[|(<!)].*)/', '', $output);
            $output = preg_replace('/(?<!\S)\/\/\s*[^\r\n]*/', '', $output);
            // Clean Whitespace
            $output = preg_replace('/\s{2,}/', '', $output);
            $output = preg_replace('/(\r?\n)/', '', $output);
            $response->setContent($output);
        }
    }
});

Mantığı gayet basit. Bu mantığı bir middleware class'a dönüştürülüp istenilen yollar üzerinden kullanılabilir.

laravel-html-minify eklentisini yazan kişi, JS ile sıkıştırmayı da önermiş alternatif olarak.

GulpJS görevi:

var htmlmin = require('gulp-htmlmin');
var gulp = require('gulp');

gulp.task('compress', function() {
    var opts = {
        collapseWhitespace:    true,
        removeAttributeQuotes: true,
        removeComments:        true,
        minifyJS:              true
    };

    return gulp.src('./storage/framework/views/**/*')
               .pipe(htmlmin(opts))
               .pipe(gulp.dest('./storage/framework/views/'));
});

Ama GulpJS ile sıkıştırma bana mantıksız geldi. Zira tüm blade dosyalarının render edildiğinden emin olmanız gerekiyor.  Belki bu gulp görevini  çağıran bir job yazılabilir. Ama bu durumda sunucuya gulp ile gelen onlarca eklenti kurulması gerekecek..

Bir de şu eklentiler  var ..

https://github.com/fitztrev/laravel-html-minify
https://github.com/GrahamCampbell/Laravel-HTMLMin

Bu konu hakkında deneyimleri olanlardan tavsiye bekliyorum...

Çevrimdışı

#2 28.08.2015 07:49:35

evrend
Üye
Yer: DÜZCE
Kayıtlı: 26.05.2014
Mesajlar: 377
Website

Yanıt: HTML Sıkıştırmak için tavsiyeler

Ben iki laravel paketinide denedim, hatta fazlasını da denedim. Sayfalarımın bazılarında js kodları bulunduğundan, js kodlarını çalışmaz hale getirdi. Benim amacım sıkıştırmak değil aslında kodun okunabilirliğini azaltmaktı. Js kodlarıyla kullanamadığım için  şimdilik vazgeçtim. Kendiniz basit bir middleware ile bu işi halledebilirsiniz aslında.

class CompressMiddleware implements Middleware {

    public function handle($request, Closure $next)
    {

        //Not: Kodu test etmedim.

        $response = $next($request);
        $content = $response->getContent();

        // Clean comments
        $content = preg_replace('/<!--([^\[|(<!)].*)/', '', $content);
        $content = preg_replace('/(?<!\S)\/\/\s*[^\r\n]*/', '', $content);
        // Clean Whitespace
        $content = preg_replace('/\s{2,}/', '', $content);
        $content = preg_replace('/(\r?\n)/', '', $content);

        return $response->setContent($content);
    }
}

Son düzenleyen evrend (28.08.2015 07:51:30)


Unutmayın, HERKOD aynı değildir.
Fiyat/Performans Cloud için: Digital Ocean.
Ayda 2,5$'a 512Mb ram, 1Core CPU Cloud için: Vultr.

Çevrimdışı

#3 28.08.2015 09:16:55

MURATSPLAT
Yönetici
Yer: Antalya
Kayıtlı: 06.05.2014
Mesajlar: 642
Website

Yanıt: HTML Sıkıştırmak için tavsiyeler

evrend yazdı:

Ben iki laravel paketinide denedim, hatta fazlasını da denedim. Sayfalarımın bazılarında js kodları bulunduğundan, js kodlarını çalışmaz hale getirdi. Benim amacım sıkıştırmak değil aslında kodun okunabilirliğini azaltmaktı. Js kodlarıyla kullanamadığım için  şimdilik vazgeçtim. Kendiniz basit bir middleware ile bu işi halledebilirsiniz aslında.

class CompressMiddleware implements Middleware {

    public function handle($request, Closure $next)
    {

        //Not: Kodu test etmedim.

        $response = $next($request);
        $content = $response->getContent();

        // Clean comments
        $content = preg_replace('/<!--([^\[|(<!)].*)/', '', $content);
        $content = preg_replace('/(?<!\S)\/\/\s*[^\r\n]*/', '', $content);
        // Clean Whitespace
        $content = preg_replace('/\s{2,}/', '', $content);
        $content = preg_replace('/(\r?\n)/', '', $content);

        return $response->setContent($content);
    }
}

Geri bildirim için teşekkürler. Html sıkıştırma işini şimdilik erteledim. İyi bir çözüm bulursam buradan paylaşırım..

Çevrimdışı

#4 02.09.2015 09:12:00

Aristona
Üye
Yer: Kastamonu
Kayıtlı: 08.02.2013
Mesajlar: 173
Website

Yanıt: HTML Sıkıştırmak için tavsiyeler

MURATSPLAT yazdı:

Selamlar,

CSS, JS gibi assetleri Elixir ile hallediyorum.

Merak ettiğim ise render edilen HTML dosyalarını sıkıştırmak için  en ideal yol hangisidir.

Elamanın biri şöyle bir öneri sunmuş:

App::after(function($request, $response)
{
    // HTML Minification
    if(App::Environment() != 'local')
    {
        if($response instanceof Illuminate\Http\Response)
        {
            $output = $response->getOriginalContent();
            // Clean comments
            $output = preg_replace('/<!--([^\[|(<!)].*)/', '', $output);
            $output = preg_replace('/(?<!\S)\/\/\s*[^\r\n]*/', '', $output);
            // Clean Whitespace
            $output = preg_replace('/\s{2,}/', '', $output);
            $output = preg_replace('/(\r?\n)/', '', $output);
            $response->setContent($output);
        }
    }
});

Mantığı gayet basit. Bu mantığı bir middleware class'a dönüştürülüp istenilen yollar üzerinden kullanılabilir.

laravel-html-minify eklentisini yazan kişi, JS ile sıkıştırmayı da önermiş alternatif olarak.

GulpJS görevi:

var htmlmin = require('gulp-htmlmin');
var gulp = require('gulp');

gulp.task('compress', function() {
    var opts = {
        collapseWhitespace:    true,
        removeAttributeQuotes: true,
        removeComments:        true,
        minifyJS:              true
    };

    return gulp.src('./storage/framework/views/**/*')
               .pipe(htmlmin(opts))
               .pipe(gulp.dest('./storage/framework/views/'));
});

Ama GulpJS ile sıkıştırma bana mantıksız geldi. Zira tüm blade dosyalarının render edildiğinden emin olmanız gerekiyor.  Belki bu gulp görevini  çağıran bir job yazılabilir. Ama bu durumda sunucuya gulp ile gelen onlarca eklenti kurulması gerekecek..

Bir de şu eklentiler  var ..

https://github.com/fitztrev/laravel-html-minify
https://github.com/GrahamCampbell/Laravel-HTMLMin

Bu konu hakkında deneyimleri olanlardan tavsiye bekliyorum...

Neden bunu yapmak istiyorsunuz? HTML sıkıştırmanın pek bir getirisi yok. Zaten bu tür regexler çoğu zaman birşeyleri bozuyor oluyor. Mesela ben <!-- diye yorum bıraksam sitenize ne oluyor bu durumda? Test ettiniz mi? smile

evrend yazdı:

Ben iki laravel paketinide denedim, hatta fazlasını da denedim. Sayfalarımın bazılarında js kodları bulunduğundan, js kodlarını çalışmaz hale getirdi. Benim amacım sıkıştırmak değil aslında kodun okunabilirliğini azaltmaktı. Js kodlarıyla kullanamadığım için  şimdilik vazgeçtim. Kendiniz basit bir middleware ile bu işi halledebilirsiniz aslında.

class CompressMiddleware implements Middleware {

    public function handle($request, Closure $next)
    {

        //Not: Kodu test etmedim.

        $response = $next($request);
        $content = $response->getContent();

        // Clean comments
        $content = preg_replace('/<!--([^\[|(<!)].*)/', '', $content);
        $content = preg_replace('/(?<!\S)\/\/\s*[^\r\n]*/', '', $content);
        // Clean Whitespace
        $content = preg_replace('/\s{2,}/', '', $content);
        $content = preg_replace('/(\r?\n)/', '', $content);

        return $response->setContent($content);
    }
}

Obfuscation işini build processinizin bir parçası olarak kullanabilirsiniz. Javascripti obfuscate/minify eden birçok grunt/gulp plugini var. Inline JS yazmak zaten iyi birşey değil, linterlar falan saçmalıyor benim Sublime Text'te.

Ben artık şu şekilde bir yoldan gidiyorum. Blade'yi extend ettim, ve ne zaman View::make dersem, o sayfanın yolunu sayfanın meta tagına yazdırıyorum. Örn: 'home.category'. Daha sonra, yazdığım MiddlewareHandler sınıfıyla hangi sayfada olduğumu detect edip onun middlewarelerini çalıştırıyorum.

'home.category' => ['Birsey', 'BirseyDaha'];

ve middlewareleri class olarak tutuyorum JS ile. (class Birsey extends Middleware)

Ama bu yöntemmi iyi, yoksa URL'ye bakıp Laravel gibi router yazmakmı iyi (örn 'category/{id}/update' => [...]) emin değilim.

Şuan geliştirdiğim projeyi buna uygun olması için refactor ediyorum çünkü HTML içine ES6 yazamıyorum ve bu can sıkıyor.


"Eğer 6 ay önce yazdığın kodları gördüğünde utanmıyorsan, kendini yeterince hızlı geliştiremiyorsun demektir."

Site: http://anilunal.com/
Blog: http://aristona.github.io/

Çevrimdışı

Forum alt kısmı