Ελαχιστοποίηση και συγχώνευση CSS, JavaScript και HTML

Total.js 5 · total5@0.0.19 performancecssjavascripthtmlminification Εκτελέστηκε με το Total.js 5

Το Total.js ελαχιστοποιεί ό,τι σερβίρει, χωρίς κανένα βήμα build. Ένα αρχείο .css ή .js από το public/ αποστέλλεται χωρίς σχόλια και κενά (ο κώδικας δεν μετονομάζεται ούτε αναδομείται, απλώς συμπυκνώνεται) και ένα κείμενο που στέλνεται με το $.html() ή ένα αποδοσμένο view χάνει τα σχόλια HTML και τα επαναλαμβανόμενα κενά συγχωνεύονται. Ένα αρχείο του οποίου το όνομα περιέχει .min. (όπως το library.min.js) θεωρείται ήδη ελαχιστοποιημένο και αποστέλλεται ως έχει.

Τρεις ρυθμίσεις στο αρχείο config το ελέγχουν, όλες true από προεπιλογή: $minifyjs, $minifycss και $minifyhtml. Ορίστε μία σε false για να σερβίρεται αυτός ο τύπος αμετάβλητος, κάτι χρήσιμο όταν κάνετε αποσφαλμάτωση στον περιηγητή.

Το MERGE(url, file1, file2, ...) καταχωρίζει ένα εικονικό αρχείο που είναι η ελαχιστοποιημένη συνένωση των δοσμένων αρχείων. Ο περιηγητής κάνει ένα αίτημα αντί για πολλά. Οι διαδρομές των αρχείων είναι URL του φακέλου public/.

public/css/app.css

/* the page style */
body {
	margin: 0;
	color: #000000;
}

public/js/app.js

// greeting
function hello(name) {
	var message = 'Hello ' + name;
	return message;
}

public/js/library.min.js

function   untouched ( ) { return  1 }

public/js/two.js

function two() { return 2; }

controllers/minify.js

exports.install = function() {
	ROUTE('GET /page/', page);
	MERGE('/all.js', '/js/app.js', '/js/two.js');
};

function page($) {
	$.html('<!DOCTYPE html>\n<html>\n  <body>\n    <!-- a note -->\n    <p>  Hello   world  </p>\n  </body>\n</html>');
}