I'm a bit puzzled. The _layout.cshtml page I have below contains several bundles of .css and .js files. Upon the initial site load, each file in the bundles is processed, which makes sense. However, every time a new view is loaded, each line of code from every file is run through again! For example, jQuery, bootstrap, etc. I even set breakpoints to verify this, and they were triggered every time a new view was accessed.
I was under the impression that the purpose was for the browser to cache these files so they wouldn't need to reload upon each new view being called. Am I missing something here? Perhaps my layout setup is incorrect? Could it be that the files are not actually loading but the code is still being executed (explaining why all my breakpoints are being hit) with each new view?
Is there a way to prevent this and have all the files loaded only once when clients visit the homepage? It's confusing to me why each .js file (like bootstrap) is loaded on every view that gets navigated to!
Below is my layout page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Yogabandy - @ViewBag.Title</title>
@Styles.Render("~/Content/yogabandy-base/css")
@RenderSection("content", required: false)
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
@Html.Partial("_Navbar")
@RenderBody()
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDUWFuy0zfuKe4uig_koh3O6SRDaf40gA4&libraries=places" async defer></script>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/yogabandy-base")
@RenderSection("scripts", required: false)
</body>
</html>