Подтвердить что ты не робот

Использование jQuery/javascript пакетов ASP.NET MVC4

когда я создал свой проект со стандартным шаблоном MVC4, был включен ALOT из javascript, например: jquery-obtrusive, jquery-validate, нокаут, весь пользовательский интерфейс jQuery.

Сколько стоит хранить и сколько выкидывает? Я заметил, что при создании строго типизированного контроллера созданный вызов create.cshtml вызывает:

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Что именно делает этот файл? Должен ли я держать его? Должен ли я ссылаться на все эти JS файлы, которые были первоначально определены в BundleConfig.cs? Или я не могу потрудиться..?

4b9b3361

Ответ 1

Что именно делает этот файл?

jqueryval не является файлом, он является ссылкой на пакет.

Пакет в MVC4 представляет собой набор скриптов, стилей или других файлов, входящих в один комплект.

У вас будет файл BundleConfig.cs в папке App_Start, в котором будут указаны параметры, в которые файл добавлен в список.

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
            "~/Scripts/jquery.unobtrusive*",
            "~/Scripts/jquery.validate*"));

Как вы можете видеть выше ~/bundles/jqueryval - это виртуальный путь пакета, который объединяет указанные в нем файлы. Поэтому, когда вы увидите это:

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Вышеупомянутые будут включать скрипты, включенные в эту ссылку.

Должен ли я держать его? Должен ли я ссылаться на все эти JS файлы, которые были изначально заданный в BundleConfig.cs?

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

Это сценарии, которые позаботятся об управлении ненавязчивой проверкой, сохраняя ваш DOM красивым и чистым.

Вы можете удалить пакет из курса, если вам не нужна или вы хотите использовать ненавязчивую проверку. Если вы это сделаете, я верю, что вам также понадобится обновить ваш web.config, установив необходимые поля в false, чтобы ваш проект не искал файлы, похожие на это:

<add key="ClientValidationEnabled" value="false" />
<add key="UnobtrusiveJavaScriptEnabled" value="false" />

Преимущества и точная разница между использованием навязчивой и ненавязчивой проверки очень хорошо объясняются в этой статье: Брэд Уилсон: ненавязчивая проверка клиента в ASP.NET MVC 3

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

Судебная и ошибка. Если вы удалите их и найдите случайные исключения в консоли отладчика браузера, попробуйте добавить некоторые из файлов/пакетов обратно.


В общем, объединение также работает со списками стилей:

bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
            "~/Content/themes/base/jquery.ui.core.css",
            "~/Content/themes/base/jquery.ui.resizable.css",
            "~/Content/themes/base/jquery.ui.selectable.css",
            "~/Content/themes/base/jquery.ui.accordion.css",
            "~/Content/themes/base/jquery.ui.autocomplete.css",
            "~/Content/themes/base/jquery.ui.button.css",
            "~/Content/themes/base/jquery.ui.dialog.css",
            "~/Content/themes/base/jquery.ui.slider.css",
            "~/Content/themes/base/jquery.ui.tabs.css",
            "~/Content/themes/base/jquery.ui.datepicker.css",
            "~/Content/themes/base/jquery.ui.progressbar.css",
            "~/Content/themes/base/jquery.ui.theme.css"));

Преимущество разработчика состоит в том, чтобы ссылаться только на отдельный пакет вместо нескольких файлов.

Преимущество клиента заключается в том, сколько пользовательских загрузок требуется браузеру для получения файлов сценариев /css.

Если вы, например, имеете 5 ссылок на файлы в своем представлении, клиентский браузер будет загружать все 5 отдельно, и в каждом браузере есть ограничение на количество загружаемых файлов одновременно. Это означает, что если клиент имеет более медленное соединение, он может подождать несколько секунд, прежде чем файлы будут загружены.

Однако, если у вас есть все 5 файлов, настроенных для одного пакета, браузер загружает только 1 файл, в комплекте.

Кроме того, пакеты масштабируются (или файлы в пакетах), поэтому вы не только сохраняете время, затрачиваемое на загрузку сценариев, но также сохраняете размер загружаемого файла.

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

BundleTable.EnableOptimizations = true;

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

Ответ 2

MVC4 и .Net Framework 4.5 предлагают методы связывания и минимизации, которые уменьшают количество запросов на сервер и размер запрашиваемой библиотеки CSS и JavaScript, что увеличивает время загрузки страницы в производительности простой текстовой страницы, а страница загружается быстрее.

Класс System.Web.Optimization предлагает методы связывания и минимизации, которые существуют в dll Microsoft.Web.Optimization.

Что такое Bundle Пакет - это логическая группа файлов, загружаемых одним HTTP-запросом. Вы можете создать набор стилей и script для css и javascripts соответственно, вызвав метод Add() класса BundleCollection с файлом BundleConfig.cs.

Создание набора стилей

bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.min.css",
"~/Content/mystyle.min.css"));

Создание script bundle

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
 "~/Scripts/jquery-1.7.1.min.js",
 "~/Scripts/jquery.validate.min.js",
 "~/Scripts/jquery.validate.unobtrusive.min.js"));