Моя проблема
Для моего веб-приложения начальная загрузка страницы занимает более 20 секунд.На Chrome-Audit -LightHouse отображается ниже информация.
Я не знаю, как решить эту проблему, чтобы ускорить загрузку моей страницы.Я был с этим давно.
Ниже я разместил некоторые подробности о том, как выполняется группирование и рендеринг пакетов в моем частичном макете и главной странице.Любая помощь очень ценится.
Ниже приведен мой пакет js & css файлов.
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));/*2.1.1*/
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate*"));
bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
"~/Scripts/jquery-ui.js"));
// Use the development version of Modernizr to develop with and learn from. Then, when you're
// ready for production, use the build tool at https://modernizr.com to pick only the tests you need.
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.min.js",
"~/Scripts/respond.min.js"));
bundles.Add(new ScriptBundle("~/bundles/signalConnect").Include(
"~/Scripts/SignalScripts/SignalConnectScript.js"));
bundles.Add(new ScriptBundle("~/Content/sliderpips").Include(
"~/Content/jQuery_Slider_Pips/js/jquery-ui-slider-pips.js"));//,
//"~/Scripts/respond.js"));
bundles.Add(new ScriptBundle("~/bundles/highcharts").Include(
"~/Scripts/HighCharts/highcharts.js",
"~/Scripts/HighCharts/highcharts-more.js",
"~/Scripts/HighCharts/exporting.js")
);
bundles.Add(new ScriptBundle("~/Content/TinyDateTimePicker").Include(
"~/Content/TinyDateTimePicker/demo/events.js",
"~/Content/TinyDateTimePicker/calendar.js",
"~/Content/TinyDateTimePicker/datePicker.js",
"~/Content/TinyDateTimePicker/tinyDateTimePicker.js")
);
bundles.Add(new ScriptBundle("~/bundles/signalgen").Include(
"~/Scripts/SignalScripts/SignalGenScript.js"));
bundles.Add(new ScriptBundle("~/bundles/signaldata").Include(
"~/Scripts/SignalScripts/SignalDataScript.js"));
bundles.Add(new ScriptBundle("~/bundles/signaldatacompare").Include(
"~/Scripts/SignalScripts/SignalScript.js"));
bundles.Add(new ScriptBundle("~/bundles/signaldatareport").Include(
"~/Scripts/SignalScripts/SignalReportScript.js"));
bundles.Add(new ScriptBundle("~/bundles/signaldataalarm").Include(
"~/Scripts/SignalScripts/SignalAlarmScript.js"));
bundles.Add(new ScriptBundle("~/bundles/signalmaster").Include(
"~/Scripts/SignalScripts/SignalMasterScript.js",
"~/Scripts/Misc/jscolor.js"));
//bundles.Add(new ScriptBundle("~/bundles/highcharts").IncludeDirectory("~/Scripts/HighCharts","*.js"));
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/site.css"//,
));
bundles.Add(new StyleBundle("~/Content/papercss").Include(
"~/Content/assets/css/paper-dashboard.css",
// "~/Content/assets/css/themify-icons.css",
//"~/Content/Custom/site_layout/css/bootstrap-responsive.min.css"//,
"~/Content/Custom/site_layout/css/site_layout.css"
//"~/Content/3rdCss/flick/jquery-ui.css",
//"~/Content/3rdCss/smoothness/jquery-ui.css"
));
bundles.Add(new StyleBundle("~/Content/jqueryUIcss").Include(
"~/Content/jqueryui.min.css"));
bundles.Add(new StyleBundle("~/Content/sliderpipscss").Include(
"~/Content/jQuery_Slider_Pips/css/jquery-ui-slider-pips.css"));
bundles.Add(new StyleBundle("~/Content/TinyDateTimePickercss").Include(
"~/Content/TinyDateTimePicker/datePicker.css",
"~/Content/TinyDateTimePicker/themes/white/datePicker.css"));
В моем _Layout.cshtml
В начале частичного просмотра (_Lyout.cshtml) Я отрисовал ниже
<title>@ViewBag.Title - Dashboard - IO </title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
В конце частичного представления (_Layout.cshtml) я отрисовал следующие скрипты
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/signalgen")
@RenderSection("Scripts", required: false)
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/highcharts")</body>
в моем index.cshtmlУ меня есть код ниже в конце представления
@section scripts{
@Styles.Render("~/Content/jqueryUIcss")
@Styles.Render("~/Content/sliderpipscss")
@Scripts.Render("~/Content/sliderpips")
@*<!- -SignalR- ->*@
<script src="~/Scripts/jquery.signalR-2.2.2.min.js"></script>
<script src="~/SignalR/hubs"></script>
@Scripts.Render("~/bundles/signalConnect")
<script type="text/javascript">
$(document).ready(function () {
var dModel = @Html.Raw(Json.Encode(Model));
prepareSignalData(dModel);
});
</script>}