Клиентская оптимизация *

Уровень подготовки веб-мастера: любой

А что если объединить профессионалов, работавших над крупными web проектами, чтобы создать исчерпывающее руководство по оптимизации front-end разработки?
И получить в результате не скучную инструкцию, а что то поинтереснее? А если позвать Briza Bueno (Americanas.com), Davidson Fellipe (Globo.com), Giovanni Keppelen (ex-Peixe Urbano), Jaydson Gomes (Terra), Marcel Duran (Twitter), Mike Taylor (Opera), Renato Mangini (Google), и Sérgio Lopes (Caelum) чтобы собрать лучшие практики?

Именно это мы и сделали! Мы научим вас создавать быстрые сайты.

— Zeno Rocha, руководитель проекта.

В начале 2012 года я работал над серией статей о клиентской оптимизации в ASP.NET MVC для журнала MSDeveloper.RU. Всего было опубликовано 2 статьи: «Сжатие JS- и CSS-файлов» и «Менеджеры ресурсов», но в моих планах было написать еще 2 статьи: одну про оптимизацию графики, а вторую про минимизацию HTML-разметки и GZIP/Deflate-сжатие (далее просто HTTP-сжатие). К сожалению, эти планы не удалось воплотить в жизнь из-за нехватки свободного времени (в тот момент, я запускал проект Bundle Transformer) и последовавшего закрытия журнала.

Но недавно я решил вернуться к теме оптимизации HTML-разметки. После небольшого исследования я понял, что под .NET практически не существует полноценных HTML-минимизаторов. Все существующие .NET-решения производят лишь 2 операции: удаление ненужных пробельных символов и удаление HTML-комментариев, из-за чего они очень сильно проигрывают решениям с других платформ. Поэтому я решил написать собственный HTML-минимизатор для .NET, о котором и пойдет речь в данной статье.

Эволюция HTML-минимизаторов

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

Вопреки расхожему мнению, техники минимизации HTML-кода появились намного раньше, чем аналогичные техники для JavaScript. Уже в конце 1998 года Артемий Лебедев в 17-м параграфе ководства «Паранойя оптимизатора» описывал некоторые техники минимизации HTML-кода.

Шаг 1: Найдите анимированную иконку

Шаг 2: Добавьте CSS-правила

.load {
    background: url('images/youricon.gif') no-repeat center;
}

На основе Cookies, для сайтов с общим наддоменом

Хочу поделиться, как это удалось осуществить для одного проекта. Сложность использования других известных методов, заключалась в том, что проект не был привязан к единому доменному имени, а был локализован на сетке из поддоменов. То есть сайты проекта располагались на доменах третьего уровня. Данное обстоятельство вызывало некоторые неудобства из-за Same Origin Police.

1. Объявляем и регистрируем Bundle`ы;
2. Используем Bundle`ы в коде наших представлений.

Какую задачу решаем?