JavaScript помогает вам создавать динамические и активные приложения, однако то, как вы пишете свой код, может привести к неэффективности и, следовательно, повлиять на производительность вашего приложения, хотя они не всегда заметны для человеческого глаза. Хотя существует множество советов и рекомендаций, которые можно использовать для оптимизации кода JavaScript, иногда вы можете забыть применить их в своем коде. Вот почему проект Prepack может помочь вам с этой задачей.
Что такое Prepack и как он работает?
Prepack — это инструмент командной строки, который оптимизирует исходный код JavaScript: вычисления, которые можно выполнять во время компиляции, а не во время выполнения, исключаются. Prepack заменяет глобальный код пакета JavaScript (окончательная версия вашего кода) эквивалентным кодом, представляющим собой простую последовательность назначений. Это избавляет от большинства промежуточных вычислений и размещения объектов. Prepack фокусируется на производительности во время выполнения, а компилятор Closure делает упор на размере кода JavaScript. Например, следующий код, который реализует функцию Фибоначчи:
(function () {
function fibonacci(x) {
return x <= 1 ? x : fibonacci(x - 1) + fibonacci(x - 2);
}
// Define the x variable in the window as the result of 10
global.x = fibonacci(10);
})();В комплекте с Prepack ваш окончательный код будет выглядеть так:
x = 55;Какие? Вы шутите ? Нет, если вы проанализируете исходный код, функция Фибоначчи используется только один раз, и мы объявляем статическое значение из статического числа в глобальной переменной xтаким образом, результат вашего пакета будет результатом функции при ее выполнении, поэтому Prepack в фоновом режиме также оценивает ваш код. Хотя код, который вы пишете каждый день, может быть не таким простым, этот пример довольно приятен для понимания того, что делает препак со множеством ненужных теорий. Так что если ваш код нуждается в функции, потому что вместо того, чтобы использовать функцию Фибоначчи один раз, но, например, для объявления функции глобально:
(function () {
function fibonacci(x) {
return x <= 1 ? x : fibonacci(x - 1) + fibonacci(x - 2);
}
// Declare global the fibonacci fn
global.fibonacci = fibonacci;
})();Затем к этому добавляется препак:
(function () {
var _0 = function (x) {
return x <= 1 ? x : _0(x - 1) + _0(x - 2);
};
// Declare global the fibonacci fn
fibonacci = _0;
})();Как видите, Prepack компилирует код до его самой маленькой версии.
Как пользоваться?
Как уже упоминалось, Prepack - это утилита командной строки, и вы можете использовать ее с node.js. Используя NPM вы можете установить используя:
npm install -g prepackИли, если вы используете пряжу, убедитесь, что вы получаете пряжу в первую очередь:
npm install -g yarnи затем установите Prepack CLI через пряжу:
yarn global add prepackВам может понадобиться prepend команда с sudo в некоторых случаях или выполните командную строку в режиме администратора в Windows. После установки препакет должен быть доступен через командную строку и может использоваться, как показано в следующем примере:
prepack script.js --out script-processed.jsГде script.js - ваш собственный код и параметр out, который определяет абсолютный путь к выходному файлу с оптимизированным кодом. В любом случае вы можете прочитать подробные инструкции и документы по API из пакета. посетив их официальный сайт здесь.
Как внести свой вклад?
Prepack является полностью открытым исходным кодом в соответствии с пунктом BSD-3, что означает, что у вас есть право делать запросы на извлечение и сообщать о проблемах на официальный репозиторий на Github. В настоящее время есть 34 участника, более 10 тысяч звезд на Github и 273 вилки. Чтобы принять ваш запрос на получение ответа, команде Facebook необходимо, чтобы вы отправили CLA. Вам нужно сделать это только один раз, чтобы работать над любым из проектов с открытым исходным кодом Facebook (что вы можете сделать здесь).
Предварительная упаковка, хотя на ранней стадии она может стать в будущем важным инструментом, который можно интегрировать с React или любым другим видом JS-проекта. Многое предстоит сделать, но проект многообещающий, поэтому обязательно запустите репозиторий и проверьте наличие изменений в будущем.
