Minifikácia a spájanie CSS, JavaScriptu a HTML

Total.js 5 · total5@0.0.19 performancecssjavascripthtmlminification Spustené s Total.js 5

Total.js minifikuje to, čo servíruje, bez akéhokoľvek build kroku. Súbor .css alebo .js z public/ sa odošle bez komentárov a medzier (kód sa nepremenúva ani nepreusporiadava, len sa zhustí) a reťazec odoslaný cez $.html() alebo vykreslený pohľad stratí komentáre HTML a opakované medzery sa zlúčia. Súbor, ktorého názov obsahuje .min. (napríklad library.min.js), sa považuje za už minifikovaný a odošle sa tak, ako je.

Riadia to tri nastavenia v súbore config, všetky predvolene true: $minifyjs, $minifycss a $minifyhtml. Nastavte jedno na false, aby sa daný typ servíroval nezmenený, čo sa hodí pri ladení v prehliadači.

MERGE(url, file1, file2, ...) zaregistruje virtuálny súbor, ktorý je minifikovaným spojením zadaných súborov. Prehliadač tak robí jednu požiadavku namiesto mnohých. Cesty k súborom sú URL z priečinka 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>');
}