I'm trying out MVC 4 Beta's bundling and minification thru System.Web.Optimization. I was hoping that the site I'm using it for would receive a 304 (Not Modified) when I hit refresh.
I thought the point of the src to my js bundle, /desktop-js-bundle?v=D33JhbMl9LHkXSPBj1tfRkRI0lHeYVmbSMQqD59bXHg1 (with that version #), was that the version # changed only when one of the files in the bundle on the server was modified. Yet, every time I hit refresh and monitor the Network tab in Chrome's F12, it makes a request with that same version number and gets a 200 status.
Why doesn't it just return 304?, which would decrease the load and increase perf a decent amount. Thanks!
Why doesn't it just return 304?
Because when you hit F5 you expire the cache of your browser. Basically your test is flawed. You should put links to this bundle in different pages (using the <script> tag). Then you should navigate to those pages using hyperlinks. Now observe the Network tab.
Also make sure you are running in Release mode.
UPDATE:
OK, after digging a little more here's what I found out. The 200 HTTP status code is indeed always sent which is normal. But the second time the bundle is fetched from the cache.
Here's the first request:
We can see that in this case the bundle comes from the server with HTTP cache response headers.
And here's the second request:
We can clearly see in this second screenshot that the bundle is served from the cache. Notice how the entire line is grayed. The HTTP 200 status code is fictional => the client doesn't even send an HTTP request to the server as it retrieves the bundle directly from its cache.
And I can observe the same thing in Google Chrome.
For the first request:
And for the second request:
I had the same issue and the problem was with Microsoft.AspNet.Web.Optimization package. As described here: http://aspnetoptimization.codeplex.com/workitem/127, versions 1.1.2 - 1.1.3 are affected. After downgrade to 1.1.1 it works fine and 304 is returned for non-changed resources after refresh.
You can do it in Package Manager Console with following commands:
PM> Uninstall-Package "Microsoft.AspNet.Web.Optimization"
PM> Install-Package "Microsoft.AspNet.Web.Optimization" -Version 1.1.1
Related
We have a build.js code in our project which makes a duplicate of our client directory and adds a folder inside src.
example -
client/src/components will become dist/src/abcxy/components
abcxy will change every time we create a new build.
Now the problem is that the browser tries to find the old dist files from the cache and is unable to find them, instead of finding new files it gives an error in the console.
The error changes depending on the browser I am using
EXAMPLE ERROR - Failed to load ‘http://localhost/src/pbtsg/components/report/reports.js’. A ServiceWorker intercepted the request and encountered an unexpected error.
I'm trying to do some work for a client, but cannot get their bigcommerce site running locally. I have installed stencil CLI (v3.1.1) and downloaded the theme from the bigcommerce dashboard (all files). from the root of the theme i ran "stencil init", then "npm i" and "stencil start".
when i run stencil start, it throws an error saying there's no config.json file.
this is the error i get
How do i generate the config.json file?
The only config file I see is config.stencil.json.
I have also tried running "stencil pull" in hopes that it would pull the config, but it throws another error: "not ok -- Error: Could not fetch active theme details for channel 1: Request failed with status code 404"
Stencil-cli version:
3.1.1
Node version:
12
NPM version:
6.14.15
OS:
mac big sur
Stencil 3.1.1 has been deprecated for some time now. I believe the current version is 3.8. As of 4 months ago, anything below 3.5 will not run (https://developer.bigcommerce.com/changelog#publications/required-stencil-cli-version-set-to-3-5-0).
If you don't have a config.json file in your project, you will need to get the one from the client's store. Try downloading their theme again. It should come through.
Edit: It is possibly the case that you need a new API token. Try making a new one for your store. Make sure the following scopes are set:
Themes: Modify
Settings & Information: Modify
Sites & Routes: Read-only (or Modify)
Documentation for creating a new API account: https://support.bigcommerce.com/s/article/Store-API-Accounts#creating
This is a quick question:
I'm performing an ng serve
--env=dev100 --aot (the dev100 is our remote server)
The element:
<app-layout></app-layout> **<--- LOOKS LIKE THIS upon completion. EMPTY!**
But, I don't get this issue with I simply do ng serve on my local box.
I've never seen this happen and there are no errors.
Thoughts?
Due to the wonkiness of angular 5's compiler, I had a dead component (something I wasn't using) and had the same signature, per se, as the one that was not being loaded.
EX:
<app-layout></app-layout> <-- NOT BEING LOADED
<app-layout-popover></app-layout-popover> <-- NOT BEING USED
My thought is that the compiler saw only the first part
After I removed the dead component, it compiled and everything's working.
I have gone through this post to run an application in production, but facing an issue.
https://www.ibm.com/developerworks/community/blogs/dhuyvett/entry/the_dojo_library_in_worklight_studio_v6_0?maxresults=15&lang=en
I have created a Worklight 6 hybrid application, listed below is a series of tasks that I performed on it.
I built and deployed the project with the 'Provide Library Resources' checked and I get a list of missing files (a few stated below) in the dojo library requests console and the application works fine.
[[2013-11-14 11:02:48] Application 'SampleBankingApp' requested a
missing resource. Providing library resource:
/dojoLib/toolkit/dojo/dijit/form/DateTextBox.js
[2013-11-14 11:02:48] Application 'SampleBankingApp' requested a missing resource. Providing library resource:
/dojoLib/toolkit/dojo/dijit/form/FilteringSelect.js
[2013-11-14 11:02:48] Application 'SampleBankingApp' requested a missing resource. Providing library resource:
/dojoLib/toolkit/dojo/dijit/Calendar.js]
I copied the missing files into the www folder keeping the folder structure as required, then I built and deployed the app with the 'Provide Library Resources' checked and I still get the same list of missing files in the dojo library requests console and the application also works fine.
Now I built and deployed by unchecking 'Provide Library Resources', when I tried to use the app it doesn't work, and the chrome console (where i use the mobile browser simulator) gives a series of errors like Failed to load resource: the server responded with a status of 404 (Not Found).
Whatever missing files it states in the dojo library requests console is in place inside the www folder, don't know whats going wrong.
I am using Eclipse Juno + Worklight6 + Dojo, any help would really be appreciated.
I think you may be failing on copying the resources to the correct path in the "www" folder.
For example, if you are missing /dojoLib/toolkit/dojo/dijit/form/DateTextBox.js, then you should copy that file into your_project/www/dijit/form
I am implementing the bundling and minification support in MVC4 and it appears as though it is making my javascript files bigger than if they weren't bundled/minified. I am using the latest build available in nuget (pre-release option on). I have the following bundle set up in my RegisterBundles class.
bundles.Add(new ScriptBundle("~/bundles/baseJS").Include(
"~/Scripts/jquery-1.7.1.js",
"~/Scripts/jquery.cookie.js",
"~/Scripts/jquery-ui-1.8.11.js",
"~/Scripts/bootstrap.js",
"~/Scripts/jquery.pjax.js",
"~/Scripts/kendo/2012.1.515/js/kendo.all.min.js",
"~/Scripts/jquery.jstree.js",
"~/Scripts/jquery.unobtrusive-ajax.js",
"~/Scripts/jquery.validate.js",
"~/Scripts/jquery.validate.unobtrusive.js",
"~/RIS.Scripts/PostJson.js"));
And I am loading it into my _Layout.cshtml using
#Scripts.Render("~/bundles/baseJS")
When I add up the bytes received in Fiddler for these scripts in debug mode I get the following
Name Size(bytes)
jquery 98013
jquery cookie 1455
jquery ui 124704
bootstrap 52378
pjax 8138
kendo.all 219751
jstree 55045
unobtrusive-ajax 2492
validate 13323
validate-unobtrusive 5138
postjson 634
Total 581071
And when I run it on my production server I get the following from fiddler for the entire js bundle.
Bytes Received: 999,396
What is going on here? Most of the files are minified to some extent, but it shouldn't almost double the size of my payload.
Additional details-
When I download the js files off my local dev box (fiddler reported size 379kb) and the server (fiddler reported size 999kb) and put them in kdiff they are binary identical. When I look in Chrome's developer tools network tab, the local server downloads 379kb, but the 'Parser' value is 975kb. What is this parser value. Could it be that there is some IIS compression setting that is not set in my server but is on my local IIS server? The only difference I note is the fact that the IIS Express I am running on my dev machine is 8.0 where the server is IIS 7.5.
Most likely what you are seeing here is some of the debug/release 'magic' that comes from the FileExtensionReplacementList.
Let's take jQuery for example. Typically in your scripts folder you will see two copies of each file, i.e. jquery-1.6.2.js and jquery-1.6.2.min.js.
By default optimization will use the min.js version when debug=false, and use the regular jquery-1.6.2.js when debug=true, since typically that makes debugging easier (no bundling and no minification of the bundle).
This file selection 'magic' is controlled via the FileExtensionReplacementList on BundleCollection.
In the next release (RTM), there will be a bit more granularity in this list, as typically developers will want to target when these are should be used, i.e.
list.Add("min", OptimizationMode.WhenEnabled);
list.Add("debug", OptimizationMode.WhenDisabled);
You have the bundling option working, but the minification is done by an BundleTable.EnableOptimizations = true setting and some "transform" options that you've haven't engaged. See CssMinify and JsMinify.
Something along the lines of:
var b1 =new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-1.*");
b1.Transforms.Add(new JsMinify());
bundles.Add(b1);
- and -
BundleTable.EnableOptimizations = true;