Minify views trong Laravel 5 có tác dụng gì?

Minify views sẽ giúp cho việc load trang trở nên nhanh hơn do đã loại bỏ hết khoảng trắng, comment và nén cả JS inline.

Trong ứng dụng Laravel thì thường dùng blade template và lưu trữ trong thư mục resources/views. Khi view được load lần đầu, Laravel sẽ biên dịch file blade này thành file php bình thường và lưu trữ trong thư mục storage/framework/views. Vì vậy, để minify views trong Laravel 5 thì ta cần nén các file views trong thư mục storage/framework/views.

Hãy xem kết quả trước khi bắt tay vào làm nhé. HTML của ứng dụng sẽ được nén lại như hình này

Minify views Laravel 5.1

Các bước minify views trong Laravel 5

Để làm được điều này, đầu tiên bạn cần cài đặt thêm gulp-htmlmin, hãy sửa lại file package.json bằng nội dung bên dưới.

[js]

{

"private": true,

"devDependencies": {

"gulp": "^3.9.1",

"gulp-htmlmin": "^1.3.0"

},

"dependencies": {

"laravel-elixir": "^5.0.0",

"bootstrap-sass": "^3.0.0"

}
}

[/js]

Tiếp theo hãy chạy npm update để cập nhật thư viện.

Sửa lại file gulpfile.js:

[js]

var elixir = require(‘laravel-elixir’);

var gulp = require(‘gulp’);

var htmlmin = require(‘gulp-htmlmin’);

elixir.config.sourcemaps = false;

elixir.config.production = true;

elixir.extend(‘compressHtml’, function(message) {

new elixir.Task(‘compressHtml’, function() {

const opts = {
collapseWhitespace: true,
removeAttributeQuotes: true,
removeComments: true,
minifyJS: true
};

return gulp.src(‘./storage/framework/views/*’)

.pipe(htmlmin(opts))

.pipe(gulp.dest(‘./storage/framework/views/’)) })

.watch(‘./storage/framework/views/*’)

});

elixir(function(mix) {

mix.compressHtml();

});

[/js]

Bây giờ, tiến hành mở cmd lên và gulp, các file views trong ứng dụng của bạn sẽ được nén lại. Để kiểm tra hãy truy cập thư mục storage/framework/views hoặc mở ứng dụng lên và tiến hành view source nhé.

Thao tác này chỉ cần thực hiện lúc bạn chuẩn bị upload source lên live server thôi nhé, ở dưới local thì không cần lắm. Vì vậy, hãy comment dòng mix.compressHtml(); lại để gulp chạy nhanh hơn nhé.

Mình là 1 developer mới vào nghề, chưa có nhiều kinh nghiệm với lập trình web nhưng luôn muốn chia sẻ những hiểu biết của mình với các lập trình viên khác. Khá là gà và lười viết blog, chỉ ham code và chuyên Laravel.