I have two resource on my website (png files) that are showing as Pending when I load the page. However, the files did load properly. I guess this occurs because the images were loaded from the browser cache as displayed in the Size column.
Is it expected that a resource loaded from cache will show Pending in the Time column? If this is the case, why is this not the same for the deployment.js file? It shows it was loaded from cache but we can see it took 1ms to load. In this case, all three resources (js and pngs) have loaded successfully, hence the confusion. Thanks.
I notice that the resources that have pending next to them are from external domains. Could it be a cross domain 'issue'?
Anything retrieved from cache should still have a 'time' assigned to it, so it's not directly related to the fact it's from cache.
Related
I've made an analysis in OBIEE which searches for a file in the analyticsRes folder on the server.
The column formula looks like this : ''||"Afdeling"."Afdeling"||''
It downloads the correct file according to the filter you're applying on the dashboard. This works perfectly fine, except for browser cache.
We found out that the browser caches the file behind this link, so when a new one is put on the server, the old one still gets downloaded.
Can I disable browser cache for this analysis only OR for the whole dashboard (is this a good idea?) so that users will always download the newest version of the file?
I've tried adapting the instanceconfig.xml file according to this:
<ServerInstance>
<Cache>
<CatalogXml>
<!-- Remove from the cache everything older than N minutes -->
<MaxAgeMinutes>240</MaxAgeMinutes>
<MaxLastAccessedSeconds>14400</MaxLastAccessedSeconds> </CatalogXml>
</Cache> </ServerInstance>
But this isn't the cache used for my issue.
I expect the analysis to be able to always look on the server for the file, but now it caches the file for a long time. It would be also okay if the cache would expire after 24h.
Thanks!
No. You have zero influence on browser cache from inside OBIEE. The cache above is OBIPS cache, not browser cache.
I opened my website in Chrome last night, then closed that tab, but didn't close browser. Today I failed to open my site in a new tab because jQuery(not use CDN) hits a syntax error: unexpected end of input.
My site always hits this error no matter how many times I refresh. But the error didn't happen again after hard refresh.
This problem happens many times in recent months.
I checked Chrome devtool, it says my jquery.min.js is loaded from memory cache. And it is not a whole file, only contains part of jquery library. That's why I got syntax error.
I did some research from google:
The lifetime of memory cache is attach to the lifetime of render process, which roughly corresponds to a tab.
So if I create a new tab to visit my site, stands to reason, jQuery should not be loaded from memory cache.
I expect browser do not load my files from memory again if I visit site in new tab.
Is there anything I can do to locate the problem source and fix it?
EDIT (2019-05-13):
Today hit this error again, but fortunately, I found new point seems helpful to this problem.
This is that request:
See status code is 206 Partial Content (from memory cache).
And I have no idea why my request header contains 'Range' field.
You can't detect newtab in browser and load your jquery.min.js,But you can avoid loading from cache by adding timestamp into suffix of your lib like follows.
http://yoursite.com/lib/js/jquery.min.js?1557301884
You can achieve this in two ways
Case:1 If you are using server side page rendering means(PHP,JSP) just print the timestamp
Case:2 If Client side means some javascript stuff you have to do
In one of the online documents that talks about appcache for HTML5, it indicates that the cached files get updated once an offline user reconnects. I checked the original HTML5 appcache definition by W3, and I am not able to find anything that supports this statement.
Does anyone know if this is to be true?
Thanks in advance
MDN says the following, although if you scroll up on that page it says it's being deprecated.
If an application cache exists, the browser loads the document and its associated resources directly from the cache, without accessing the network. This speeds up the document load time.
The browser then checks to see if the cache manifest has been updated on the server.
If the cache manifest has been updated, the browser downloads a new version of the manifest and the resources listed in the manifest. This is done in the background and does not affect performance significantly.
And logic tells me that it would also depend on the app you're using, server you're trying to connect to and any special settings it might have, how long your browser keeps it's history, what it keeps, and if you saved the page to view offline - whether or not you have all the code/images saved in the right location(s).
Example:
Imagine you saved a page to view offline, and that page has a JS event handler that ran a while loop that did an ajax request every n seconds to do something, like make a number on a page change as long as you were online... As long as the loop is running, you suddenly connect to the internet, and it makes the request to the proper url with the right arguments, then it should go through, even though the url in your browser might say something like file:///C:/Users/you/Desktop/....
I've done this before, even though my url was like the one above. One time I was using braintree's drop-in javascript to a website, and using it's api on my backend. Trying to load the page when offline = Nothing. Online = Updated the spot on the page just fine when I had the required arguments, and it was pointing to the right url. If I got offline again, I could refresh the page, see the same images loaded in the <div>, but I couldn't send any data with it.
I have been trying to figure out HTML5's new AppCache, but I feel extremely limited here.
Let's assume that I have a website with four pages:
index.html
about.html
portfolio.html
contact.html
I have the above resources outlined in the manifiest, along with all of the website's resources. The manifest looks like the below:
CACHE MANIFEST
# 2013-05-23 2:33 PM
# Master Manifest
index.html
about.html
portfolio.html
contact.html
styles/reset.css
styles/styles.css
NETWORK:
*
I have added the appcache file type to the server configuration and have used the correct HTML tag attribute on each page listed above. Just for the record, the element looks like so:
<html lang="en" manifest="example.appcache">
I have tested this setup out on my mobile device, and everything works perfectly fine... Unless I don't load every page. It seems that I have to go to each page and cache it via my mobile browser, after which I may turn off DATA and go offline for my device to be able to browse the APPCACHE'd website.
But, here's my question - How do I setup AppCache to allow me to go to index.html, cache that page, and cache the rest of the resources in the manifest? Without having to visit and manually cache each resource?
If you cannot, then I would have to ask; doesn't that sort of defeat the idea behind AppCache and Offline Accessibility?
Thank you so much for the help all! :)
You shouldn't need to visit every page. I know you mentioned you've set the MIME type in Apache, but are you 100% certain it's working correctly?
You can check it by opening your manifest in a browser and checking the Response Headers in Chrome Web Inspectors's Network tab:
Content-Type should be text/cache-manifest
It's a bit hard to debug without having access to your site, but here's some instructions for how to interpret what happens in Chrome's Web Inspector with AppCache to help you debug the problem yourself:
The Resources tab will show you the contents and status of the Application Cache. It looks like this whilst it's downloading files:
The console will also log events when it's downloading:
Application Cache Progress event (0 of 48) http://cachedfile.url
Once it's done downloading it'll look like this and show you the list of cached files:
When you go back it'll log three events (assuming there aren't any changes):
Document was loaded from Application Cache with manifest http://manifest.url
Application Cache Checking event
Application Cache NoUpdate event
And then when you're offline it looks like this:
Hopefully between the console and the appcache table you'll be able to figure out what's happening.
The manifest file is correct and you do not need to visit each page to get in cache in your mobile. You could try if this is a problem with your mobile or browser and if you have defined in your server text/cache-manifest MIME type.
The appcache will only store the cache the first time it's downloaded. It's just a list of files that says, when it's downloaded the first time, cache it.
What you could do is after load in the background do an ajax call to load each of the intended resources but it's not particularly pretty.
So looks to me like it's acting how it should be.
CACHE:
This is the default section for entries. Files listed under
this header (or immediately after the CACHE MANIFEST) will be
explicitly cached after they're downloaded for the first time.
http://www.html5rocks.com/en/tutorials/appcache/beginner/
Ahmed
I get the following when visiting your site:
Creating Application Cache with manifest
http://www.iamaaron.com/appcache/example.appcache
Application Cache Checking event
Application Cache Downloading event
Application Cache Progress event (0 of 6)
http://www.iamaaron.com/appcache/styles/reset.css
Application Cache Progress event (1 of 6)
http://www.iamaaron.com/appcache/index.html
Application Cache Progress event (2 of 6)
http://www.iamaaron.com/appcache/contact.html
Application Cache Progress event (3 of 6)
http://www.iamaaron.com/appcache/attendees.html
Application Cache Progress event (4 of 6)
http://www.iamaaron.com/appcache/events.html
Application Cache Progress event (5 of 6)
http://www.iamaaron.com/appcache/styles/styles.css
Application Cache Error event: Resource fetch failed (404)
http://www.iamaaron.com/appcache/styles/styles.css
So, it looks like it's working correctly despite the Content-Type being empty, except for the CSS file which seems to be missing (the URL is wrong, it should be main.css by the looks of things).
BUT my developer tools don't show the app cache being filled and it doesn't work when it's offline.
Try and fix your 404 error with the CSS and make sure your apache it configured correctly to return the correct Content-Type, I reckon that's what's causing issues.
Every URL can be linked to a single cache manifest. But I want several cache manifests linked to a same URL. Here is the reason:
Some files I want to be cached are rarely updated and large.
So everytime the cache gets updated these large files get re-downloaded even though they may not have been changed.
So I want to split up the cache. One cache for theses rarely updated large files and another cache for the often updated light files.
Do you guys have any idea how to split up an HTML5 cache?
The most efficient way is:
a) Use far-future expiration date (max-age) on all resources mentioned in manifest's CACHE section and add timestamp suffix to each file in the CACHE section, e.g.:
CACHE:
menu_1355817388000.js
toolbar_1355817389100.js
b) When any of the above files change on the server, regen/update manifest to change the timestamp. Only the file with the modified timestamp will get downloaded next time. Mission accomplished.
Note: Reload the page twice in the browser, as on the first refresh browser downloads just the manifest and uses old cached resources to paint the page. This is done to speed up displaying the page (there are tricks to handle this issue of double refresh, but they are outside the scope of your question)
See more info in this long but best article I ever seen on appcache.
Use an iframe
Your page's cache manifest would include the light files and the cache manifest of an iframe loaded by this page would include the large files
On chrome the iframe's application cache will also be used for the page. I didn't tested this method on other browsers yet.
see a live example at http://www.timer-tab.com and if you are using chrome see its split up cache at chrome://appcache-internals/
When the manifest file is changed and the files of the application cache are downloaded again, the normal HTTP caching rules still apply. This means that if you set the correct HTTP caching headers for these large files, you'll get a 304 so these files are not downloaded again. So it's not necessary to split the application cache.
Maybe an answer but I'd more like to shed some light on my findings as a I troubleshoot my own webapp.
I've discovered that I can use 2 iframes (manifest_framework) and (manifest_media) to load the manifests, but i'm still not exactly clear how they are targetted, but I had limited success.
manifest_framework:
CACHE MANIFEST
CACHE:
appdata.ini
dialog.png
jquery.min.js
login.htm
login.js
manifest.appcache.js
NETWORK:
*
FALLBACK:
manifest_media:
CACHE MANIFEST
CACHE:
manifest_fwk.php
od/audio_track_1_1.m4a
od/audio_track_1_2.m4a
od/audio_track_1_3.m4a
od/audio_track_1_4.m4a
od/video_1.mp4
od/video_2.mp4
od/video_3.mp4
NETWORK:
*
FALLBACK:
./ webapp.php
./index.php is the page the 'landing page' which itself isn't cached but falls back to webapp.php when offline.
What I don't understand is how these link to the webapp.php page.
I am finding I can only get access to one or the other manifests cache.
The above works in mobile safari, the media would be cached, and image but not necessarily the JS or images in the framework manifest.
Anyone have more examples where multiple manifests are referenced from the one URL/page?
The W3C working group has abandoned the file system api, so it SHOULD NOT BE USED anymore.
We'll likely see it fall off the next version of Chrome.
http://www.w3.org/TR/file-system-api/
CACHE MANIFEST
# This is a comment.
# Cache manifest version 0.0.1
# If you change the version number in this comment,
# the cache manifest is no longer byte-for-byte
# identical.
demoimages/mypic.jpg
demoimages/yourpic.jpg
demoimages/ourpic.jpg
sr/scroll.js
NETWORK:
# All URLs that start with the following lines
# are whitelisted.
# whitelisted items are needed to help the site function, you could put regularly
# changing items here
http://example.com/examplepath/
http://www.example.org/otherexamplepath/
CACHE:
# Additional items to cache.
demoimages/allpics.jpg
FALLBACK:
demoimages/currentImg.jpg images/stockImage.jpg`
If the Iframe trick does not work, use the HTML5 FileSystem API
See http://updates.html5rocks.com/2012/04/Taking-an-Entire-Page-Offline-using-the-HTML5-FileSystem-API