Самый быстрый способ загрузить много js-файлов и переменных

Question

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

Как я бы сделал в C# и ASP.Net, конечно, я попытался разделить функции/переменные на кучу js-файлов для категорий, например. 1 файл для моих «Целей», 1 файл для моих «комиссий» (которые являются частью моего приложения) ...

Теперь я почти закончил свою работу здесь, и у меня получилось от 20 до 25 файлов js, который я загружаю один после antother в моем default.aspx ...

Это действительно правильный (и самый быстрый) способ справиться с этим?

Answer 1

Существуют различные инструменты, которые могут пригодиться для этого. Я бы порекомендовал использовать GruntJS http://gruntjs.com/, который имеет множество инструментов/скриптов, готовых к внедрению, и принять некоторые из решений grunt из-за развертывания готового к производству кода, который вы пытаетесь сделать.

https://www.erianna.com/using-grunt-to-minify-and-compress-assets

Довольно более Hacky решение в краткосрочной перспективе является использование YSlow на поджигатель, который с помощью вкладки tools` позволяет Минимизировать все JavaScript на данной странице, вывод в виде текста. Затем вы можете сохранить это как один файл js, а затем ссылаться только на страницу, которая должна быть достаточной для целей тестирования, и если JS-код не изменится.

Answer 2

Bundling and minification фактически новая функция ASP.Net 4,5

Вы можете увидеть его, создав новую ASP.Net MVC 4 веб-приложений с помощью Visual Studio и использовать шаблон веб-приложений, он создает Bundle Config класс, который, вероятно, делает то, что вы хотите:

public class BundleConfig 
{ 
    // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725 
    public static void RegisterBundles(BundleCollection bundles) 
    { 
     bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
        "~/Scripts/jquery-{version}.js")); 

     bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
        "~/Scripts/jquery-ui-{version}.js")); 

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

     // Use the development version of Modernizr to develop with and learn from. Then, when you're 
     // ready for production, use the build tool at http://modernizr.com to pick only the tests you need. 
     bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
        "~/Scripts/modernizr-*")); 

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

     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", 
        "..." 

    } 
} 

Этот пакет класса конфигурации должен быть назван по методу Application_Start():

BundleConfig.RegisterBundles(BundleTable.Bundles); 

Answer 3

Вы можете настроить комплект в ASP.NET (в зависимости от версии, использующей MVC 4 или веб-формы с asp.net 4.5+). Как уже отмечалось, у вас есть класс со следующим статическим методом:

public static void RegisterBundles(BundleCollection bundles) 
    { 
     bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
        "~/Scripts/jquery-{version}.js")); 

     ... 
     //your custom files 
     bundles.Add(new ScriptBundle("~/bundles/customjs").Include(
        "~/Scripts/js/file1.js", 
        "~/Scripts/js/file2.js")); 
    } 

Вы можете добавить их на свою страницу MVC:

@Scripts.Render("~/bundles/customjs") 

Я думаю, что веб-формы что-то вроде:

<%: Scripts.Render("~/bundles/customjs") %> 

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

Существует предостережение, если вы уже сведены к минимуму, я, кажется, помню, что файл не будет загружен.

Однако, если вы используете более старую версию ASP.NET, и вы хотите минимизировать, вы также можете использовать Web Essentials для минимизации каждого файла.