Bundle Transformer: Летние обновления

Логотип Bundle Transformer на сельскохозяйственном поле

Начиная с сентября прошлого года, когда библиотека MSIE JavaScript Engine for .NET была заменена библиотекой JavaScript Engine Switcher и был создан модуль BundleTransformer.CleanCss, в Bundle Transformer практически не было каких-либо революционных изменений. Изменения были в основном эволюционными: добавлялась поддержка новых версий минимизаторов и трансляторов (самая рутинная и сложная часть работы над проектом), исправлялись мелкие ошибки и шла работа над увеличением производительности.

Но этим летом все изменилось: с конца мая по июль от пользователей Bundle Transformer было получено огромное количество рекомендаций по улучшению проекта. Большая часть из них была реализована в версии 1.9.0 и последующих летних обновлениях. В данной статье мы рассмотрим наиболее значимые из них:

Читать далее…

Бандл… Пара-пара-па хэй! или Bundle Transformer шагает по планете 2

Упоминания о Bundle Transformer в Интернете

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

До августа прошлого года библиотека dotless была основным средством для работы с LESS в сообществе .NET-разработчиком, и входила в состав практически всех инструментов клиентской оптимизации для ASP.NET: Cassette, SquishIt, Combres и RequestReduce. Bundle Transformer также не являлся исключением: библиотеки dotless и DotlessClientOnly (облегченная версия) использовались в модулях BundleTransformer.Less и BundleTransformer.LessLite.

Ситуация в корне изменилась, когда вышел Twitter Bootstrap 3.0. Исходники таблиц стилей Bootstrap 3.0 были написаны на LESS 1.4.X, а библиотека dotless на тот момент поддерживала более старую версию LESS (поддержка LESS 1.4.X появилась в dotless только в декабре 2013 года). Фактически все перечисленные инструменты для работы с LESS в одночасье стали морально устаревшими.

Читать далее…

HTML-минимизация в Web Essentials 2013

Логотипы Web Essentials и WebMarkupMin

Одним из наиболее существенных нововведений для веб-разработчиков в Visual Studio 2013 стал новый HTML-редактор. В отличие от старого редактора, который представлял из себя смесь из управляемого и неуправляемого кода (и даже использовал некоторые компоненты FrontPage), новый редактор был полностью переписан на управляемом коде (в качестве основы использовался HTML-редактор из WebMatrix).

Стоит отметить, что для ASP.NET Web Forms (файлы с расширениями .aspx, .ascx и .master) по-прежнему используется старый редактор.

Помимо улучшенных средств для работы с HTML-кодом, в новом редакторе также реализована поддержка синтаксиса представлений KnockoutJS, AngularJS и Handlebars, и IntelliSense для специальных префиксов и META-тегов (Facebook, Twitter, Open Graph, Windows Phone, iOS и др.).

К сожалению, не каждая новинка из мира веб-разработки может попасть в Visual Studio в силу следующих причин:

  1. Многие современные веб-технологии и библиотеки являются Open Source-проектами (например, компиляторы LESS и CoffeeScript, верификатор JSHint и т.д.), и некоторые из этих проектов имеют лицензии, которые не позволяют включать их в состав коммерческих продуктов.
  2. Сейчас веб-технологии развиваются настолько быстро, что их поддержка средствами разработки может стать неактуальной в течение одной недели. Поэтому ни частые релизы Visual Studio (сейчас период между релизами сократился с двух лет до одного года), ни периодические обновления не позволяют поддерживать Visual Studio в полностью актуальном состоянии.

Для того, чтобы решить перечисленные выше проблемы сотрудником компании Microsoft Мэдсом Кристенсеном было создано VS-расширение Web Essentials. Исходный код Web Essentials опубликован на GitHub (доступны 2 версии: 2012 и 2013).

Ниже перечислены дополнительные возможности HTML-редактора из Visual Studio 2013, которые становятся доступными после установки Web Essentials 2013:

  1. Поддержка Zen Coding (более подробную информацию об использовании Zen Coding в Web Essentials можно прочитать в статье Джона Папа «Zen Coding in Visual Studio 2012») и генератор текста-«рыбы» Lorem Ipsum (например, если ввести lorem10 и нажать клавишу TAB, то в код будут вставлены 10 слов из трактата Цицерона «О пределах добра и зла»).
  2. Команда Go To Definition для тегов <a>, <style> и <script>.
  3. HTML-минимизация выделенного фрагмента кода.
  4. Поддержка HTML-регионов (например, <!--#region main--> Какой-то код… <!--#endregion-->).

Поскольку HTML-минимизация в Web Essentials 2013 была реализована средствами библиотеки WebMarkupMin, автором которой я являюсь, то в этой статье мы рассмотрим данную возможность более подробно.

Читать далее…

Сравнение эффективности минимизаторов CSS- и JavaScript-кода (Сентябрь 2013)

Логотипы модулей-минимизаторов из Bundle Transformer

За прошедшие, с момента публикации предыдущего обзора, 3 месяца уже успели обновиться почти все рассмотренные алгоритмы минимизации (кроме, Packer`а). Кроме того в Bundle Transformer появился новый модуль-минимизатор на базе Clean-css — BundleTransformer.CleanCss.

При подготовке данного сравнительного обзора были учтены следующие пожелания читателей:

  1. В предыдущем обзоре в качестве исходных файлов использовались: bootstrap.css и bootstrap.js из Twitter Bootstrap 2.3.2, из-за чего достоверность результатов была низкой. В новом же обзоре размер выборки был увеличен: для сравнения были отобраны 7 JS-файлов и 5 CSS-файлов из 10 популярных Open Source-проектов.
  2. Теперь в сравнении минимизаторов CSS-кода также участвуют встроенные средства минимизации препроцессоров LESS и Sass.
  3. Как известно, Bundle Transformer минимизирует каждый файл по отдельности и затем производит объединение минимизированного кода в один файл. Данный механизм сделан для того, чтобы предотвратить повторную минимизацию предварительно минимизированных файлов. Другие аналогичные библиотеки сначала объединяют код файлов, а затем минимизируют этот объединенный файл. Поэтому для полноты картины мы произведем 2 сравнения: сначала сравним эффективность минимизаторов на файлах, полученных путем объединения минимизированного кода, а затем на файлах, полученных путем минимизации объединенного кода файлов.

Как и в предыдущем обзоре, для минимизации файлов мы будем использовать модули Bundle Transformer, а для измерения размеров полученных файлов – расширение YSlow.

Читать далее…

Результаты опроса «Чем вы минифицируете внешние стили и скрипты в ASP.NET?»

В эту среду на Хабре стартовал опрос «Чем вы минифицируете внешние стили и скрипты в ASP.NET?», целью которого было определить наиболее популярные инструменты клиентской оптимизации для ASP.NET, с помощью которых можно «на лету» минимизировать код внешних стилей и скриптов. В список вошли следующие инструменты клиентской оптимизации:

В опросе приняли участие 213 русскоязычных ASP.NET-разработчиков. Привожу результаты опроса:

Круговая диаграмма с результатами опроса «Чем вы минифицируете внешние стили и скрипты в ASP.NET?»

Читать далее…

Сравнение эффективности минимизаторов CSS- и JS-кода

Логотипы модулей-минимизаторов из Bundle Transformer

Разработчики, использующие Bundle Transformer, часто спрашивают у меня: «Какой минимизатор обладает самой высокой степенью сжатия?». В принципе, в сентябре прошлого года в своей статье «Вышел Bundle Transformer 1.6.2 или что изменилось за полгода?» я уже проводил сравнение минимизаторов по степени сжатия кода, но это сравнение было поверхностным и не было подкреплено цифрами.

В этой краткой статье мы проведем сравнение наиболее популярных алгоритмов минимизации CSS- и JS-кода на примере адаптеров-минимизаторов из Bundle Transformer. В качестве исходных файлов будут использоваться файлы bootstrap.css и bootstrap.js из Twitter Bootstrap версии 2.3.2. Измерять размеры файлов мы будем с помощью YSlow.

Читать далее…

Бандл… Пара-пара-па хэй! или Bundle Transformer шагает по планете

Упоминания о Bundle Transformer в Интернете

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

Я решил выяснить, почему мной заинтересовались спамеры, и после нескольких часов гугления, понял, что мой Open Source-проект Bundle Transformer стал пользоваться популярностью. Я обнаружил большое количество упоминаний о Bundle Transformer в блогах и твиттер-лентах зарубежных технических специалистов. Среди этих упоминаний есть и серьезные технические статьи:

Читать далее…

Отслеживать

Get every new post delivered to your Inbox.