UglifyJS: concat и minify или наоборот?

Ответ 1

Я тестировал вывод каждого метода с помощью Gulp.

Настройка тестирования

Я использовал 9 файлов JavaScript с общим 19.15 kB при конкатенировании (не уменьшался). Каждый файл начинается с оператора 'use strict';.

Результаты:

• Concatenate = > Uglify: 7.993 kB
• Uglify = > Конкатенация: 8.093 kB
• Разница: 0,1 кБ

Примечания:

• Concatenate = > Uglify strips 8 из 9 'use strict'; операторов
• Uglify = > Concatenate сохраняет все операторы 'use strict';
• Один оператор 'use strict'; 13 байт. 8 × 13 байтов = 104 байта, что объясняет разницу в 0,1 кБ.

Заключительные мысли:

Использовать какой бы заказ вы ни выбрали.

Разница между этими двумя процессами незначительна. Concatenate = > Uglify может (теоретически) производить (едва заметно) меньшие файлы, если выполняются оба значения:

• Несколько отдельных файлов начинаются с оператора 'use strict';
• Существует много отдельных файлов

Здесь gulpfile.js я использовал:

var gulp = require('gulp'),
  concat = require('gulp-concat'),
  uglify = require('gulp-uglify');

var files = [
  '!app/scripts/**/*Spec.js', // Exclude test files
  'app/scripts/**/*.js'
];

// Register tasks
gulp.task('concat-min', function() {
  return gulp.src(files)
    .pipe(concat('script.min.js'))
    .pipe(uglify())
    .pipe(gulp.dest('dist'));
});

gulp.task('min-concat', function() {
  return gulp.src(files)
    .pipe(uglify())
    .pipe(concat('script.min.js'))
    .pipe(gulp.dest('dist'));
});

Ответ 2

Я был бы удивлен, если бы в любом случае значительная разница с накладными расходами на запрос пользователя.

Я бы также предположил, что объединение всех этих фреймворков в один файл может фактически увеличить накладные расходы для каждого пользователя.

Почему?

При использовании популярной/общей структуры, такой как jQuery и т.д., имеет смысл разместить ее на CDN, например Google, чтобы извлечь выгоду из кеширования файла - если пользователь посетил веб-сайт, который также использовал jQuery, им совсем не нужно будет загружать его! Не говоря уже о снижении географической задержки.

Итак, создав свой собственный уникальный файл, вы делаете его гораздо более вероятным, что пользователю придется загружать все это.

Ответ 3

Я настоятельно рекомендую вам использовать requirejs, используя эту библиотеку lib, вы можете создавать пакеты или один сведенный к минимуму и унифицированный файл. Прочтите инструмент оптимизации.

Однако, как сказал вам Widor, это не очень хорошая идея объединить ВСЕ файлы в один. Многие из этих libs лучше работают с помощью google api (CDN), если вы всегда будете использовать свое приложение онлайн

Ответ 4

Я бы все равно включил их в один, а затем уменьшил.

Одна вещь, которую я начал делать, - запустить ее, хотя http://www.javascriptobfuscator.com/ сначала я знаю, что это звучит посчитано интуитивно, но одна из вещей, делает, сохраняет всю строку в массиве ok, уродливый массив, но останавливает повторение строки, а затем, когда вы переходите к своему миниатюре, я использую компилятор Google Closure, затем он убирает строки, и вы часто получаете улучшенный файл с мини файлами.

Ответ 5

Это не будет иметь большого значения, так как инструкции toplevel (и переменные & c.) не затрагиваются.

Однако при использовании параметра --lift-vars он может измениться. Это сильно зависит от вашего кода.

Ответ 6

Заказ не имеет особого значения, если у вас будет меньше глобалов, плавающих вокруг. Будет минимальная разница в размере файла. Мое личное предпочтение - Concatenate, а затем Uglify, который позволяет создавать более качественные и точные исходные коды, а не наоборот. (Это связано с тем, что с каждым преобразованием меняются исходные карты). Мне интересно, какова цель уничтожения небольших файлов, а затем конкатенации. В принципе, это зависит от вас, и выбор за вами. Конкатенирование и Uglifying кажется более удовлетворительным и менее подверженным ошибкам