When a browser has JavaScript disabled, is the request for the .js files still made to the server (ie the files still end up downloaded on the client, but not parsed) ?
The reason I'm asking is to see if it's worth implementing lazy-loading JavaScript files as to prevent the browser from requesting them if JavaScript is disabled; ie only having a small file that does the lazy-loading which then loads the larger files, so that the large files are not requested if JavaScript is disabled in the browser.
No, it won't.
Related
I have a PWA which has been developed in ASP.net Core and hosted on an Azure App Service (Linux).
When a new version of the PWA was released, I found that devices failed to update without clearing the browser cache.
To resolve this, I discovered a tag helper called asp-append-version that will clear cache for a specific file. I also discovered that I can append the version of the src attribute that specifies the URL of a file to trigger the browser to retrieve the latest file. For example, src="/scripts/pwa.js?v=1". Each time I update the pwa.js file I would also change the version i.e. v=2.
I’ve now discovered that my PWA is caching other JavaScript files in my application which results in the app not working on devices that have been updated to the new version however failed to clear the cache on specific files.
I believed that if I didn’t specify any cache control headers such as Cache-Control that the browser would not cache any files however this appears not to be the case.
To resolve this issue, is the recommended approach to add the appropriate Cache-Control headers (Cache-Control, Pragma, and Expires) to prevent browser caching or should I only add the tag helper asp-append-version to for example scripts tags to auto clear cache for that specific file?
I would preferably like the browser to store for example images rather than going to the server each time to retrieve these. I believe setting the header Cache-Control: no-cache would work as this would check if the file has changed before retrieving the updated version?
Thanks.
Thanks # SteveSandersonMS for your insights, In your web server returns correct HTTP cache control headers, browsers will know not to re-use cached resources.
Refer here link 1 & link 2 for Cache control headers on Linux app service
For example, if you use the "ASP.NET Core hosted" version of the Blazor WebAssembly template, the server will return Cache-Control: no-cache headers which means the browser will always check with the server whether updated content is present (and this uses etags, so the server will return 304 meaning "keep using your cached content" if nothing has changed since the browser last updated its content).
If you use a different web server or service, you need to configure the web server to return correct caching headers. Blazor WebAssembly can't control or even influence that.
Refer here
We are developing an application for Web. Inside that application, to download a file, I have created a WCF Rest service that will download the files based on this link Download using WCF Rest. The purpose is to check for user authentication before downloading. I used streaming concept to download the file. It is now that I have found out few things
When the user downloads the file, he is not able to determine what are the file size and the time remaining. I analyzed and found out that the reason is because, it’s using the “Transfer Encoding: chunked” in the header so that the file will be downloaded in chunks. One of the advantages is that the memory consumption is less in the server even when there are many users downloading a file. So I thought of adding “Content-Length” header, but I found out that you can use only either one of the headers not both. So I was thinking how Hotmail and Gmail were downloading attachments. From my investigation, I found out that Hotmail uses chunking header whereas Gmail uses Content-length header. Also in the case of Gmail, it is also checking if the session is active or not then downloads the file accordingly. I want to achieve the following
a) Like Gmail, I want to check if the session is active or not and then downloads the files accordingly. What will be the method for me to implement it?
b) When downloading the file, I want to use Content-Length header instead of Chunked header. Also the memory consumption should be less. Can we achieve it in WCF Rest? If so how?
c) Is it possible for me to add a header in WCF that will display the file size in the browser Downloads window?
d) When downloading an inline images from WCF, I found out that the image after loading is not cached in local machine. I was thinking that once an image is shown in an HTML page, it will get automatically cached and the next time user visits the page, the image will load from cache instead from server. I want to cache the inline images to cache, what is the option that I can use for it? Are there any headers that I need to specify when downloading an inline image from server?
e) When I download a zip file using WCF in IPhone Chrome browser, it’s not downloading at all. But the same link works in Android Chrome browser. What could be the problem? Am I missing header in WCF?
Are there any methods that will achieve the above?
Regards,
Jollyguy
I have a script that is used across multiple pages on my site. I want to set the expires header so that browsers cache it and it doesn't get downloaded every time. That's ok and I understand how to do that, but I don't quite know how the browser works.
Does the browser cache it according to its path and then is it smart enough to know that any page requesting the script should use the cached version, or is there an association between the script and the page and therefore it would have to be cached against each page?
In the browser cache, there is no connection between the URL and the requesting page. Browser cache keys contain the path and sometimes the query string (see Is it the filename or the whole URL used as a key in browser caches?).
That's why Google recommends using their Libraries API: If every page that requires a specific version of jQuery pointed the browser to fetch the library from Google, the browser would fetch it only once for www.xyz.com and then re-use it from its cache for www.abc.com.
I went to Twitter's resource page here (https://twitter.com/about/resources/tweetbutton) and got the following code:
Tweet<script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
When I put this in my Wordpress template, I don't get the Twitter button -- I just get the text "Tweet". However, when I change the src for widgets.js to include https:// or http:// at the beginning it works.
Could it be that it's just an error that they forgot the protocol? Also, do you think it is better to use https (for consistency with the share link) versus http, or does it not matter?
Thanks for your suggestions.
The URL "//example.com/script.js" tells the browser to open the URL using the protocol of the current page, which is likely to be "file://" if your browser opened an html file on your own machine. Of course, you don't have a file called "file://example.com/script.js" on your computer.
In the past, urls for embedded widgets used to include the protocol (http or https), but a site visitor would receive warnings whenever a secure page loaded a script from an insecure page, and sometimes even vice versa. Now, widgets from Twitter, Google Analytics, and other sites no longer specify the protocol so that the same embed code can work on any page on the internet. The downside is that this does not work when you embed such a widget into a file and view it on your own browser by double-clicking it!
I have an application that loads a web page in the browser and saves it to custom local folder (images, html, css). In the process the "src" attribute of images (in html) and "background-url" property (in css) need to be changed to reflect the locally saved files rather than the original ones. This generates extra web traffic as changing them forces the browser to download the files from modified locations (the browser does this by resolving the uri of the page with the value of element's "src" attribute - the same for "background-url" property ) and as a result, it generates lots of 404 Not Found requests.
I'm using nsIIOService interface to go offline before saving the page (the page is fully loaded and all network activity so far has been stopped) and then back online after the saving is complete. But then the browser displays an alert box "This document cannot be displayed while offline. To go online, uncheck Work Offline from the File menu." whenever I try to change the aforementioned attributes/properties.
Is there any way to prevent such message from appearing or to make the browser not validate the images because of modified "src" values?
I tried to use DOMWillOpenModalDialog on both the browser and the xul application window, but it seems it's of no use - the dialog still appears. The application is not an user application, so it's difficult when such "built-in" messages appear.
Use preventDefault to stop the modal dialog:
document.getElementById(‘content’).contentWindow.addEventListener(‘DOMWillOpenModalDialog’,function(e){ e.preventDefault(); }, true);
As an alternative, try using disablePrivilege, sandbox, redefining the prompt service, or overriding window.alert.