Как минимизировать Lit-HTML (включая комментарии) - PullRequest
0 голосов
/ 26 ноября 2018

Я решил попробовать lit-html через:

npm install lit-html --save

Я много раз слышал (из разных источников), что lit-html имеет размер всего 2 или 3 КБ, но только путем импорта html и рендер при экспорте мой веб-пакет вырос более чем на 13 КБ.Это намного больше, чем ожидалось.

Кроме того, в финальный пакет dist это было встроено 7 раз:

/**
 * @license
 * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
 * This code may only be used under the BSD style license found at
 * http://polymer.github.io/LICENSE.txt
 * The complete set of authors may be found at
 * http://polymer.github.io/AUTHORS.txt
 * The complete set of contributors may be found at
 * http://polymer.github.io/CONTRIBUTORS.txt
 * Code distributed by Google as part of the polymer project is also
 * subject to an additional IP rights grant found at
 * http://polymer.github.io/PATENTS.txt
**/

Это немного излишне.

Я думал, что webpack 4Предполагается, чтобы удалить комментарии автоматически.Как я могу заставить это быть минимизировано со всем моим другим кодом (где комментарии автоматически удаляются, и все просто объединяются в одну строку)?

Я могу жить без lit-html, если это слишком навязчиво.

1 Ответ

0 голосов
/ 05 декабря 2018

Этот вопрос является хорошим обзором того, что не так в наши дни с веб-разработкой, поэтому я решил воспользоваться этим ответом, предоставив также различные детали, необходимые для ответа на все подвопросы ОП.

Зависимости только потому, что?

Я много раз слышал (из разных источников), что lit-html имеет размер всего 2 или 3 КБ

Чтобы добиться наилучших результатов в программном обеспечении, мы обычно решаем включить некоторую зависимость из-за его особенностей, того, что он решает для нас, и, в конечном счете, насколько хорошо.

Факт, что люди говорят, что одна библиотека или утилита мала, не должен автоматически переводиться в ", тогда я включу его ", особенно если ваше последнее утверждение:

Я могу жить без lit-html

Поскольку я не испытываю особых усилий или даже энтузиазма по поводу вашего вопроса или желания использовать lit-html , вы уверены, что он вам вообще нужен?

Неправильно измеренный компромисс

Когда мы говорим о " Web-вещах ", мы обычно говорим о производственном коде и обо всех методах здравого смысла и передовых методах, используемых для получения такого производственного кода.

Это включает использование статических файлов сжатия , так что по умолчанию при импорте render и html из lit-html будет связка из 3,5 КБ как минимизированный и сжатый производственный размер.

Вот откуда берутся ваши цифры, даже если они немного больше, чем его первый выпуск, где основы работали примерно в 2 КБ (минимизированный и сжатый), уже предоставленный lit-htmlдостаточно сока из 3.5Kb, размер которого абсолютно не имеет значения по сравнению с остальной частью всемирной паутины.

Your favicon.ico или просьба получить его, неся все возможныефайлы cookie, возможно, уже весят аналогичный, если не больше, объем байтов.

Вы уверены, что проблема Интернета или даже вашего сайта - это библиотека, которая добавляет 3,5 КБ дополнительно?

Мобильный ориентированный бюджет , предложенный крупными экспертами , составляет менее 170 Кбайт, сокращен и сжат, что примерно в 48 раз меньше, чем HTML, я думаю, этого достаточно для вашего начального *Логика 1054 *.

О критике лицензии

Кроме того, в финальный пакет dist это было включено 7 раз:

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

Я думалПредполагалось, что webpack 4 автоматически удалит комментарии.

Когда комментарии пишутся как /*! important */, они обычно сохраняются минифайерами, потому что автор исходного кода намеревался оставить этот комментарий в.

Это обычная техника для хранения лицензий, но даже если есть инструменты, которые не будут заботиться о каких-либо комментариях, если не указано иначе, например, через --comments=/^!/ через uglify-js , помните, что ваш сайт, приложение, проект, использующий программное обеспечение третьих сторон, должен включать , например программное обеспечение лицензия тем или иным способом.

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

Как минимизировать, в любом случае

Как я могу заставить это быть плотносвернут со всем моим другим кодом (где комментарии автоматически удаляются и все просто объединяются в одну строку)?

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

Наиболее распространенным из них является UglifyJS .Известный как uglify-js модуль npm или uglify-es для кода ES2015 +, по умолчанию он удаляет все комментарии.

Вы можете попробовать его через npx, даже не устанавливая его:

npx uglify-es webpack/exported/lit-html.js

И увидите, что в выводе уже не будет комментариев.

Способ автоматизировать это - установить UglifyJS как devDependency и изменить файлы веб-пакета напрямую или с помощью директивы -o, как запись вашего package.jsonscript.

Альтернативы

Очень легко интегрировать UglifyJS в Webpack и Rollup, но, поскольку вы уже знаете Webpack, я предлагаю вам взглянуть на этот репозиторий , цель которого - показать, как объединить lit-html или hyperHTML.

Вы можете клонировать, установить и протестировать его локально, чтобы увидеть наилучшие результаты, в конечном итоге отбрасывая преобразование babel, если выуже нацелены на браузеры с поддержкой ES2015 (это дает меньшие результаты).

Вы можете проверить в реальном времени , которые когда-то были минимизированы и сжаты, включая " Hello World "код, lit-html весит 3,5 КБ в Webpack и 4,2 КБ в накопительном пакете, но после переноса со всем preset-env, что вы также можете настроить для точной настройки вашего пакета.

Как итог

Даже если я являюсь автором основной библиотеки, которая конкурирует с lit-html, крайне нежелательно читать жалобы на библиотеки размером менее 10 КБ, которые революционизируют способы разработки Интернета.

Любой другой основной фреймворк в 5-20 раз тяжелее, чем освещенный, или hyperHTML, и в Интернете возникают большие проблемы, чем у ~ 5K утилит, поэтому, пожалуйста, в следующий раз, когда вы увидите лицензию на интересующую вас библиотеку, иразмер не имеет значения для всего, что в настоящее время является Интернетом, нелегко стрелять в авторов библиотеки или в сборщика, который просто соблюдает авторские права и лицензии библиотеки.

Спасибо.

...